diff --git a/packages/dev-server/test/component-composition-runtime.test.ts b/packages/dev-server/test/component-composition-runtime.test.ts index 0110800f..7d5b34fc 100644 --- a/packages/dev-server/test/component-composition-runtime.test.ts +++ b/packages/dev-server/test/component-composition-runtime.test.ts @@ -48,6 +48,48 @@ test("a component nested in another component's slot keeps its boundary", async expect(html).not.toContain('data-component="Badge"'); }); +test("a component in an initially hidden client branch is server-prepared for instantiation", async () => { + const root = mkdtempSync(join(tmpdir(), "wrnexus-component-branch-")); + roots.push(root); + const app = join(root, "app"); + mkdirSync(join(app, "pages"), { recursive: true }); + mkdirSync(join(app, "components"), { recursive: true }); + writeFileSync(join(app, "pages/index.ts"), "export default () => '';\n"); + writeFileSync(join(app, "components/Input.wrn"), "component Input { view { } }\n"); + const definition = Buffer.from( + JSON.stringify([{ cond: "open", body: '
' }]), + "utf8", + ).toString("base64"); + + const handlers = createHandlers({ + mode: "development", + hmr: false, + router: buildRouter(app), + loadModule: async (file) => + basename(file) === "Input.wrn" + ? { + render: (props: Record) => + ``, + } + : { + default: () => + ``, + }, + getMiddleware: async () => [], + assets: { serve: async () => null }, + } satisfies RuntimeDeps); + + const response = await handlers.fetch(new Request("https://example.test/"), { + upgrade: () => false, + }); + const html = await response!.text(); + const encoded = /data-wrn-if="([A-Za-z0-9+/=]+)"/.exec(html)?.[1]; + expect(encoded).toBeTruthy(); + const branches = JSON.parse(Buffer.from(encoded!, "base64").toString("utf8")); + expect(branches[0].body).toContain(''); + expect(branches[0].body).not.toContain("data-component="); +}); + test("translated text is present in the raw server response", async () => { const root = mkdtempSync(join(tmpdir(), "wrnexus-ssr-i18n-")); roots.push(root);