72 lines
2.5 KiB
TypeScript
72 lines
2.5 KiB
TypeScript
import { expect, test } from "bun:test";
|
|
import { mkdir, mkdtemp, rm, writeFile } from "node:fs/promises";
|
|
import { join } from "node:path";
|
|
import { tmpdir } from "node:os";
|
|
import { compileStcssModule } from "../views/css/modules.ts";
|
|
import { createViews } from "../views/api.ts";
|
|
|
|
test("STCSS modules scope classes and inline relative imports", async () => {
|
|
const root = await mkdtemp(join(tmpdir(), "muddle-stcss-module-"));
|
|
try {
|
|
const imported = join(root, "tokens.stcss");
|
|
await writeFile(imported, ".token { color: red; }");
|
|
const result = await compileStcssModule(
|
|
'@import "./tokens.stcss"; .card { color: blue; }',
|
|
{ filename: join(root, "card.module.stcss"), root },
|
|
);
|
|
expect(result.classes.card).toBeDefined();
|
|
expect(result.classes.token).toBeDefined();
|
|
expect(result.css).toContain(`.${result.classes.card}`);
|
|
expect(result.css).toContain(`.${result.classes.token}`);
|
|
expect(result.css).not.toContain(".card {");
|
|
} finally {
|
|
await rm(root, { recursive: true, force: true });
|
|
}
|
|
});
|
|
|
|
test("a component automatically receives its adjacent STCSS module", async () => {
|
|
const root = await mkdtemp(join(tmpdir(), "muddle-component-module-"));
|
|
try {
|
|
const components = join(root, "components");
|
|
await mkdir(components);
|
|
await writeFile(join(components, "badge.spug"), "span.badge badge");
|
|
await writeFile(
|
|
join(components, "badge.module.stcss"),
|
|
".badge { color: rebeccapurple; }",
|
|
);
|
|
await writeFile(join(root, "index.spug"), "component badge");
|
|
const html = await createViews({
|
|
root,
|
|
viewsDir: root,
|
|
componentsDir: components,
|
|
}).render("index.spug", {});
|
|
expect(html).toContain("<style>");
|
|
expect(html).toMatch(/class="m[^"]+"/);
|
|
} finally {
|
|
await rm(root, { recursive: true, force: true });
|
|
}
|
|
});
|
|
|
|
test("components resolve an installed package and its component entry", async () => {
|
|
const root = await mkdtemp(join(tmpdir(), "muddle-package-component-"));
|
|
try {
|
|
const packageRoot = join(root, "node_modules", "@muddle", "badge");
|
|
await mkdir(packageRoot, { recursive: true });
|
|
await writeFile(
|
|
join(packageRoot, "package.json"),
|
|
'{"name":"@muddle/badge"}',
|
|
);
|
|
await writeFile(
|
|
join(packageRoot, "component.spug"),
|
|
"strong.badge package badge",
|
|
);
|
|
await writeFile(join(root, "index.spug"), "component @muddle/badge");
|
|
const html = await createViews({ root, viewsDir: root }).render(
|
|
"index.spug",
|
|
{},
|
|
);
|
|
expect(html).toContain("package badge");
|
|
} finally {
|
|
await rm(root, { recursive: true, force: true });
|
|
}
|
|
});
|