@bananacool467/authtics-host 0.2.6 → 0.2.8

package/dist/superBuildOutput.js

@@ -0,0 +1,175 @@
+import fs from "node:fs";
+import path from "node:path";
+const HOSTJS_DIR = ".hostjs";
+function writeJson(filePath, value) {
+    fs.mkdirSync(path.dirname(filePath), { recursive: true });
+    fs.writeFileSync(filePath, `${JSON.stringify(value, null, 2)}\n`, "utf-8");
+}
+function readJson(filePath) {
+    try {
+        return JSON.parse(fs.readFileSync(filePath, "utf-8"));
+    }
+    catch {
+        return {};
+    }
+}
+function toProjectPath(root, filePath) {
+    return path.relative(root, filePath).split(path.sep).join("/");
+}
+function walkFiles(dir) {
+    if (!fs.existsSync(dir) || !fs.statSync(dir).isDirectory())
+        return [];
+    const result = [];
+    for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+        if (entry.name === "node_modules" || entry.name === ".git" || entry.name === ".hostjs")
+            continue;
+        const fullPath = path.join(dir, entry.name);
+        if (entry.isDirectory())
+            result.push(...walkFiles(fullPath));
+        else if (entry.isFile())
+            result.push(fullPath);
+    }
+    return result;
+}
+function routePathFromFile(relativePath) {
+    const withoutExtension = relativePath.replace(/\.(?:tsx?|jsx?|html)$/i, "");
+    if (withoutExtension.toLowerCase() === "index")
+        return "/";
+    return `/${withoutExtension.split(path.sep).join("/")}`;
+}
+function collectRoutes(projectRoot, pagesDir, publicDir) {
+    const routes = [];
+    if (pagesDir) {
+        for (const filePath of walkFiles(pagesDir)) {
+            const relativePath = path.relative(pagesDir, filePath);
+            const normalized = relativePath.split(path.sep).join("/");
+            const lower = normalized.toLowerCase();
+            if (lower === "_template.html" || lower === "_paused.tsx")
+                continue;
+            if (/^api\/.+\.(?:ts|tsx)$/i.test(normalized)) {
+                const pathname = `/${normalized.replace(/\.(?:tsx?)$/i, "")}`;
+                routes.push({ pathname, kind: "api", source: toProjectPath(projectRoot, filePath) });
+                continue;
+            }
+            if (/\.(?:tsx|html)$/i.test(normalized)) {
+                routes.push({
+                    pathname: routePathFromFile(relativePath),
+                    kind: "page",
+                    source: toProjectPath(projectRoot, filePath),
+                });
+            }
+        }
+    }
+    if (publicDir) {
+        for (const filePath of walkFiles(publicDir)) {
+            routes.push({
+                pathname: `/${path.relative(publicDir, filePath).split(path.sep).join("/")}`,
+                kind: "static",
+                source: toProjectPath(projectRoot, filePath),
+            });
+        }
+    }
+    const unique = new Map();
+    for (const route of routes)
+        unique.set(`${route.kind}:${route.pathname}`, route);
+    return [...unique.values()].sort((a, b) => a.pathname.localeCompare(b.pathname) || a.kind.localeCompare(b.kind));
+}
+function typeUnion(values) {
+    const unique = [...new Set(values)].sort();
+    return unique.length ? unique.map((value) => JSON.stringify(value)).join(" | ") : "never";
+}
+function resolveDirectories(root, config, pagesDir, publicDir) {
+    return {
+        pagesDir: config.autoPage === true
+            ? pagesDir ?? path.join(root, config.autoPageDir || "")
+            : undefined,
+        publicDir: config.autoFile === true
+            ? publicDir ?? path.join(root, config.autoFileDir || "")
+            : undefined,
+    };
+}
+function writeRouteManifestAndTypes(root, outputDir, config, pagesDir, publicDir) {
+    const directories = resolveDirectories(root, config, pagesDir, publicDir);
+    const routes = collectRoutes(root, directories.pagesDir, directories.publicDir);
+    writeJson(path.join(outputDir, "server", "routes-manifest.json"), {
+        version: 1,
+        generatedBy: "HostJS",
+        buildStyle: "super",
+        pagesDirectory: directories.pagesDir ? toProjectPath(root, directories.pagesDir) : null,
+        publicDirectory: directories.publicDir ? toProjectPath(root, directories.publicDir) : null,
+        routes,
+    });
+    const pageRoutes = routes.filter((route) => route.kind === "page").map((route) => route.pathname);
+    const apiRoutes = routes.filter((route) => route.kind === "api").map((route) => route.pathname);
+    const staticRoutes = routes.filter((route) => route.kind === "static").map((route) => route.pathname);
+    const routeDeclarations = `// Generated by HostJS buildStyle: "super". Do not edit.
+export type HostJSPageRoute = ${typeUnion(pageRoutes)};
+export type HostJSApiRoute = ${typeUnion(apiRoutes)};
+export type HostJSStaticRoute = ${typeUnion(staticRoutes)};
+`;
+    fs.mkdirSync(path.join(outputDir, "types", "app"), { recursive: true });
+    fs.writeFileSync(path.join(outputDir, "types", "routes.d.ts"), routeDeclarations, "utf-8");
+    fs.writeFileSync(path.join(outputDir, "types", "validator.ts"), `// Generated by HostJS buildStyle: "super". Do not edit.
+import type { HostJSPageRoute, HostJSApiRoute, HostJSStaticRoute } from "./routes.js";
+
+const pageRoutes = ${JSON.stringify([...new Set(pageRoutes)].sort())} as const;
+const apiRoutes = ${JSON.stringify([...new Set(apiRoutes)].sort())} as const;
+const staticRoutes = ${JSON.stringify([...new Set(staticRoutes)].sort())} as const;
+
+export function isHostJSPageRoute(value: string): value is HostJSPageRoute {
+  return (pageRoutes as readonly string[]).includes(value);
+}
+
+export function isHostJSApiRoute(value: string): value is HostJSApiRoute {
+  return (apiRoutes as readonly string[]).includes(value);
+}
+
+export function isHostJSStaticRoute(value: string): value is HostJSStaticRoute {
+  return (staticRoutes as readonly string[]).includes(value);
+}
+`, "utf-8");
+    fs.writeFileSync(path.join(outputDir, "types", "app", "routes.d.ts"), `// Generated by HostJS buildStyle: "super". Do not edit.
+export type { HostJSPageRoute, HostJSApiRoute, HostJSStaticRoute } from "../routes.js";
+`, "utf-8");
+}
+export function refreshSuperRouteManifest(projectRoot, config, pagesDir, publicDir) {
+    const root = path.resolve(projectRoot);
+    const outputDir = path.join(root, HOSTJS_DIR);
+    if (!fs.existsSync(outputDir))
+        return;
+    writeRouteManifestAndTypes(root, outputDir, config, pagesDir, publicDir);
+}
+export function initializeSuperBuildOutput(projectRoot, config, pagesDir, publicDir) {
+    const root = path.resolve(projectRoot);
+    const outputDir = path.join(root, HOSTJS_DIR);
+    const projectPackage = readJson(path.join(root, "package.json"));
+    fs.mkdirSync(outputDir, { recursive: true });
+    writeJson(path.join(outputDir, "package.json"), {
+        schemaVersion: 1,
+        framework: "@bananacool467/authtics-host",
+        frameworkName: "Authtics Host",
+        shortName: "HostJS",
+        buildStyle: "super",
+        project: {
+            name: typeof projectPackage.name === "string" ? projectPackage.name : path.basename(root),
+            version: typeof projectPackage.version === "string" ? projectPackage.version : null,
+        },
+    });
+    writeJson(path.join(outputDir, "diagnostics", "framework.json"), {
+        name: "Authtics Host",
+        shortName: "HostJS",
+        buildStyle: "super",
+        schemaVersion: 1,
+    });
+    writeJson(path.join(outputDir, "diagnostics", "build-diagnostics.json"), {
+        version: 1,
+        diagnostics: [],
+    });
+    writeJson(path.join(outputDir, "server", "middleware-manifest.json"), {
+        version: 1,
+        middleware: [],
+    });
+    writeRouteManifestAndTypes(root, outputDir, config, pagesDir, publicDir);
+    fs.mkdirSync(path.join(outputDir, "trace"), { recursive: true });
+    fs.mkdirSync(path.join(outputDir, "trace-build"), { recursive: true });
+}

