Multi-backend console formatter: ANSI + CSS, semantic palette

package.json

@@ -56,7 +56,6 @@
     "@11ty/eleventy": "^3.1.5",
     "@11ty/eleventy-navigation": "^1.0.5",
     "@stylistic/eslint-plugin": "latest",
-    "chalk": "^5.6.2",
     "eleventy-plugin-toc": "^1.1.5",
     "eslint": "latest",
     "globals": "latest",

src/classes/TestResult.js

@@ -1,6 +1,6 @@
 import Test from "./Test.js";
 import BubblingEventTarget from "./BubblingEventTarget.js";
-import { stripFormatting } from "../format-console.js";
+import { stripFormatting } from "../util/format-console.js";
 import { delay, formatDuration, interceptConsole, pluralize, stringify } from "../util.js";
 import { formatDiff } from "../util/format-diff.js";
 
@@ -358,11 +358,11 @@ ${ this.error.stack }`);
 	 * @returns {string}
 	 */
 	getResult (o) {
-		let color = this.pass ? "green" : this.skipped ? "yellow" : "red";
 		let label = this.pass ? "PASS" : this.skipped ? "SKIP" : "FAIL";
+		let color = label.toLowerCase();
 		let ret = [
-			`<b><bg ${color}><c white> ${ label } </c></bg></b>`,
-			`<c light${color}>${this.name ?? "(Anonymous)"}</c>`,
+			`<b><bg ${color}><c text> ${ label } </c></bg></b>`,
+			`<c ${color}-tint>${this.name ?? "(Anonymous)"}</c>`,
 		].join(" ");
 
 		if (this.messages?.length > 0) {
@@ -392,11 +392,11 @@ ${ this.error.stack }`);
 		];
 
 		if (stats.pass > 0) {
-			ret.push(`<c green><b>${ stats.pass }</b>/${ stats.total } PASS</c>`);
+			ret.push(`<c pass><b>${ stats.pass }</b>/${ stats.total } PASS</c>`);
 		}
 
 		if (stats.fail > 0) {
-			ret.push(`<c red><b>${ stats.fail }</b>/${ stats.total } FAIL</c>`);
+			ret.push(`<c fail><b>${ stats.fail }</b>/${ stats.total } FAIL</c>`);
 		}
 
 		if (stats.pending > 0) {
@@ -431,7 +431,7 @@ ${ this.error.stack }`);
 	 * @returns {string}
 	 */
 	getMessages (o = {}) {
-		let ret = new String("<c yellow><b><i>(Messages)</i></b></c>");
+		let ret = new String("<c message><b><i>(Messages)</i></b></c>");
 		ret.children = this.messages.map(m => `<dim>(${ m.method })</dim> ${ m.args.map(a => stringify(a)).join(" ") }`);
 
 		return o?.format === "rich" ? ret : stripFormatting(ret);

src/env/console.js

@@ -1,15 +1,15 @@
-import format from "../format-console.js";
+import format from "../util/format-console.js";
 
 function printTree (str, parent) {
 	if (str.children?.length > 0) {
-		console["group" + (parent ? "Collapsed" : "")](format(str));
+		console["group" + (parent ? "Collapsed" : "")](...format(str, "css"));
 		for (let child of str.children) {
 			printTree(child, str);
 		}
 		console.groupEnd();
 	}
 	else {
-		console.log(format(str));
+		console.log(...format(str, "css"));
 	}
 }
 

src/env/node.js

@@ -10,7 +10,7 @@ import { AsciiTree } from "oo-ascii-tree";
 import { globSync } from "glob";
 
 // Internal modules
-import format from "../format-console.js";
+import format from "../util/format-console.js";
 import { getType } from "../util.js";
 
 /**
@@ -60,7 +60,7 @@ function getTree (msg, i) {
 
 		let icon = collapsed ? icons.collapsed : icons.expanded;
 		if (highlighted) {
-			icon = `<c green><b>${ collapsed ? icons.collapsedHighlighted : icons.expandedHighlighted }</b></c>`;
+			icon = `<c highlight><b>${ collapsed ? icons.collapsedHighlighted : icons.expandedHighlighted }</b></c>`;
 			msg = `<b>${ msg }</b>`;
 		}
 		msg = icon + " " + msg;

src/render.js

@@ -7,7 +7,7 @@ import TestResult from "./classes/TestResult.js";
 import RefTest from "https://html.htest.dev/src/classes/RefTest.js";
 import { create, output } from "https://html.htest.dev/src/util.js";
 import { formatDuration } from "./util.js";
-import format from "./format-console.js";
+import format from "./util/format-console.js";
 
 export default function render (test) {
 	let root = new Test(test);
@@ -83,7 +83,7 @@ export default function render (test) {
 			}
 			else if (!target.pass) {
 				cell.classList.add("details");
-				cell.onclick = () => console.log(target.details.map(format).join("\n"));
+				cell.onclick = () => console.log(...format(target.details.join("\n")));
 			}
 			tr.dataset.time = formatDuration(target.timeTaken);
 		}