release: WRNexusJS 0.2.27

packages/compiler/test/compiler.test.ts

@@ -3,7 +3,7 @@ import { writeFileSync, mkdirSync } from "node:fs";
 import { tmpdir } from "node:os";
 import { join } from "node:path";
 import { pathToFileURL } from "node:url";
-import { parse } from "../src/index.ts";
+import { generate, parse } from "../src/index.ts";
 import { compileWireFile } from "../src/index.ts";
 
 let seq = 0;
@@ -148,3 +148,67 @@ test("named slots pass through to the component output", () => {
   expect(out).toContain('<slot name="header">');
   expect(out).toContain("<slot></slot>");
 });
+
+test("capitalized self-closing tags compile to component mounts", () => {
+  const source = `
+page ComponentPage {
+  view {
+    <UserCard
+      name="Ajay"
+      role="Admin"
+    />
+  }
+}
+`;
+
+  const output = generate(parse(source));
+
+  expect(output).toContain('data-component="UserCard"');
+
+  expect(output).toContain('name="Ajay"');
+
+  expect(output).toContain('role="Admin"');
+
+  expect(output).not.toContain("<UserCard");
+});
+
+test("capitalized component tags preserve slot children", () => {
+  const source = `
+page SlotPage {
+  view {
+    <Card>
+      <h2>Hello</h2>
+      <p>Component content</p>
+    </Card>
+  }
+}
+`;
+
+  const output = generate(parse(source));
+
+  expect(output).toContain('data-component="Card"');
+
+  expect(output).toContain("<h2>Hello</h2>");
+
+  expect(output).toContain("<p>Component content</p>");
+});
+
+test("component tags work inside reusable components", () => {
+  const source = `
+component ParentCard {
+  props {
+    title = "Hello"
+  }
+
+  view {
+    <ChildCard title="{title}" />
+  }
+}
+`;
+
+  const output = generate(parse(source));
+
+  expect(output).toContain('data-component="ChildCard"');
+
+  expect(output).toContain('title="${__wireAttr(title)}"');
+});