package/dist/svg_assets/slope_top_left.d.ts

@@ -0,0 +1 @@
+export default function Slope(): import("react/jsx-runtime").JSX.Element;

package/dist/svg_assets/slope_top_left.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function Slope() {
+    return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", id: "eAC8Baof2Sn1", viewBox: "0 0 300 300", shapeRendering: "geometricPrecision", textRendering: "geometricPrecision", children: _jsx("path", { d: "M38.988202,35.395066v224.168752h226.313907C186.013992,256.687591,95.751962,198.420051,74.383268,65.427243C71.454867,53.642201,60.354042,34.44468,38.988202,35.395066Z", transform: "matrix(1.306635 0 0 1.306641 -48.798185 -42.681458)", fill: "#fff", stroke: "#e6e3e3" }) }));
+}

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@bananacool467/authtics-host",
-  "version": "0.2.6",
+  "version": "0.2.8",
   "description": "Authtics Host, A Next.js-inspired web framework for Node.js and React with TypeScript and JSX support.",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "type": "module",
   "sideEffects": false,
   "bin": {
-    "host": "dist/cli.js"
+    "hostjs": "./bin/hostjs.js"
   },
   "exports": {
     ".": "./dist/index.js"
@@ -17,6 +17,7 @@
     "dev": "tsc --watch",
     "prepublishOnly": "npm run build",
     "test": "npm run build && node dist/index.js",
+    "test:source-maps": "npm run build && node --test tests/source-map-*.test.mjs",
     "playgroundTest": "npm run build && cd playground && node --experimental-strip-types index.ts",
     "playgroundTest2": "npm run build && cd playground2 && node --experimental-strip-types index.ts"
   },
