@reckona/mreact-router 0.0.202 → 0.0.204

package/src/build.ts

@@ -16,6 +16,7 @@ import { builtinModules } from "node:module";
 import { availableParallelism } from "node:os";
 import { dirname, join, relative, resolve, sep } from "node:path";
 import { fileURLToPath } from "node:url";
+import type { DehydrateOptions } from "@reckona/mreact-query";
 import {
   collectStaticImportReferences,
   collectTopLevelValueExportNames,
@@ -46,6 +47,7 @@ import {
   buildNavigationRuntimeBundle,
   clientScriptForPath,
   routeIdForPath,
+  routeMarkerParts,
   type BuildClientRouteOutputOptions,
 } from "./navigation-runtime.js";
 import {
@@ -56,6 +58,7 @@ import {
   resolveCompatVendorEntryFiles,
   sourceReferencesCompatVendorSpecifier,
 } from "./module-runner.js";
+import { dehydrateOptionsFromModule } from "./dehydrate-policy.js";
 import { compileRouteMatcherArtifact, scanAppRoutes } from "./routes.js";
 import type { AppRoute, CompiledRouteMatcherArtifact } from "./routes.js";
 import { appFileConventionForRootFilename } from "./file-conventions.js";
@@ -72,6 +75,7 @@ import type { RouteCachePolicy } from "./cache.js";
 import { routeCachePolicyFromSource } from "./cache.js";
 import {
   bundleMiddlewareModuleCode,
+  prerenderVariantMarkerParts,
   renderAppRequest,
   type RenderAppRequestRuntimeOptions,
 } from "./render.js";
@@ -105,6 +109,7 @@ import { collectBuildInferredServerActions } from "./server-action-inference.js"
 import {
   isVisitorDependentResponse,
   PRERENDERED_ROUTE_SCHEMA_VERSION,
+  storedPrerenderedRouteHeaders,
 } from "./prerender-entry.js";
 import { prepareRouteServerActionPlaceholders } from "./actions.js";
 import { viteDefineCacheKey, vitePluginsCacheKey } from "./vite-plugin-cache-key.js";
@@ -246,10 +251,11 @@ export interface BuildAppResult {
 
 interface IncrementalBuildCacheManifest {
   fingerprint: string;
-  version: 1;
+  version: 2;
 }
 
 interface IncrementalBuildServerManifestOutputs {
+  dehydratePolicyModule?: string;
   serverModuleFiles?: Record<string, string>;
   serverModuleRenderFiles?: Record<string, string>;
   serverModuleRequestFiles?: Record<string, string>;
@@ -323,6 +329,7 @@ export interface PackageCloudflarePagesArtifactOptions {
 export interface BuiltServerManifest {
   allowedSourceDirs?: readonly string[];
   assetBaseUrl?: string;
+  dehydratePolicyModule?: string;
   version: 1;
   files: Record<string, string>;
   prerenderedRoutes?: Record<string, BuiltPrerenderedRoute>;
@@ -423,9 +430,11 @@ export interface BuiltServerModuleOutput {
 export interface BuiltPrerenderedRoute {
   headers: Record<string, string>;
   html: string;
+  navigationHtml?: string | undefined;
   /** Identifies entries that satisfy the complete current prerender contract. */
-  schemaVersion?: 2 | undefined;
+  schemaVersion?: 4 | undefined;
   status: number;
+  strictTransportSecurity?: string | undefined;
 }
 
 type StaticParams = Record<string, string | number | boolean | readonly string[]>;
@@ -451,6 +460,13 @@ async function buildAppWithResolvedProject(
   options: BuildAppOptions,
   project: ResolvedAppRouterProject,
 ): Promise<BuildAppResult> {
+  if (
+    (options as BuildAppOptions & { dehydrateOptions?: unknown }).dehydrateOptions !== undefined
+  ) {
+    throw new Error(
+      "buildApp dehydration policies must use dehydratePolicyModule so the same executable policy is available to prerendering and built runtimes.",
+    );
+  }
   const timingSink = options.onBuildPhaseTiming;
   const progressSink = options.onBuildProgress;
   const shouldTrackBuildPhases = timingSink !== undefined || progressSink !== undefined;
@@ -567,6 +583,24 @@ async function buildAppWithResolvedProject(
     });
   }
 
+  const builtDehydratePolicy =
+    project.dehydratePolicyModule === undefined
+      ? undefined
+      : await buildDehydratePolicyModule({
+          define: viteDefine,
+          file: project.dehydratePolicyModule,
+          projectRoot: project.projectRoot,
+          vitePlugins,
+        });
+  const dehydratePolicyArtifact =
+    builtDehydratePolicy === undefined
+      ? undefined
+      : `dehydrate-policy.${hashText(builtDehydratePolicy.code).slice(0, 16)}.mjs`;
+  if (builtDehydratePolicy !== undefined && dehydratePolicyArtifact !== undefined) {
+    await writeFile(join(serverDir, dehydratePolicyArtifact), builtDehydratePolicy.code);
+  }
+  const dehydrateOptions = builtDehydratePolicy?.dehydrateOptions;
+
   const publicAssets =
     shouldTrackBuildPhases === false
       ? await buildPublicAssetManifest(project, clientDir)
@@ -724,6 +758,7 @@ async function buildAppWithResolvedProject(
           assetBaseUrl: project.assetBaseUrl,
           clientRoutes: clientManifestRoutes,
           define: viteDefine,
+          dehydrateOptions,
           project,
           routes,
           serverModules,
@@ -736,6 +771,7 @@ async function buildAppWithResolvedProject(
             assetBaseUrl: project.assetBaseUrl,
             clientRoutes: clientManifestRoutes,
             define: viteDefine,
+            dehydrateOptions,
             project,
             routes,
             serverModules,
@@ -785,6 +821,9 @@ async function buildAppWithResolvedProject(
       relative(project.projectRoot, directory),
     ),
     ...(project.assetBaseUrl === undefined ? {} : { assetBaseUrl: project.assetBaseUrl }),
+    ...(dehydratePolicyArtifact === undefined
+      ? {}
+      : { dehydratePolicyModule: dehydratePolicyArtifact }),
     version: 1,
     routes: serverRoutes,
     routeMatcher: compileRouteMatcherArtifact(serverRoutes),
@@ -898,7 +937,7 @@ async function buildAppWithResolvedProject(
 }
 
 const incrementalBuildCacheFilename = "build-cache.json";
-const incrementalBuildCacheVersion = 1;
+const incrementalBuildCacheVersion = 2;
 
 async function createIncrementalBuildCacheFingerprint(options: {
   buildTargets: readonly AppRouterBuildTarget[];
@@ -944,6 +983,12 @@ async function createIncrementalBuildCacheFingerprint(options: {
     assetBaseUrl: options.project.assetBaseUrl ?? null,
     clientConsolePureFunctions: options.project.clientConsolePureFunctions ?? [],
     clientSourceMaps: options.project.clientSourceMaps,
+    dehydratePolicyModule:
+      options.project.dehydratePolicyModule === undefined
+        ? null
+        : normalizeBuildInputPath(
+            relative(options.project.projectRoot, options.project.dehydratePolicyModule),
+          ),
     define,
     nodeEnv: process.env.NODE_ENV ?? null,
     publicAssetBaseUrl: options.project.publicAssetBaseUrl ?? null,
@@ -1010,6 +1055,9 @@ async function hasRequiredIncrementalBuildOutputs(
   }
 
   for (const file of [
+    ...(serverManifest.dehydratePolicyModule === undefined
+      ? []
+      : [serverManifest.dehydratePolicyModule]),
     ...Object.values(serverManifest.serverModuleFiles ?? {}),
     ...Object.values(serverManifest.serverModuleRenderFiles ?? {}),
     ...Object.values(serverManifest.serverModuleRequestFiles ?? {}),
@@ -1461,7 +1509,7 @@ async function buildRouteUsesRequestInput(options: {
       files: options.files,
       projectRoot: options.projectRoot,
       source: entry.source,
-    })
+    }),
   );
 }
 
@@ -2555,6 +2603,38 @@ function isReservedPublicAssetPath(pathname: string): boolean {
   return pathname === "/_mreact" || pathname.startsWith("/_mreact/");
 }
 
+async function buildDehydratePolicyModule(options: {
+  define?: UserConfig["define"] | undefined;
+  file: string;
+  projectRoot: string;
+  vitePlugins?: readonly PluginOption[] | undefined;
+}): Promise<{ code: string; dehydrateOptions: DehydrateOptions }> {
+  const source = await readFile(options.file, "utf8");
+  const code = await bundleAppRouterSourceModule({
+    code: source,
+    define: options.define,
+    label: `dehydrate-policy:${options.file}`,
+    plugins: [fileImportMetaUrlPlugin()],
+    resolveDir: dirname(options.file),
+    root: options.projectRoot,
+    sourcefile: options.file,
+    vitePlugins: options.vitePlugins,
+  });
+  const policyModule = await importAppRouterSourceModule<unknown>({
+    code,
+    label: `dehydrate-policy-runtime:${options.file}`,
+    sourcefile: options.file,
+  });
+
+  return {
+    code,
+    dehydrateOptions: dehydrateOptionsFromModule(
+      policyModule,
+      `mreactRouter dehydratePolicyModule ${options.file}`,
+    ),
+  };
+}
+
 function isNodeError(error: unknown): error is NodeJS.ErrnoException {
   return error instanceof Error && "code" in error;
 }
@@ -2563,6 +2643,7 @@ async function prerenderStaticRoutes(options: {
   appDir: string;
   assetBaseUrl?: string | undefined;
   clientRoutes: readonly ClientRouteManifestEntry[];
+  dehydrateOptions?: DehydrateOptions | undefined;
   define?: UserConfig["define"] | undefined;
   project: ResolvedAppRouterProject;
   routes: readonly AppRoute[];
@@ -2620,6 +2701,7 @@ async function prerenderStaticRoutes(options: {
       for (const pathname of await prerenderPathsForRoute(route, analysis, options.vitePlugins)) {
         const renderSignals = {
           headerDependent: () => true,
+          strictTransportSecurity: () => undefined as string | undefined,
         };
         const renderOptions = {
           appDir: options.appDir,
@@ -2627,33 +2709,51 @@ async function prerenderStaticRoutes(options: {
           clientScripts,
           clientStyles,
           define: options.define,
+          dehydrateOptions: options.dehydrateOptions,
           importPolicy,
           navigationScripts,
           request: new Request(`http://mreact.local${pathname}`),
+          prerenderVariantCapture: !analysis.clientRoute,
           renderSignals,
           serverModuleCacheVersion,
           serverModules: serverModuleMap,
           vitePlugins: options.vitePlugins,
         } satisfies RenderAppRequestRuntimeOptions;
         const response = await renderAppRequest(renderOptions);
-        const html = await response.text();
+        const renderedHtml = await response.text();
 
         if (renderSignals.headerDependent() || isVisitorDependentResponse(response)) {
           continue;
         }
 
-        const headers: Record<string, string> = {};
+        let html = renderedHtml;
+        let navigationHtml = renderedHtml;
+        if (!analysis.clientRoute) {
+          const capture = prerenderVariantMarkerParts(route.path);
+          const start = renderedHtml.indexOf(capture.prefix);
+          const end = renderedHtml.lastIndexOf(capture.suffix);
+          if (start === -1 || end < start + capture.prefix.length) {
+            throw new Error(`Failed to capture prerender response variants for ${pathname}.`);
+          }
+          const before = renderedHtml.slice(0, start);
+          const content = renderedHtml.slice(start + capture.prefix.length, end);
+          const after = renderedHtml.slice(end + capture.suffix.length);
+          const navigationMarker = routeMarkerParts(route.path);
+          html = `${before}${content}${after}`;
+          navigationHtml = `${before}${navigationMarker.prefix}${content}${navigationMarker.suffix}${after}`;
+        }
 
-        response.headers.forEach((value, key) => {
-          headers[key] = value;
-        });
+        const headers = storedPrerenderedRouteHeaders(response.headers);
+        const strictTransportSecurity = renderSignals.strictTransportSecurity();
         entries.push([
           pathname,
           {
             headers,
             html,
+            navigationHtml,
             schemaVersion: PRERENDERED_ROUTE_SCHEMA_VERSION,
             status: response.status,
+            ...(strictTransportSecurity === undefined ? {} : { strictTransportSecurity }),
           },
         ]);
       }
@@ -3954,6 +4054,7 @@ function cloudflarePageRouteFacadeModuleSource(componentImport: string): string
 const componentSlots = readComponentModuleExport(componentModule, "slots");
 const componentGenerateMetadata = readComponentModuleExport(componentModule, "generateMetadata");
 const componentMetadata = readComponentModuleExport(componentModule, "metadata");
+const componentSecurityHeadersApplied = readComponentModuleExport(componentModule, "__mreactSecurityHeadersApplied");
 
 export function App(props) {
   return renderCloudflareRouteComponent(props);
@@ -3968,6 +4069,7 @@ export const slots = componentSlots === undefined ? undefined : { ...componentSl
 export const generateMetadata =
   typeof componentGenerateMetadata === "function" ? componentGenerateMetadata : undefined;
 export const metadata = componentMetadata;
+export const __mreactSecurityHeadersApplied = componentSecurityHeadersApplied === true;
 
 function renderCloudflareRouteComponent(props) {
   const routeComponent = resolveCloudflareRouteComponent();
@@ -4714,7 +4816,9 @@ ${cloudflareShellRuntimeSource()}`;
 }
 
 function cloudflareShellRuntimeSource(): string {
-  return `async function renderLayoutShells(shells, props, namedSlots) {
+  return `export const __mreactSecurityHeadersApplied = true;
+
+async function renderLayoutShells(shells, props, namedSlots) {
   const slotContext = { consumedSlots: new Set(), namedSlots };
   const rendered = [];
   for (const shell of shells) {
@@ -4793,7 +4897,7 @@ function cloudflareHydrationMarkerParts(props) {
   const escapedRouteId = escapeHtmlAttribute(routeId);
   const propsJson = escapeScriptJson(JSON.stringify({
     params: props.params,
-    request: { url: props.request.url },
+    request: { url: new URL(props.request.url).pathname },
     data: props.data,
   }));
   const clientReferencesJson = route.clientReferenceManifest === undefined || route.clientReferenceManifest.length === 0
@@ -4975,9 +5079,43 @@ function validateOptionalHeadMetadata(value, path) {
         }
       }
     }
+    validateMetaRefreshHeadDescriptor(descriptor, descriptorPath);
   });
 }
 
+function validateMetaRefreshHeadDescriptor(descriptor, path) {
+  if (descriptor.tag !== "meta" || descriptor.attrs === undefined) {
+    return;
+  }
+  const attrs = Object.entries(descriptor.attrs);
+  const hasRefresh = attrs.some(([name, value]) => {
+    const canonicalName = name.toLowerCase();
+    return (canonicalName === "http-equiv" || canonicalName === "httpequiv")
+      && typeof value === "string"
+      && value.toLowerCase() === "refresh";
+  });
+  if (!hasRefresh) {
+    return;
+  }
+  for (const [name, value] of attrs) {
+    if (name.toLowerCase() !== "content" || typeof value !== "string") {
+      continue;
+    }
+    const match = /^[^;]*;\\s*url\\s*=\\s*([\\s\\S]+)$/iu.exec(value);
+    if (match === null || match[1] === undefined) {
+      continue;
+    }
+    let target = match[1].trim();
+    const quote = target[0];
+    if ((quote === String.fromCharCode(34) || quote === "'") && target[target.length - 1] === quote) {
+      target = target.slice(1, -1).trim();
+    }
+    if (isUnsafeUrlValueForName("href", target)) {
+      throw new Error(\`Invalid metadata field \${path}.attrs.\${name}: unsafe refresh URL value.\`);
+    }
+  }
+}
+
 function validateHeadAttribute(name, value, path) {
   if (!isSafeHeadAttributeName(name)) {
     throw new Error(\`Invalid metadata field \${path}: expected safe HTML attribute name.\`);
@@ -5039,7 +5177,7 @@ function isUnsafeUrlValueForName(name, value) {
   }
   const scheme = match[1].toLowerCase();
   if (scheme === "data" && (name === "src" || name === "poster")) {
-    return !/^data:image\\/(?!svg\\+xml(?:[;,]|$))/i.test(canonical);
+    return !/^data:image\\/(?!svg\\+xml\\s*(?:[;,]|$))/i.test(canonical);
   }
   return scheme === "javascript" || scheme === "data" || scheme === "vbscript" || scheme === "livescript" || scheme === "mhtml" || scheme === "file";
 }
@@ -5216,17 +5354,63 @@ function routeSecurityHeaders(security, request) {
   } else {
     headers["referrer-policy"] = validateHeaderValue(security?.referrerPolicy ?? "strict-origin-when-cross-origin");
   }
+  if (security?.permissionsPolicy === null) {
+    delete headers["permissions-policy"];
+  } else {
+    const permissionsPolicy = serializePermissionsPolicy(security?.permissionsPolicy);
+    if (permissionsPolicy === undefined) {
+      delete headers["permissions-policy"];
+    } else {
+      headers["permissions-policy"] = permissionsPolicy;
+    }
+  }
   if (security?.frameOptions === null) {
     delete headers["x-frame-options"];
   } else if (security?.frameOptions !== undefined) {
     headers["x-frame-options"] = validateHeaderValue(security.frameOptions);
   }
   if (request.url.startsWith("https://") && security?.hsts !== undefined && security.hsts !== false && security.hsts !== null) {
-    headers["strict-transport-security"] = \`max-age=\${Math.trunc(security.hsts.maxAge)}\${security.hsts.includeSubDomains === true ? "; includeSubDomains" : ""}\${security.hsts.preload === true ? "; preload" : ""}\`;
+    headers["strict-transport-security"] = serializeHsts(security.hsts);
   }
   return headers;
 }
 
+function serializeHsts(hsts) {
+  if (hsts === false) {
+    throw new TypeError("Invalid security header value for hsts.");
+  }
+  const maxAge = Math.trunc(hsts.maxAge);
+  if (!Number.isFinite(maxAge) || maxAge < 0) {
+    throw new TypeError("Invalid security header value for hsts.maxAge.");
+  }
+  const parts = [\`max-age=\${maxAge}\`];
+  if (hsts.includeSubDomains === true) {
+    parts.push("includeSubDomains");
+  }
+  if (hsts.preload === true) {
+    parts.push("preload");
+  }
+  return parts.join("; ");
+}
+
+function serializePermissionsPolicy(policy) {
+  if (policy === undefined) {
+    return "camera=(), microphone=(), geolocation=()";
+  }
+  const directives = [];
+  for (const [directive, allowlist] of Object.entries(policy)) {
+    if (allowlist === null || allowlist === undefined) {
+      continue;
+    }
+    validateToken(directive, "permissionsPolicy directive");
+    for (const value of allowlist) {
+      validatePermissionAllowlistValue(value);
+    }
+    directives.push(\`\${directive}=(\${allowlist.join(" ")})\`);
+  }
+  return directives.length === 0 ? undefined : directives.join(", ");
+}
+
 function validateHeaderValue(value) {
   for (let index = 0; index < value.length; index += 1) {
     const code = value.charCodeAt(index);
@@ -5237,6 +5421,22 @@ function validateHeaderValue(value) {
   return value;
 }
 
+function validateToken(value, label) {
+  if (!/^[A-Za-z][A-Za-z0-9-]*$/.test(value)) {
+    throw new TypeError(\`Invalid security header value for \${label}: \${JSON.stringify(value)}\`);
+  }
+}
+
+function validatePermissionAllowlistValue(value) {
+  if (value === "self" || value === "*" || /^[A-Za-z][A-Za-z0-9+.-]*:$/.test(value)) {
+    return;
+  }
+  if (/^https:\\/\\/[A-Za-z0-9.-]+(?::[0-9]+)?$/.test(value)) {
+    return;
+  }
+  throw new TypeError(\`Invalid security header value for permissionsPolicy allowlist: \${JSON.stringify(value)}\`);
+}
+
 function mergeRouteMetadata(metadata) {
   if (metadata.length === 0) {
     return undefined;
@@ -6216,6 +6416,10 @@ async function writeClientRouteBundles(options: {
             options.sourceAnalysis.byRouteFile.get(
               relative(options.projectRoot, route.file).split(sep).join("/"),
             )?.streamRoute === true,
+          restoreRequestUrl:
+            options.sourceAnalysis.byRouteFile.get(
+              relative(options.projectRoot, route.file).split(sep).join("/"),
+            )?.usesRequestInput === true,
           cacheDir: options.cacheDir,
           dropConsoleFunctions: options.clientConsolePureFunctions,
           filename: route.file,

package/src/built-runtime.ts

@@ -1,6 +1,8 @@
 import { createHash } from "node:crypto";
 import { mkdir, readFile, rm, writeFile } from "node:fs/promises";
 import { dirname, isAbsolute, join, normalize } from "node:path";
+import { pathToFileURL } from "node:url";
+import type { DehydrateOptions } from "@reckona/mreact-query";
 import type {
   BuiltPrerenderedRoute,
   BuiltServerManifest,
@@ -10,6 +12,7 @@ import { builtClientAssetPaths } from "./built-assets.js";
 import type { BuiltServerModuleArtifactRuntime } from "./built-server-module-artifacts.js";
 import type { ClientRouteManifestEntry } from "./client-route-inference.js";
 import type { AppRouterImportPolicy } from "./import-policy.js";
+import { dehydrateOptionsFromModule } from "./dehydrate-policy.js";
 import { createRouteMatcher, type AppRoute, type RouteMatcher } from "./routes.js";
 
 export interface BuiltRuntime extends BuiltServerModuleArtifactRuntime {
@@ -19,6 +22,7 @@ export interface BuiltRuntime extends BuiltServerModuleArtifactRuntime {
   clientScripts: ReadonlyMap<string, string>;
   clientStylesByFile: ReadonlyMap<string, readonly string[]>;
   clientStyles: ReadonlyMap<string, readonly string[]>;
+  dehydrateOptions?: DehydrateOptions | undefined;
   generatedImportPolicy?: AppRouterImportPolicy | undefined;
   hasMiddleware: boolean;
   navigationScripts: ReadonlyMap<string, string>;
@@ -160,6 +164,13 @@ export async function materializeBuiltRuntime(options: {
     options.importPolicyText,
     options.importPolicyPath,
   );
+  const dehydrateOptions =
+    serverManifest.dehydratePolicyModule === undefined
+      ? undefined
+      : await loadBuiltDehydratePolicy(
+          join(options.outDir, "server", safeManifestFilePath(serverManifest.dehydratePolicyModule)),
+          serverManifest.dehydratePolicyModule,
+        );
 
   return {
     appDir: routesDir,
@@ -171,6 +182,7 @@ export async function materializeBuiltRuntime(options: {
     clientScripts,
     clientStylesByFile,
     clientStyles,
+    ...(dehydrateOptions === undefined ? {} : { dehydrateOptions }),
     ...(generatedImportPolicy === undefined ? {} : { generatedImportPolicy }),
     hasMiddleware,
     navigationScripts,
@@ -198,6 +210,22 @@ export async function materializeBuiltRuntime(options: {
   };
 }
 
+async function loadBuiltDehydratePolicy(
+  policyPath: string,
+  manifestPath: string,
+): Promise<DehydrateOptions> {
+  let policyModule: unknown;
+  try {
+    policyModule = await import(pathToFileURL(policyPath).href);
+  } catch (error) {
+    throw builtArtifactReadError("built app dehydration policy", policyPath, error);
+  }
+  return dehydrateOptionsFromModule(
+    policyModule,
+    `Built dehydration policy ${manifestPath}`,
+  );
+}
+
 export async function readBuiltImportPolicyText(outDir: string): Promise<string | undefined> {
   const policyPath = join(outDir, "server", "import-policy.json");