@sigil-dev/compiler 0.9.6 → 0.9.7

package/test/ssr-boolean-attrs.test.ts

@@ -0,0 +1,56 @@
+import { describe, expect, test } from "bun:test";
+import { mkdtempSync, writeFileSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { transformSSR } from "./helpers/transform.ts";
+
+// Render through the real SSR output: write the compiled module to disk and
+// import it, so the assertions are on the HTML a browser would receive.
+const dir = mkdtempSync(join(tmpdir(), "sigil-ssr-bool-"));
+let n = 0;
+async function render(src: string, ...args: unknown[]): Promise<string> {
+	const file = join(dir, `m${n++}.js`);
+	writeFileSync(file, transformSSR(src));
+	const mod = await import(file);
+	return String(mod.default(...args));
+}
+
+describe("SSR boolean attributes", () => {
+	const box = `export default (on) => <input type="checkbox" checked={on} />;`;
+
+	test("true renders the bare attribute", async () => {
+		expect(await render(box, true)).toBe(`<input type="checkbox" checked>`);
+	});
+
+	test("false, null and undefined omit it", async () => {
+		// checked="" would mean checked: every box ticked, every option selected
+		for (const v of [false, null, undefined]) {
+			expect(await render(box, v)).toBe(`<input type="checkbox">`);
+		}
+	});
+
+	test("selected, disabled and friends follow the same rule", async () => {
+		const src = `export default (a, b) => <select disabled={a}><option selected={b}>x</option></select>;`;
+		expect(await render(src, false, true)).toBe(
+			`<select><option selected>x</option></select>`,
+		);
+		expect(await render(src, true, false)).toBe(
+			`<select disabled><option>x</option></select>`,
+		);
+	});
+
+	test("a string value is kept, escaped", async () => {
+		expect(
+			await render(`export default (v) => <div hidden={v} />;`, "until-found"),
+		).toBe(`<div hidden="until-found"></div>`);
+		expect(
+			await render(`export default (v) => <div hidden={v} />;`, `"><x`),
+		).toBe(`<div hidden="&quot;&gt;&lt;x"></div>`);
+	});
+
+	test("literal attributes are untouched", async () => {
+		expect(
+			await render(`export default () => <input checked="checked" />;`),
+		).toBe(`<input checked="checked">`);
+	});
+});

package/test/style-object.test.ts

@@ -1,13 +1,13 @@
-import { describe, expect, test } from "bun:test";
-import { transformSSR } from "./helpers/transform.ts";
-
-describe("SSR style objects", () => {
-	test("style={{...}} serializes to CSS string, not [object Object]", () => {
-		const out = transformSSR(
-			`export function Card() { return <div style={{ display: "grid", marginTop: 12 }}>x</div>; }`,
-		);
-		// the __e helper must carry the object branch
-		expect(out).toContain("constructor === Object");
-		expect(out).toContain("UNITLESS");
-	});
-});
+import { describe, expect, test } from "bun:test";
+import { transformSSR } from "./helpers/transform.ts";
+
+describe("SSR style objects", () => {
+	test("style={{...}} serializes to CSS string, not [object Object]", () => {
+		const out = transformSSR(
+			`export function Card() { return <div style={{ display: "grid", marginTop: 12 }}>x</div>; }`,
+		);
+		// the __e helper must carry the object branch
+		expect(out).toContain("constructor === Object");
+		expect(out).toContain("UNITLESS");
+	});
+});