@@ -47,6 +48,7 @@
   "author": "bananacool467",
   "license": "MIT",
   "dependencies": {
+    "@jridgewell/trace-mapping": "^0.3.31",
     "esbuild": "^0.28.2",
     "jiti": "^2.6.1",
     "lucide-react": "^0.577.0",
@@ -58,6 +60,7 @@
     "react-dom": "^19.2.4"
   },
   "devDependencies": {
+    "@bananacool467/ui-tools": "^0.2.2-beta",
     "@babel/core": "^7.29.0",
     "@babel/preset-env": "^7.29.0",
     "@babel/preset-react": "^7.28.5",
@@ -70,5 +73,9 @@
     "@types/react-dom": "^19.2.3",
     "@types/react-syntax-highlighter": "^15.5.13",
     "@types/ws": "^8.18.1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/bananakitssu/authtics-host"
   }
 }

package/scripts/post-merge.sh

@@ -0,0 +1,5 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+npm ci --no-audit --no-fund
+npm run build

package/svg_assets/slope_top_left.tsx

@@ -0,0 +1,19 @@
+export default function Slope() {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+      id="eAC8Baof2Sn1"
+      viewBox="0 0 300 300"
+      shapeRendering="geometricPrecision"
+      textRendering="geometricPrecision"
+    >
+      <path
+        d="M38.988202,35.395066v224.168752h226.313907C186.013992,256.687591,95.751962,198.420051,74.383268,65.427243C71.454867,53.642201,60.354042,34.44468,38.988202,35.395066Z"
+        transform="matrix(1.306635 0 0 1.306641 -48.798185 -42.681458)"
+        fill="#fff"
+        stroke="#e6e3e3"
+      />
+    </svg>
+  );
+}

package/tests/source-map-access.test.mjs

