Files
NODEDC_DESIGN_GUIDELINE/scripts/icon-contract.test.mjs
T

31 lines
1.2 KiB
JavaScript

import assert from "node:assert/strict";
import { readFile } from "node:fs/promises";
import test from "node:test";
import { createElement } from "react";
import { renderToStaticMarkup } from "react-dom/server";
import { Icon } from "../packages/ui-react/dist/index.js";
test("only registered playback glyphs are filled", async () => {
const registry = JSON.parse(await readFile(
new URL("../registry/icons.json", import.meta.url),
"utf8",
));
const names = registry.groups.flatMap((group) => group.names);
const filledNames = new Set(registry.filledNames);
assert.deepEqual([...filledNames], ["play", "stop"]);
assert.equal(new Set(names).size, names.length);
for (const name of names) {
const markup = renderToStaticMarkup(createElement(Icon, { name }));
const rootTag = markup.slice(0, markup.indexOf(">") + 1);
if (filledNames.has(name)) {
assert.match(rootTag, /fill="currentColor"/, `${name} must be filled`);
assert.match(rootTag, /stroke-width="0"/, `${name} must not retain an outline`);
} else {
assert.match(rootTag, /fill="none"/, `${name} must remain outline-only`);
assert.doesNotMatch(rootTag, /fill="currentColor"/, `${name} must not be filled`);
}
}
});