fix layout SSR translations and remediation follow-ups

2026-08-09 18:49:16 +05:30
parent 51286d0fa3
commit 7d87200e31
10 changed files with 160 additions and 89 deletions
@@ -6,7 +6,7 @@
 * the running process while the HMR socket morphs fresh HTML into the browser.
 */

-import { mkdirSync, readFileSync, writeFileSync } from "node:fs";
+import { mkdirSync, readFileSync, rmSync, writeFileSync } from "node:fs";
 import { resolve, dirname, isAbsolute, join } from "node:path";
 import type { Middleware, Mode, SecurityConfig, SeoConfig } from "@wrnexus/core";
 import { buildRouter, type Router } from "@wrnexus/router";
@@ -744,6 +744,7 @@ export async function startServer(opts: ServeOptions): Promise<RunningServer> {
      unsubscribeDevToolbar?.();
      server.stop();
      void pluginRunner.hook("shutdown");
+      rmSync(cacheDir, { recursive: true, force: true, maxRetries: 3, retryDelay: 100 });
    },
  };
 }
@@ -1815,7 +1815,14 @@ export function createHandlers(deps: RuntimeDeps): Handlers {
    if (isMobileRequest) body = revealMobileOnlyHtml(body);

    // i18n: resolve `{t:key}` / `t:attr` markers against the request language.
-    if (deps.i18n) body = translateHtml(body, ctx.t);
+    if (deps.i18n) {
+      body = translateHtml(body, ctx.t);
+      // renderDocument prefers the complete document template when one was
+      // rendered. Keep it in sync with the translated body; otherwise markers
+      // owned by document/page layouts are replaced by the stale pre-translation
+      // template even though page-only responses translate correctly.
+      if (documentTemplate) documentTemplate = body;
+    }

    // Point 3: only ship the JS this page actually uses.
    const scripts = collectScripts(body, deps.clientRuntimes, deps.navigation).map((script) =>
@@ -1,5 +1,5 @@
 import { afterAll, describe, expect, test } from "bun:test";
-import { mkdirSync, mkdtempSync, rmSync, writeFileSync } from "node:fs";
+import { existsSync, mkdirSync, mkdtempSync, rmSync, writeFileSync } from "node:fs";
 import { join } from "node:path";
 import { getAuthzCatalog, hasAuthzCatalog } from "@wrnexus/authz";
 import { startServer } from "../src/index.ts";
@@ -63,9 +63,14 @@ export default defineAuthz({ permissions: { "post:read": { title: "View posts" }
    try {
      expect(hasAuthzCatalog()).toBe(true);
      expect(getAuthzCatalog().permissions.has("post:read")).toBe(true);
+      const cacheDir = join(appDir, "..", `.wrnexus-${process.pid}`);
+      mkdirSync(cacheDir, { recursive: true });
+      writeFileSync(join(cacheDir, "generated.js"), "generated", "utf8");
+      expect(existsSync(cacheDir)).toBe(true);
    } finally {
      server.stop();
    }
+    expect(existsSync(join(appDir, "..", `.wrnexus-${process.pid}`))).toBe(false);
  });

  test("an app with no app/authz declarations boots without throwing", async () => {
@@ -73,3 +73,42 @@ test("translated text is present in the raw server response", async () => {
  const html = await response!.text();
  expect(html).toContain('<span data-t="nav.title">Navigation</span>');
 });
+
+test("translated layout text survives document-template rendering", async () => {
+  const root = mkdtempSync(join(tmpdir(), "wrnexus-layout-ssr-i18n-"));
+  roots.push(root);
+  const app = join(root, "app");
+  mkdirSync(join(app, "pages"), { recursive: true });
+  mkdirSync(join(app, "layouts"), { recursive: true });
+  writeFileSync(join(app, "pages/index.ts"), "export default () => '';\n");
+  writeFileSync(join(app, "layouts/public.wrn"), "layout Public { view { <slot /> } }\n");
+  writeFileSync(
+    join(app, "layouts/document.wrn"),
+    "layout Document { view { <html><head></head><body><slot /></body></html> } }\n",
+  );
+
+  const handlers = createHandlers({
+    mode: "development",
+    hmr: false,
+    router: buildRouter(app),
+    i18n: resolveI18n({ en: { nav: { home: "Home" } } }, { default: "en" }),
+    loadModule: async (file) => {
+      if (basename(file) === "public.wrn") {
+        return { render: () => '<nav><span data-t="nav.home"></span></nav>' };
+      }
+      if (basename(file) === "document.wrn") {
+        return { render: () => "<html><head></head><body><slot /></body></html>" };
+      }
+      return { default: () => "<main>Page</main>", layout: "public" };
+    },
+    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();
+  expect(html).toContain('<span data-t="nav.home">Home</span>');
+  expect(html).not.toContain('<span data-t="nav.home"></span>');
+});
@@ -1671,6 +1671,9 @@ test("carousel autoplay wraps to the first slide", async () => {

 test("input number increments, decrements, applies steps, and respects limits", async () => {
  const source = readFileSync(uiComponentPath("InputNumber"), "utf8");
+  const compiled = compileWireFile(source, uiComponentPath("InputNumber"));
+  expect(compiled).toContain("export const __wrnexusStyles");
+  expect(compiled).toContain(".wire-input-number__control");
  const html = await renderComponent(source, {
    name: "quantity",
    value: 1,