@@ -0,0 +1,167 @@
+import assert from "node:assert/strict";
+import { spawn } from "node:child_process";
+import { once } from "node:events";
+import fs from "node:fs/promises";
+import net from "node:net";
+import path from "node:path";
+import { fileURLToPath, pathToFileURL } from "node:url";
+import test from "node:test";
+
+const projectRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
+const cliPath = path.join(projectRoot, "dist", "cli.js");
+const allowedDat = "source-map-test-dat";
+const sourceMarker = "source-map-source-content-test-marker";
+
+function childHasExited(child) {
+  return child.exitCode !== null || child.signalCode !== null;
+}
+
+async function reservePort() {
+  const server = net.createServer();
+  server.listen(0, "127.0.0.1");
+  await once(server, "listening");
+  const { port } = server.address();
+  await new Promise((resolve, reject) => {
+    server.close((error) => (error ? reject(error) : resolve()));
+  });
+  return port;
+}
+
+async function startFixtureServer(dat) {
+  const fixtureRoot = await fs.mkdtemp(path.join(projectRoot, ".source-map-access-"));
+  const pagesDir = path.join(fixtureRoot, "pages");
+  const port = await reservePort();
+  await fs.mkdir(pagesDir);
+  await fs.writeFile(
+    path.join(fixtureRoot, "authtics_host.config.ts"),
+    `export default {
+  port: ${port},
+  renderType: "csr",
+  devMode: true,
+  autoPage: true,
+  autoPageDir: "pages",
+  autoFile: false,
+  dat: ${dat === undefined ? "undefined" : JSON.stringify(dat)}
+};\n`,
+  );
+  await fs.writeFile(
+    path.join(pagesDir, "index.tsx"),
+    `export default function Page() {
+  return <main>${sourceMarker}</main>;
+}\n`,
+  );
+  const serverEntryPath = path.join(fixtureRoot, "server.mjs");
+  await fs.writeFile(
+    serverEntryPath,
+    `import App from ${JSON.stringify(pathToFileURL(cliPath).href)};\nnew App();\n`,
+  );
+  const child = spawn(process.execPath, [serverEntryPath], {
+    cwd: fixtureRoot,
+    stdio: ["ignore", "pipe", "pipe"],
+  });
+
+  let output = "";
+  child.stdout.setEncoding("utf8").on("data", (chunk) => (output += chunk));
+  child.stderr.setEncoding("utf8").on("data", (chunk) => (output += chunk));
+
+  try {
+    const deadline = Date.now() + 20_000;
+    let lastFailure = "Server did not become ready.";
+    while (Date.now() < deadline) {
+      if (childHasExited(child)) {
+        throw new Error(
+          `Server exited with code ${child.exitCode} and signal ${child.signalCode}.\n${output}`,
+        );
+      }
+
+      try {
+        const response = await fetch(`http://127.0.0.1:${port}/`, {
+          headers: dat === undefined ? {} : { cookie: `dat=${dat}` },
+        });
+        const html = await response.text();
+        if (response.ok) {
+          const scriptUrl = html.match(/<script src="([^"]+\.js)"><\/script>/)?.[1];
+          assert.ok(scriptUrl, `Rendered page did not include its JavaScript bundle.\n${html}`);
+          return {
+            baseUrl: `http://127.0.0.1:${port}`,
+            child,
+            fixtureRoot,
+            mapUrl: `${scriptUrl}.map`,
+          };
+        }
+        lastFailure = `Page returned HTTP ${response.status}:\n${html}`;
+      } catch (error) {
+        lastFailure = error instanceof Error ? error.message : String(error);
+      }
+
+      await new Promise((resolve) => setTimeout(resolve, 100));
+    }
+
+    throw new Error(`${lastFailure}\n${output}`);
+  } catch (error) {
+    child.kill("SIGKILL");
+    await fs.rm(fixtureRoot, { recursive: true, force: true });
+    throw error;
+  }
+}
+
+async function stopFixtureServer(fixture) {
+  if (!childHasExited(fixture.child)) {
+    const exited = once(fixture.child, "exit");
+    fixture.child.kill("SIGTERM");
+    const stopped = await Promise.race([
+      exited.then(() => true),
+      new Promise((resolve) => setTimeout(() => resolve(false), 3_000)),
+    ]);
+    if (!stopped && !childHasExited(fixture.child)) {
+      const forceExit = once(fixture.child, "exit");
+      fixture.child.kill("SIGKILL");
+      await forceExit;
+    }
+  }
+  await fs.rm(fixture.fixtureRoot, { recursive: true, force: true });
+}
+
+async function assertValidSourceMap(response) {
+  assert.equal(response.status, 200);
+  assert.match(response.headers.get("content-type") ?? "", /application\/json/i);
+  const sourceMap = await response.json();
+  assert.equal(sourceMap.version, 3);
+  assert.ok(Array.isArray(sourceMap.sourcesContent));
+  assert.ok(
+    sourceMap.sourcesContent.some((content) => content?.includes(sourceMarker)),
+    "The source map should contain the original page source for this regression test.",
+  );
+}
+
+test("DAT-protected source maps deny missing and incorrect tokens but allow the configured DAT", async () => {
+  const fixture = await startFixtureServer(allowedDat);
+  try {
+    const missingDatResponse = await fetch(`${fixture.baseUrl}${fixture.mapUrl}`);
+    assert.equal(missingDatResponse.status, 404);
+    assert.equal(await missingDatResponse.text(), "");
+
+    const incorrectDatResponse = await fetch(`${fixture.baseUrl}${fixture.mapUrl}`, {
+      headers: { cookie: "dat=wrong-source-map-test-dat" },
+    });
+    assert.equal(incorrectDatResponse.status, 404);
+    assert.equal(await incorrectDatResponse.text(), "");
+
+    const matchingDatResponse = await fetch(`${fixture.baseUrl}${fixture.mapUrl}`, {
+      headers: { cookie: `dat=${allowedDat}` },
+    });
+    await assertValidSourceMap(matchingDatResponse);
+  } finally {
+    await stopFixtureServer(fixture);
+  }
+});
+
+test("unrestricted projects can load valid external source maps without a DAT", async () => {
+  const fixture = await startFixtureServer(undefined);
+  try {
+    const response = await fetch(`${fixture.baseUrl}${fixture.mapUrl}`);
+    await assertValidSourceMap(response);
+  } finally {
+    await stopFixtureServer(fixture);
+  }
+});

