@reckona/mreact-router 0.0.138 → 0.0.139

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reckona/mreact-router",
-  "version": "0.0.138",
+  "version": "0.0.139",
   "description": "File-system app router, SSR, actions, and deployment adapters for mreact.",
   "keywords": [
     "jsx",
@@ -105,20 +105,20 @@
   },
   "dependencies": {
     "typescript": "^6.0.3",
-    "@reckona/mreact": "0.0.138",
-    "@reckona/mreact-compat": "0.0.138",
-    "@reckona/mreact-compiler": "0.0.138",
-    "@reckona/mreact-devtools": "0.0.138",
-    "@reckona/mreact-reactive-core": "0.0.138",
-    "@reckona/mreact-query": "0.0.138",
-    "@reckona/mreact-server": "0.0.138",
-    "@reckona/mreact-reactive-dom": "0.0.138",
-    "@reckona/mreact-shared": "0.0.138"
+    "@reckona/mreact": "0.0.139",
+    "@reckona/mreact-compiler": "0.0.139",
+    "@reckona/mreact-query": "0.0.139",
+    "@reckona/mreact-devtools": "0.0.139",
+    "@reckona/mreact-reactive-dom": "0.0.139",
+    "@reckona/mreact-reactive-core": "0.0.139",
+    "@reckona/mreact-compat": "0.0.139",
+    "@reckona/mreact-server": "0.0.139",
+    "@reckona/mreact-shared": "0.0.139"
   },
   "peerDependencies": {
     "vite": ">=8 <9"
   },
   "optionalDependencies": {
-    "@reckona/mreact-router-native": "0.0.138"
+    "@reckona/mreact-router-native": "0.0.139"
   }
 }

package/src/actions.ts

@@ -64,6 +64,7 @@ const actionTokenSecret = process.env.MREACT_SERVER_ACTION_SECRET ?? defaultActi
 const DEFAULT_REPLAY_TTL_MS = 10 * 60 * 1000;
 const DEFAULT_REPLAY_MAX_ENTRIES = 50_000;
 const DEFAULT_ACTION_BODY_MAX_BYTES = 10 * 1024 * 1024;
