Files
WRNexusJS/packages/ui/test/design-system-catalog.test.ts
T

59 lines
2.5 KiB
TypeScript

import { test, expect } from "bun:test";
import { readFileSync } from "node:fs";
import {
COMPONENT_CONTRACTS,
CATALOG_COMPONENT_CONTRACTS,
CORE_COMPONENT_CONTRACTS,
CORE_DESIGN_SYSTEMS,
compileDesignSystem,
validateDesignSystem,
} from "../../design-system/src/index.ts";
import { renderComponent } from "../../test/src/index.ts";
test("all 104 component contracts have source hooks and preserve the core registry", () => {
expect(Object.keys(COMPONENT_CONTRACTS)).toHaveLength(104);
expect(Object.keys(CORE_COMPONENT_CONTRACTS)).toHaveLength(14);
expect(Object.keys(CATALOG_COMPONENT_CONTRACTS)).toHaveLength(90);
for (const [name, contract] of Object.entries(COMPONENT_CONTRACTS)) {
const source = readFileSync(contract.source, "utf8");
expect(source).toContain(`data-wrn-component="${name}"`);
for (const part of Object.keys(contract.parts))
expect(source).toContain(`data-wrn-part="${part}"`);
}
});
test("all three systems validate and compile recipes for the complete catalog", () => {
for (const system of Object.values(CORE_DESIGN_SYSTEMS)) {
expect(validateDesignSystem(system)).toEqual([]);
expect(Object.keys(system.recipes!)).toHaveLength(104);
for (const mode of ["light", "dark"]) {
const result = compileDesignSystem(system, { mode });
expect(result.recipeCss).not.toContain("undefined");
expect(result.recipeCss).not.toContain("NaN");
for (const [name, recipe] of Object.entries(system.recipes!)) {
if (Object.keys(recipe.base ?? {}).length)
expect(result.recipeCss).toContain(`data-wrn-owner="${name}"`);
}
}
}
});
test("catalog recipes respect provider, native and content ownership", () => {
for (const [name, contract] of Object.entries(CATALOG_COMPONENT_CONTRACTS)) {
for (const [part, descriptor] of Object.entries(contract.parts)) {
if (descriptor.ownership !== "framework" || descriptor.profile === "managed") {
for (const system of Object.values(CORE_DESIGN_SYSTEMS))
expect(system.recipes![name]!.base?.[part]).toBeUndefined();
}
}
}
});
test("all remaining components retain server rendering with additive ownership hooks", async () => {
for (const [name, contract] of Object.entries(CATALOG_COMPONENT_CONTRACTS)) {
const html = await renderComponent(readFileSync(contract.source, "utf8"), {});
expect(html).toContain(`data-wrn-component="${name}"`);
expect(html).not.toContain('data-wrn-owner="undefined"');
}
});