package/tests/source-map-location.test.mjs

@@ -0,0 +1,237 @@
+import assert from "node:assert/strict";
+import { spawn } from "node:child_process";
+import { once } from "node:events";
+import fs from "node:fs/promises";
+import net from "node:net";
+import path from "node:path";
+import { fileURLToPath, pathToFileURL } from "node:url";
+import test from "node:test";
+import { mapGeneratedLocation } from "../dist/devPanel.js";
+
+const projectRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
+const cliPath = path.join(projectRoot, "dist", "cli.js");
+const errorMarker = "cached-tsx-source-map-error";
+const pageSource = `export default function Page() {
+  return (
+    <main>
+      {(() => {
+        throw new Error("${errorMarker}");
+      })()}
+    </main>
+  );
+}
+`;
+
+function childHasExited(child) {
+  return child.exitCode !== null || child.signalCode !== null;
+}
+
+async function reservePort() {
+  const server = net.createServer();
+  server.listen(0, "127.0.0.1");
+  await once(server, "listening");
+  const { port } = server.address();
+  await new Promise((resolve, reject) => {
+    server.close((error) => (error ? reject(error) : resolve()));
+  });
+  return port;
+}
+
+async function createFixture(buildStyle) {
+  const fixtureRoot = await fs.mkdtemp(path.join(projectRoot, ".source-map-location-"));
+  const pagesDir = path.join(fixtureRoot, "pages");
+  const port = await reservePort();
+  await fs.mkdir(pagesDir);
+  await fs.writeFile(path.join(pagesDir, "index.tsx"), pageSource);
+  await fs.writeFile(
+    path.join(fixtureRoot, "authtics_host.config.ts"),
+    `export default {
+  port: ${port},
+  renderType: "csr",
+  devMode: true,
+  autoPage: true,
+  autoPageDir: "pages",
+  autoFile: false,
+  buildStyle: ${JSON.stringify(buildStyle)}
+};\n`,
+  );
+  const serverEntryPath = path.join(fixtureRoot, "server.mjs");
+  await fs.writeFile(
+    serverEntryPath,
+    `import App from ${JSON.stringify(pathToFileURL(cliPath).href)};\nnew App();\n`,
+  );
+
+  return { fixtureRoot, port, serverEntryPath };
+}
+
+async function startFixtureServer(fixture) {
+  const child = spawn(process.execPath, [fixture.serverEntryPath], {
+    cwd: fixture.fixtureRoot,
+    stdio: ["ignore", "pipe", "pipe"],
+  });
+  let output = "";
+  child.stdout.setEncoding("utf8").on("data", (chunk) => (output += chunk));
+  child.stderr.setEncoding("utf8").on("data", (chunk) => (output += chunk));
+
+  try {
+    const baseUrl = `http://127.0.0.1:${fixture.port}`;
+    const deadline = Date.now() + 20_000;
+    let lastFailure = "Server did not become ready.";
+    while (Date.now() < deadline) {
+      if (childHasExited(child)) {
+        throw new Error(
+          `Server exited with code ${child.exitCode} and signal ${child.signalCode}.\n${output}`,
+        );
+      }
+
+      try {
+        const response = await fetch(`${baseUrl}/`);
+        const html = await response.text();
+        if (response.ok) {
+          const scriptUrl = html.match(/<script src="([^"]+\.js)"><\/script>/)?.[1];
+          assert.ok(scriptUrl, `Rendered page did not include its JavaScript bundle.\n${html}`);
+          return { child, baseUrl, scriptUrl, output };
+        }
+        lastFailure = `Page returned HTTP ${response.status}:\n${html}`;
+      } catch (error) {
+        lastFailure = error instanceof Error ? error.message : String(error);
+      }
+
+      await new Promise((resolve) => setTimeout(resolve, 100));
+    }
+
+    throw new Error(`${lastFailure}\n${output}`);
+  } catch (error) {
+    await stopFixtureServer({ child });
+    throw error;
+  }
+}
+
+async function stopFixtureServer(server) {
+  if (!childHasExited(server.child)) {
+    const exited = once(server.child, "exit");
+    server.child.kill("SIGTERM");
+    const stopped = await Promise.race([
+      exited.then(() => true),
+      new Promise((resolve) => setTimeout(() => resolve(false), 3_000)),
+    ]);
+    if (!stopped && !childHasExited(server.child)) {
+      const forceExit = once(server.child, "exit");
+      server.child.kill("SIGKILL");
+      await forceExit;
+    }
+  }
+}
+
+async function findClientMapPath(fixtureRoot, buildStyle) {
+  const cacheRoot = buildStyle === "default"
+    ? path.join(fixtureRoot, ".authtics_host", "cache")
+    : path.join(fixtureRoot, ".hostjs", "cache", "bundler", "client-production");
+  const mapFiles = [];
+  async function visit(directory) {
+    for (const entry of await fs.readdir(directory, { withFileTypes: true })) {
+      const entryPath = path.join(directory, entry.name);
+      if (entry.isDirectory()) await visit(entryPath);
+      else if (entry.name.endsWith(".js.map")) mapFiles.push(entryPath);
+    }
+  }
+  await visit(cacheRoot);
+  assert.equal(mapFiles.length, 1, "Expected one cached client source map.");
+  return mapFiles[0];
+}
+
+async function verifyBrowserErrorMapping(server, expectedSourceLine = 5) {
+  const scriptResponse = await fetch(new URL(server.scriptUrl, server.baseUrl));
+  assert.equal(scriptResponse.status, 200);
+  const generatedCode = await scriptResponse.text();
+
+  assert.match(
+    generatedCode,
+    /\/\/[#@]\s*sourceMappingURL=(?!data:)[^\s]+/,
+    "The generated JavaScript should reference an external source map.",
+  );
+  assert.doesNotMatch(
+    generatedCode,
+    /sourceMappingURL=data:|data:application\/json[^,\s]*;base64,/i,
+    "The generated JavaScript must not embed its source map as base64.",
+  );
+
+  const markerIndex = generatedCode.indexOf(errorMarker);
+  assert.notEqual(markerIndex, -1, "The browser bundle should contain the deliberate error.");
+  const generatedThrowIndex = generatedCode.lastIndexOf("throw", markerIndex);
+  assert.notEqual(generatedThrowIndex, -1, "Could not locate the generated throw statement.");
+  const prefix = generatedCode.slice(0, generatedThrowIndex);
+  const generatedLine = prefix.split("\n").length;
+  const generatedColumn = generatedThrowIndex - prefix.lastIndexOf("\n");
+
+  const mappedLocation = await mapGeneratedLocation({
+    file: scriptResponse.url,
+    line: generatedLine,
+    column: generatedColumn,
+    mapped: false,
+  });
+
+  assert.equal(mappedLocation.mapped, true, "The DevPanel should map the browser error.");
+  assert.match(mappedLocation.file, /pages\/index\.tsx$/);
+  assert.equal(mappedLocation.line, expectedSourceLine);
+  assert.equal(mappedLocation.column, 9);
+  assert.match(mappedLocation.sourceText, /throw new Error\("cached-tsx-source-map-error"\)/);
+}
+
+for (const buildStyle of ["default", "super"]) {
+  test(`${buildStyle} build maps browser errors after a fresh build and a disk-cache hit`, async () => {
+    const fixture = await createFixture(buildStyle);
+    let server;
+    try {
+      server = await startFixtureServer(fixture);
+      await verifyBrowserErrorMapping(server);
+      const mapPath = await findClientMapPath(fixture.fixtureRoot, buildStyle);
+      const initialMapMtime = (await fs.stat(mapPath, { bigint: true })).mtimeNs;
+
+      // A new process has no in-memory asset routes; it must reuse the cached
+      // bundle and restore its map from disk without rebuilding either file.
+      await stopFixtureServer(server);
+      server = await startFixtureServer(fixture);
+      await verifyBrowserErrorMapping(server);
+      assert.equal(
+        (await fs.stat(mapPath, { bigint: true })).mtimeNs,
+        initialMapMtime,
+        "The cache-hit request should reuse the existing source map.",
+      );
+
+      // A missing sidecar must invalidate the otherwise-valid JavaScript
+      // cache and produce a matching map before the asset is served.
+      await stopFixtureServer(server);
+      await fs.unlink(mapPath);
+      server = await startFixtureServer(fixture);
+      await verifyBrowserErrorMapping(server);
+      const restoredMapMtime = (await fs.stat(mapPath, { bigint: true })).mtimeNs;
+      assert.notEqual(
+        restoredMapMtime,
+        initialMapMtime,
+        "A missing cached map should be rebuilt rather than silently reused.",
+      );
+
+      // Changing the TSX source must rebuild the bundle and map together so a
+      // valid JavaScript URL cannot keep pointing at an outdated map.
+      await stopFixtureServer(server);
+      const sourcePath = path.join(fixture.fixtureRoot, "pages", "index.tsx");
+      await fs.writeFile(
+        sourcePath,
+        pageSource.replace("        throw new Error", "        // Shift the mapped error down one line.\n        throw new Error"),
+      );
+      const future = new Date(Date.now() + 2_000);
+      await fs.utimes(sourcePath, future, future);
+      server = await startFixtureServer(fixture);
+      await verifyBrowserErrorMapping(server, 6);
+      assert.notEqual(
+        (await fs.stat(mapPath, { bigint: true })).mtimeNs,
+        restoredMapMtime,
+        "A changed TSX source should replace its cached source map.",
+      );
+    } finally {
+      if (server) await stopFixtureServer(server);
+      await fs.rm(fixture.fixtureRoot, { recursive: true, force: true });
+    }
+  });
+}