+const DEFAULT_ACTION_FORM_MAX_FIELDS = 1_000;
 let warnedUnrestrictedServerActions = false;
 
 export interface ServerActionContext {
@@ -103,19 +104,20 @@ class BoundedReplayStore {
 
   add(value: string): void {
     const now = Date.now();
-    // Cheap opportunistic sweep: drop the oldest expired entries first,
-    // then enforce the hard cap with FIFO eviction.
     if (this.entries.size >= this.maxEntries) {
-      for (const [key, expiresAt] of this.entries) {
+      const oldest = this.entries.entries().next().value;
+      if (oldest !== undefined) {
+        const [key, expiresAt] = oldest;
+        this.entries.delete(key);
         if (expiresAt < now) {
-          this.entries.delete(key);
+          while (this.entries.size >= this.maxEntries) {
+            const nextOldest = this.entries.entries().next().value;
+            if (nextOldest === undefined || nextOldest[1] >= now) {
+              break;
+            }
+            this.entries.delete(nextOldest[0]);
+          }
         }
-        if (this.entries.size < this.maxEntries) break;
-      }
-      while (this.entries.size >= this.maxEntries) {
-        const oldest = this.entries.keys().next().value;
-        if (oldest === undefined) break;
-        this.entries.delete(oldest);
       }
     }
     this.entries.set(value, now + this.ttlMs);
@@ -147,6 +149,7 @@ export interface AppRouterServerActionOptions {
   allowedActions?: readonly AppRouterAllowedServerAction[] | undefined;
   authorize?: ServerActionHandlerOptions["authorize"] | undefined;
   maxBodyBytes?: number | undefined;
+  maxFormFields?: number | undefined;
   replayStore?: ServerActionReplayStore | undefined;
 }
 
@@ -370,6 +373,15 @@ async function dispatchServerActionRequestWithoutCacheContext(options: {
   }
 
   const formData = await options.request.formData();
+  const fieldCountResponse = validateServerActionFormFieldCount(
+    formData,
+    options.serverActions?.maxFormFields ?? DEFAULT_ACTION_FORM_MAX_FIELDS,
+  );
+
+  if (fieldCountResponse !== undefined) {
+    return fieldCountResponse;
+  }
+
   const csrfResponse = validateFormCsrf(options.request, formData);
 
   if (csrfResponse !== undefined) {
@@ -515,6 +527,28 @@ function validateServerActionBodySize(
   return undefined;
 }
 
+function validateServerActionFormFieldCount(
+  formData: FormData,
+  maxFormFields: number,
+): Response | undefined {
+  if (!Number.isFinite(maxFormFields) || maxFormFields < 0) {
+    return undefined;
+  }
+
+  let count = 0;
+  for (const _ of formData.keys()) {
+    count += 1;
+    if (count > maxFormFields) {
+      return jsonResponse({
+        ok: false,
+        error: "Server action form field count is too large.",
+      }, 413);
+    }
+  }
+
+  return undefined;
+}
+
 function redirectToFormReferer(request: Request): Response {
   return new Response(null, {
     status: 303,

package/src/adapters/static.ts

@@ -1,5 +1,5 @@
 import { cp, mkdir, readFile, rm, writeFile } from "node:fs/promises";
-import { dirname, join } from "node:path";
+import { dirname, join, resolve, sep } from "node:path";
 import type { BuiltPrerenderedRoute, BuiltServerManifest } from "../build.js";
 
 export interface StaticExportOptions {
@@ -79,14 +79,21 @@ async function writePrerenderedRoute(
     throw new Error(`Cannot export route ${route} with status ${entry.status}.`);
   }
 
-  const file = join(exportDir, routeToHtmlFile(route));
+  const file = routeToHtmlFile(exportDir, route);
   await mkdir(dirname(file), { recursive: true });
   await writeFile(file, entry.html);
 }
 
-function routeToHtmlFile(route: string): string {
+function routeToHtmlFile(exportDir: string, route: string): string {
   const pathname = route.split("?")[0] ?? "/";
   const normalized = pathname.startsWith("/") ? pathname.slice(1) : pathname;
+  const relativeFile = normalized === "" ? "index.html" : join(normalized, "index.html");
+  const root = resolve(exportDir);
+  const file = resolve(root, relativeFile);
 
-  return normalized === "" ? "index.html" : join(normalized, "index.html");
+  if (file !== root && !file.startsWith(`${root}${sep}`)) {
+    throw new Error(`unsafe static export route: ${route}`);
+  }
+
+  return file;
 }

package/src/build.ts

@@ -1387,6 +1387,7 @@ async function collectBuildServerActionManifest(options: {
       .filter((route) => route.kind === "page")
       .map((route) => relative(options.projectRoot, route.file).split(sep).join("/")),
   );
+  const inferredRouteReferences: Array<{ code: string; file: string }> = [];
 
   for (const [file, code] of Object.entries(options.files)) {
     if (!isAppRelativeFile(file, relativeRoutesDir) || !isSourceModuleFile(file)) {
@@ -1402,29 +1403,39 @@ async function collectBuildServerActionManifest(options: {
     }
 
     if (routeSourceFiles.has(file)) {
-      const inference = await collectBuildInferredServerActionReferences({
+      inferredRouteReferences.push({ code, file });
+    }
+  }
+
+  const inferredRouteResults = await mapWithBuildConcurrency(
+    inferredRouteReferences,
+    async ({ code, file }) => ({
+      file,
+      inference: await collectBuildInferredServerActionReferences({
         file,
         files: options.files,
         relativeRoutesDir,
         source: code,
-      });
+      }),
+    }),
+  );
 
-      for (const diagnostic of inference.diagnostics) {
-        console.warn(formatServerActionInferenceDiagnostic(diagnostic));
-      }
+  for (const { file, inference } of inferredRouteResults) {
+    for (const diagnostic of inference.diagnostics) {
+      console.warn(formatServerActionInferenceDiagnostic(diagnostic));
+    }
 
-      routeReferences.set(file, inference.references);
+    routeReferences.set(file, inference.references);
 
-      for (const reference of inference.references) {
-        const key = `${reference.moduleId}#${reference.exportName}`;
+    for (const reference of inference.references) {
+      const key = `${reference.moduleId}#${reference.exportName}`;
 
-        if (!entries.has(key)) {
-          entries.set(key, {
-            exportName: reference.exportName,
-            inferred: reference.inferred,
-            moduleId: reference.moduleId,
-          });
-        }
+      if (!entries.has(key)) {
+        entries.set(key, {
+          exportName: reference.exportName,
+          inferred: reference.inferred,
+          moduleId: reference.moduleId,
+        });
       }
     }
   }
@@ -4383,8 +4394,8 @@ function cloudflareWorkspaceRuntimePlugin(): RouterCompatPlugin {
         { filter: /^native-escape$/, namespace: "mreact-cloudflare-native-escape" },
         () => ({
           contents: `function escapeHtml(value) {
-  return String(value ?? "").replace(/[&<>"']/g, (char) =>
-    char === "&" ? "&amp;" : char === "<" ? "&lt;" : char === ">" ? "&gt;" : char === '"' ? "&quot;" : "&#39;"
+  return String(value ?? "").replace(/[&<>"]/g, (char) =>
+    char === "&" ? "&amp;" : char === "<" ? "&lt;" : char === ">" ? "&gt;" : "&quot;"
   );
 }
 export function escapeHtmlBatch(values) {

package/src/cache.ts

@@ -233,8 +233,13 @@ export function cachedRouteResponse(options: {
   cache?: AppRouterCache | undefined;
   key: string;
   now?: number;
+  request?: Request | undefined;
 }): Promise<Response | undefined> {
   return Promise.resolve().then(async () => {
+    if (requestCarriesCredentials(options.request)) {
+      return undefined;
+    }
+
     const cache = options.cache ?? cacheState.memoryCache;
 
     await consumeInvalidations(cache);
@@ -262,6 +267,7 @@ export async function cacheRouteResponse(options: {
   now?: number;
   path: string;
   policy: RouteCachePolicy | undefined;
+  request?: Request | undefined;
   response: Response;
 }): Promise<Response> {
   if (options.policy === undefined) {
@@ -276,6 +282,24 @@ export async function cacheRouteResponse(options: {
   const body = await options.response.text();
   const cacheControl = options.policy.cacheControl;
   const status = options.response.status;
+  const contentType = options.response.headers.get("content-type") ?? "text/html; charset=utf-8";
+
+  if (
+    requestCarriesCredentials(options.request) ||
+    options.response.headers.has("set-cookie")
+  ) {
+    const headers = new Headers(options.response.headers);
+    headers.set("cache-control", "private, no-store");
+    if (!headers.has("content-type")) {
+      headers.set("content-type", contentType);
+    }
+
+    return new Response(body, {
+      headers,
+      status,
+    });
+  }
+
   await (options.cache ?? cacheState.memoryCache).set(options.key, {
     body,
     cacheControl,
@@ -287,13 +311,21 @@ export async function cacheRouteResponse(options: {
   return new Response(body, {
     headers: {
       "cache-control": cacheControl,
-      "content-type": options.response.headers.get("content-type") ?? "text/html; charset=utf-8",
+      "content-type": contentType,
       "x-mreact-cache": "MISS",
     },
     status,
   });
 }
 
+function requestCarriesCredentials(request: Request | undefined): boolean {
+  if (request === undefined) {
+    return false;
+  }
+
+  return request.headers.has("authorization") || request.headers.has("cookie");
+}
+
 export function revalidatePath(path: string): void {
   const normalizedPath = normalizeRevalidationPath(path);
   const activeContext = activeRouteCacheContext();

package/src/client.ts

@@ -2240,6 +2240,7 @@ export async function buildClientRouteEntrySource(
   },
   fetchRevalidationInstalled: false,
   installed: false,
+  prefetchedUrls: new Set(),
   prefetchedScripts: new Set(),
   reloadNextNavigationFetch: false,
   routePrefetchManifest: undefined,
@@ -2593,6 +2594,12 @@ export async function __mreactPrefetch(url) {
     return false;
   }
 
+  if (__mreactNavigationState.prefetchedUrls.has(href)) {
+    return true;
+  }
+
+  __mreactNavigationState.prefetchedUrls.add(href);
+
   const script = __mreactRouteScriptForNavigationUrl(href);
 
   if (script === undefined) {
@@ -2690,6 +2697,10 @@ export async function __mreactNavigate(url, options = {}) {
 
   try {
     const cachedHtml = __mreactCachedNavigationHtml(href);
+    const script = __mreactRouteScriptForNavigationUrl(href);
+    if (script !== undefined) {
+      void __mreactPrefetchRouteScript(script);
+    }
     const html = cachedHtml ?? await __mreactFetchNavigationHtml(href);
 
     if (typeof html !== "string") {
@@ -2842,12 +2853,14 @@ export function __mreactInvalidateNavigationCache(path) {
   for (const href of Array.from(__mreactNavigationState.cache.keys())) {
     if (__mreactNormalizeNavigationPath(href) === normalizedPath) {
       __mreactNavigationState.cache.delete(href);
+      __mreactNavigationState.prefetchedUrls.delete(href);
     }
   }
 }
 
 function __mreactInvalidateAllNavigationCache() {
   __mreactNavigationState.cache.clear();
+  __mreactNavigationState.prefetchedUrls.clear();
 }
 
 function __mreactFetchNavigationHtml(href) {
@@ -2903,11 +2916,19 @@ function __mreactNormalizeNavigationPath(path) {
 }
 
 export function __mreactRestoreHistoryState(state) {
-  if (state === null || state === undefined || state.__mreact !== true || typeof state.html !== "string") {
+  if (state === null || state === undefined || state.__mreact !== true) {
     return false;
   }
 
-  const applied = __mreactApplyNavigationHtml(state.html, state.url);
+  const html = typeof state.html === "string"
+    ? state.html
+    : typeof state.url === "string" ? __mreactNavigationState.cache.get(state.url) : undefined;
+
+  if (typeof html !== "string") {
+    return false;
+  }
+
+  const applied = __mreactApplyNavigationHtml(html, state.url);
 
   if (!applied) {
     return false;
@@ -3120,15 +3141,14 @@ function __mreactSyncRouteDataScripts(root, currentRouteId, nextRouteId) {
     return;
   }
 
-  for (const element of Array.from(document.querySelectorAll(__mreactRouteDataScriptSelector()))) {
-    if (managedIds.has(element.id)) {
-      element.remove();
-    }
-  }
+  for (const id of managedIds) {
+    document.getElementById(id)?.remove();
+    const next = typeof root.getElementById === "function"
+      ? root.getElementById(id)
+      : root.querySelector(\`#\${id}\`);
 
-  for (const element of Array.from(root.querySelectorAll(__mreactRouteDataScriptSelector()))) {
-    if (managedIds.has(element.id)) {
-      document.body.appendChild(element);
+    if (next !== null && next !== undefined) {
+      document.body.appendChild(next);
     }
   }
 }
@@ -3155,13 +3175,29 @@ function __mreactRouteDataScriptSelector() {
 function __mreactCurrentHistoryState(url) {
   return {
     __mreact: true,
-    html: document.body.innerHTML,
+    html: __mreactCurrentDocumentRouteHtml(),
     scrollX: Number(globalThis.scrollX ?? 0),
     scrollY: Number(globalThis.scrollY ?? 0),
     url,
   };
 }
 
+function __mreactCurrentDocumentRouteHtml() {
+  if (typeof document === "undefined") {
+    return undefined;
+  }
+
+  const marker = document.querySelector("[" + __mreactRouteMarkerAttribute + "]");
+  if (marker === null) {
+    return undefined;
+  }
+
+  const routeDataScripts = Array.from(document.querySelectorAll(__mreactRouteDataScriptSelector()))
+    .map((script) => script.outerHTML)
+    .join("");
+  return marker.outerHTML + routeDataScripts;
+}
+
 function __mreactPushHistoryState(url) {
   if (typeof history === "undefined" || url === undefined) {
     return;
@@ -4245,7 +4281,8 @@ export function cell(initial) {
       buildApi.onLoad({ filter: /^devtools$/, namespace: "mreact-devtools-stub" }, () => ({
         contents: `export function emitReactiveDevtoolsEvent() {}
 export function hasReactiveDevtoolsEmitter() { return false; }
-export function currentDevtoolsEmitter() { return undefined; }`,
+export function currentDevtoolsEmitter() { return undefined; }
+export function currentReactiveDevtools() { return undefined; }`,
         loader: "ts",
       }));
       buildApi.onLoad({ filter: /\.(?:mreact\.)?[cm]?[jt]sx$/ }, async (args) => {

package/src/dev-server.ts

@@ -28,6 +28,7 @@ export interface StartDevServerOptions extends AppRouterProjectOptions {
   logger?: AppRouterLogger | undefined;
   routeCache?: AppRouterCache | undefined;
   serverActions?: AppRouterServerActionOptions | undefined;
+  verboseErrors?: boolean | undefined;
   viteConfig?: UserConfig | undefined;
   onUpgrade?: HttpUpgradeHandler | undefined;
 }
@@ -87,7 +88,7 @@ export async function startDevServer(
     }
 
     if (vite === undefined) {
-      sendDevServerError(outgoing, new Error("Vite dev server is not initialized."));
+      sendDevServerError(outgoing, new Error("Vite dev server is not initialized."), options);
       return;
     }
 
@@ -96,7 +97,7 @@ export async function startDevServer(
         if (error instanceof Error) {
           vite?.ssrFixStacktrace(error);
         }
-        sendDevServerError(outgoing, error);
+        sendDevServerError(outgoing, error, options);
         return;
       }
 
@@ -263,8 +264,14 @@ function definedProjectOptions(options: StartDevServerOptions): AppRouterProject
   };
 }
 
-function sendDevServerError(outgoing: ServerResponse, error: unknown): void {
+function sendDevServerError(
+  outgoing: ServerResponse,
+  error: unknown,
+  options: Pick<StartDevServerOptions, "verboseErrors">,
+): void {
   outgoing.statusCode = 500;
   outgoing.setHeader("content-type", "text/plain; charset=utf-8");
-  outgoing.end(error instanceof Error ? error.stack : String(error));
+  outgoing.end(options.verboseErrors === true
+    ? error instanceof Error ? error.stack : String(error)
+    : "Internal Server Error");
 }

package/src/link.ts

@@ -1,4 +1,4 @@
-import { escapeHtmlAttribute } from "@reckona/mreact-shared/html-escape";
+import { escapeHtmlAttribute, escapeHtmlText } from "@reckona/mreact-shared/html-escape";
 import type { HtmlSink } from "@reckona/mreact-shared/compiler-contract";
 import type { ReactCompatElement, ReactCompatNode } from "@reckona/mreact-compat";
 import { safeUrlAttributeValue } from "@reckona/mreact-shared/url-safety";
@@ -87,7 +87,14 @@ function createAnchorElement(props: Record<string, unknown>): HTMLAnchorElement
       continue;
     }
 
-    anchor.setAttribute(attributeName(name), String(value));
+    const attrName = attributeName(name);
+    const safeValue = safeUrlAttributeValue(attrName, String(value));
+
+    if (safeValue === undefined) {
+      continue;
+    }
+
+    anchor.setAttribute(attrName, safeValue);
   }
 
   return anchor;
@@ -164,5 +171,19 @@ function renderChildren(child: LinkChild): string {
     return child.map(renderChildren).join("");
   }
 
-  return String(child);
+  if (typeof child === "string" && isPreRenderedSafeHtmlChild(child)) {
+    return child;
+  }
+
+  return escapeHtmlText(child);
+}
+
+function isPreRenderedSafeHtmlChild(value: string): boolean {
+  if (!/[<&]/.test(value)) {
+    return false;
+  }
+
+  return !/(?:<\s*\/?\s*(?:script|style|iframe|object|embed|link|meta|base)\b|\son[a-z]+\s*=|javascript\s*:)/iu.test(
+    value,
+  );
 }

package/src/middleware.ts

@@ -1,3 +1,5 @@
+import { normalizeRoutePath } from "./route-path.js";
+
 export interface RouteMiddlewareControl {
   skip?: boolean | readonly string[];
 }
@@ -133,20 +135,23 @@ export function mergeRouteMiddlewareControls(
 }
 
 function middlewarePatternMatches(pattern: string, pathname: string): boolean {
-  if (pattern === pathname) {
+  const normalizedPattern = normalizeRoutePath(pattern);
+  const normalizedPathname = normalizeRoutePath(pathname);
+
+  if (normalizedPattern === normalizedPathname) {
     return true;
   }
 
-  if (pattern.endsWith("/:path*")) {
-    const prefix = pattern.slice(0, -"/:path*".length);
+  if (normalizedPattern.endsWith("/:path*")) {
+    const prefix = normalizedPattern.slice(0, -"/:path*".length);
 
-    return pathname === prefix || pathname.startsWith(`${prefix}/`);
+    return normalizedPathname === prefix || normalizedPathname.startsWith(`${prefix}/`);
   }
 
-  if (pattern.endsWith("*")) {
-    const prefix = pattern.slice(0, -1);
+  if (normalizedPattern.endsWith("*")) {
+    const prefix = normalizedPattern.slice(0, -1);
 
-    return pathname.startsWith(prefix);
+    return normalizedPathname.startsWith(prefix);
   }
 
   return false;

package/src/multipart.ts

@@ -1,5 +1,6 @@
 export interface MultipartStreamParseOptions {
   fields?: Readonly<Record<string, MultipartStreamFieldOptions>>;
+  maxParts?: number;
   maxBytes?: number;
 }
 
@@ -11,6 +12,7 @@ export interface MultipartStreamFieldOptions {
 export interface MultipartStreamPart {
   name: string;
   filename?: string;
+  safeFilename?: string;
   contentType?: string;
   headers: Headers;
   body: ReadableStream<Uint8Array<ArrayBufferLike>>;
@@ -34,6 +36,8 @@ interface PartWriter {
 const crlf = "\r\n";
 const headerSeparator = "\r\n\r\n";
 const maxHeaderBytes = 64 * 1024;
+export const defaultMultipartMaxBytes = 10 * 1024 * 1024;
+export const defaultMultipartMaxParts = 1_000;
 
 export function parseMultipartStream(
   request: Request,
@@ -73,6 +77,7 @@ async function parseMultipartRequest(
   const keepTailBytes = delimiter.length + 4;
   let buffer: Uint8Array<ArrayBufferLike> = new Uint8Array();
   let totalBytes = 0;
+  let totalParts = 0;
   let started = false;
   let currentPart: PartWriter | undefined;
 
@@ -87,7 +92,7 @@ async function parseMultipartRequest(
 
       if (!next.done) {
         totalBytes += next.value.byteLength;
-        enforceByteLimit("multipart request", totalBytes, options.maxBytes);
+        enforceByteLimit("multipart request", totalBytes, options.maxBytes ?? defaultMultipartMaxBytes);
         buffer = concatBytes(buffer, next.value);
       }
 
@@ -136,6 +141,8 @@ async function parseMultipartRequest(
             break;
           }
 
+          totalParts += 1;
+          enforcePartLimit(totalParts, options.maxParts ?? defaultMultipartMaxParts);
           currentPart = createPartWriter(
             decodeAscii(buffer.slice(0, headerEnd)),
             options,
@@ -266,6 +273,7 @@ function createPart(options: {
 
   if (options.filename !== undefined) {
     part.filename = options.filename;
+    part.safeFilename = sanitizeMultipartFilename(options.filename);
   }
 
   const contentType = options.headers.get("content-type");
@@ -330,6 +338,29 @@ function enforceByteLimit(label: string, bytes: number, maxBytes: number | undef
   }
 }
 
+function enforcePartLimit(parts: number, maxParts: number | undefined): void {
+  if (maxParts !== undefined && parts > maxParts) {
+    throw new Error(`multipart request exceeded ${maxParts} parts.`);
+  }
+}
+
+export function sanitizeMultipartFilename(filename: string): string {
+  const leaf = filename.split(/[\\/]/u).at(-1) ?? "";
+  let sanitized = "";
+
+  for (const char of leaf) {
+    sanitized += isControlCharacter(char) ? "_" : char;
+  }
+
+  return sanitized === "" || sanitized === "." || sanitized === ".." ? "upload.bin" : sanitized;
+}
+
+function isControlCharacter(char: string): boolean {
+  const code = char.charCodeAt(0);
+
+  return code < 0x20 || code === 0x7f;
+}
+
 function parseMultipartBoundary(contentType: string | null): string | undefined {
   if (contentType === null) {
     return undefined;