@timber-js/app 0.2.0-alpha.211 → 0.2.0-alpha.213

package/src/server/flight-scripts.ts

@@ -16,6 +16,7 @@
  */
 
 import { nonceAttr } from './render-utils.ts';
+import { formStateToBase64 } from '../shared/form-state-flight.ts';
 
 // ─── JSON Escaping ────────────────────────────────────────────────────────
 
@@ -65,3 +66,15 @@ export function flightChunkScript(data: string, nonce?: string): string {
   const escaped = htmlEscapeJsonString(JSON.stringify([1, data]));
   return `<script${nonceAttr(nonce)}>(${FLIGHT_VAR}=${FLIGHT_VAR}||[]).push(${escaped})</script>`;
 }
+
+/**
+ * Generate the script that embeds a no-JS action's form state for
+ * hydration: its Flight bytes (server/form-state-flight.ts), as base64. Only
+ * a page answering a no-JS action has one. Base64 carries Flight's binary
+ * rows, which a text chunk would corrupt, and has no character that can end
+ * the script element or the string. See design/08-forms-and-actions.md
+ * §"No-JS Result Round-Trip".
+ */
+export function formStateScript(bytes: Uint8Array, nonce?: string): string {
+  return `<script${nonceAttr(nonce)}>self.__timber_form_state="${formStateToBase64(bytes)}"</script>`;
+}

package/src/server/form-data.ts

@@ -18,9 +18,15 @@
  * Handles:
  * - **Duplicate keys → arrays**: `tags=js&tags=ts` → `{ tags: ["js", "ts"] }`
  * - **Nested dot-paths**: `user.name=Alice` → `{ user: { name: "Alice" } }`
- * - **Empty strings → undefined**: Enables `.optional()` semantics in schemas
+ * - **Indexed lists → arrays**: `rows.0.name=A&rows.1.name=B` →
+ *   `{ rows: [{ name: "A" }, { name: "B" }] }`, when the indexes are exactly
+ *   `0..n-1`. A list with a gap stays an object keyed by index.
+ * - **Empty strings stay `""`**: a blank text input is `""`, so
+ *   `z.string().min(1, 'Required')` reports its own message. Use
+ *   `coerce.text` to make a blank optional field `undefined`
  * - **Empty Files → undefined**: File inputs with no selection become `undefined`
  * - **Strips `$ACTION_*` fields**: React's internal hidden fields are excluded
+ * - **Drops `__proto__` paths and names deeper than 32 segments**
  */
 export function parseFormData(formData: FormData): Record<string, unknown> {
   const flat: Record<string, unknown> = {};
@@ -97,6 +103,11 @@ function expandDotPaths(flat: Record<string, unknown>): Record<string, unknown>
     // `result['__proto__']` resolves to the prototype object itself.
     const parts = key.split('.');
     if (parts.some((p) => DANGEROUS_KEYS.has(p))) continue;
+    // Bound the nesting depth. Every walk over the parsed value recurses
+    // once per level (list conversion here, then file and sensitive-field
+    // stripping and schema validation), and a 10 KB key of 5,000 segments
+    // fits well inside the body limits. No form nests this deep.
+    if (parts.length > MAX_PATH_DEPTH) continue;
 
     if (parts.length === 1) {
       result[parts[0]] = value;
@@ -106,12 +117,13 @@ function expandDotPaths(flat: Record<string, unknown>): Record<string, unknown>
     let current: Record<string, unknown> = result;
     for (let i = 0; i < parts.length - 1; i++) {
       const part = parts[i];
-      if (current[part] === undefined || current[part] === null) {
-        current[part] = {};
-      }
-      // If current[part] is not an object (e.g., a string from a non-dotted key),
-      // the dot-path takes precedence
-      if (typeof current[part] !== 'object' || current[part] instanceof File) {
+      // Step only into an object this walk built. Anything else under the
+      // name — a string, a File, or an array from a duplicate key
+      // (`rows=x&rows=y`) — is replaced: the dot-path takes precedence.
+      // Stepping into an array would let `rows.4294967294` set its length
+      // to 2^32 - 1, and every later walk (file and sensitive-field
+      // stripping) maps over that length (TIM-1573).
+      if (!isPlainObject(current[part])) {
         current[part] = {};
       }
       current = current[part] as Record<string, unknown>;
@@ -120,9 +132,39 @@ function expandDotPaths(flat: Record<string, unknown>): Record<string, unknown>
     current[parts[parts.length - 1]] = value;
   }
 
+  // The top level is always an object: it is the form, not a list.
+  for (const [key, value] of Object.entries(result)) {
+    if (isPlainObject(value)) result[key] = indexedListsToArrays(value);
+  }
   return result;
 }
 
+/**
+ * `node`, with every nested object whose keys are exactly `"0".."n-1"`
+ * turned into an array, depth first. Only a dense, canonical index set
+ * converts: `{ "0", "2" }` (a gap), `{ "01" }` and `{ "0", "name" }` stay
+ * objects. So a forged `rows.99999` stays one key instead of allocating a
+ * sparse array, and the array's length is bounded by the field count limit.
+ *
+ * Object.keys lists integer-like keys first, in ascending order, so a dense
+ * set reads as `0, 1, … n-1` and `Object.values` is already in index order.
+ */
+function indexedListsToArrays(node: Record<string, unknown>): Record<string, unknown> | unknown[] {
+  for (const [key, value] of Object.entries(node)) {
+    if (isPlainObject(value)) node[key] = indexedListsToArrays(value);
+  }
+  const keys = Object.keys(node);
+  const dense = keys.length > 0 && keys.every((key, i) => key === String(i));
+  return dense ? Object.values(node) : node;
+}
+
+/** An object the dot-path walk built — not an array, File or other instance. */
+function isPlainObject(value: unknown): value is Record<string, unknown> {
+  return (
+    typeof value === 'object' && value !== null && Object.getPrototypeOf(value) === Object.prototype
+  );
+}
+
 // `__proto__` is the only key in this parser that escapes the dot-path
 // walk's `typeof !== 'object'` reset: accessing `obj['__proto__']` returns
 // `Object.prototype` (itself an object), so the walk steps into the global
@@ -132,13 +174,22 @@ function expandDotPaths(flat: Record<string, unknown>): Record<string, unknown>
 // keys and do not mutate anything global.
 const DANGEROUS_KEYS = new Set(['__proto__']);
 
+/**
+ * The most segments a dot-path field name may have. A deeper name is dropped,
+ * like a `__proto__` path, so no walk over the parsed value can exhaust the
+ * stack (TIM-1573).
+ */
+const MAX_PATH_DEPTH = 32;
+
 // ─── Coercion Helpers ────────────────────────────────────────────────────
 
 /**
  * Schema-agnostic coercion primitives for common FormData patterns.
  *
  * These are plain transform functions — they compose with any schema library's
- * `transform`/`preprocess` pipeline:
+ * `transform`/`preprocess` pipeline. In Zod, use `z.preprocess`: it runs on an
+ * absent key (an unchecked checkbox), where `z.unknown().transform()` fails
+ * with "expected nonoptional" before the transform runs.
  *
  * ```ts
  * // Zod
@@ -153,8 +204,9 @@ export const coerce = {
    * Use with `.optional()` schemas where an empty input means "not provided".
    *
    * ```ts
-   * // Zod
-   * z.unknown().transform(coerce.text).pipe(z.string().optional())
+   * // Zod — preprocess, not `z.unknown().transform(…)`: Zod 4 rejects an
+   * // absent key before a transform runs ("expected nonoptional")
+   * z.preprocess(coerce.text, z.string().optional())
    * // Valibot
    * v.pipe(v.unknown(), v.transform(coerce.text), v.optional(v.string()))
    * ```

package/src/server/form-state-flight.ts

@@ -0,0 +1,67 @@
+/**
+ * The no-JS action form state a page render hands React (TIM-1570), encoded
+ * with Flight (TIM-1572).
+ *
+ * Fizz renders the `useActionState` hook that submitted with the action's
+ * result, and the browser must hydrate with the same value, or the hook
+ * resets. Both get it from the Flight bytes encoded here: SSR decodes them
+ * for Fizz (`NavContext.formState`) and, once they decode, embeds them for
+ * `hydrateRoot` (server/ssr-form-state.ts; decoded by
+ * client/browser-entry/form-state.ts). Flight is what carries a
+ * `useActionState` result with JS, so a result has the same types with and
+ * without JS. See shared/form-state-flight.ts for the decode.
+ *
+ * A state Flight cannot encode must not turn the page into a 500 after the
+ * action's mutation committed, so it is dropped from both renders: the page
+ * renders with no result, as for a form without `useActionState`. That is a
+ * value Flight cannot serialize (a plain function, a class instance), which
+ * fails the action with JS too, or a nested promise that rejects or does not
+ * settle in time, which with JS reaches the hook as that rejected or pending
+ * promise. The no-JS page cannot carry a pending promise, and does not embed
+ * an error row.
+ *
+ * See design/08-forms-and-actions.md §"No-JS Result Round-Trip".
+ */
+
+import type { ReactFormState } from 'react-dom/client';
+import { renderToReadableStream } from '../rsc-runtime/rsc.ts';
+import { swallow } from './logger.ts';
+import { readAllBytesWithDeadline } from './stream-utils.ts';
+
+/**
+ * Serialize the form state with Flight, or return `null` when it cannot be,
+ * with a warning. The whole payload is read under one `timeoutMs` deadline,
+ * and the render stops when `signal` (the request's) aborts.
+ */
+export async function encodeFormState(
+  formState: ReactFormState,
+  timeoutMs: number,
+  signal?: AbortSignal
+): Promise<Uint8Array | null> {
+  let failure: unknown;
+  try {
+    // Flight reports a value it cannot serialize (anywhere in the tree,
+    // including a rejected nested promise) here, and writes an error row in
+    // its place; a result with an error row in it is not the action's result.
+    const flightErrors: unknown[] = [];
+    const stream = renderToReadableStream(formState, {
+      signal,
+      onError(error: unknown) {
+        flightErrors.push(error);
+      },
+    });
+    const bytes = await readAllBytesWithDeadline(stream, timeoutMs, 'no-JS form state encode');
+    if (flightErrors.length === 0) return bytes;
+    failure = flightErrors[0];
+  } catch (error) {
+    // The deadline, reported as itself: cancelling the read after it makes
+    // Flight report an abort to onError too, which says nothing of the cause.
+    failure = error;
+  }
+  swallow(
+    failure,
+    "a no-JS action's result could not be serialized with Flight, so the page renders without it",
+    { level: 'warn' }
+  );
+  return null;
+}

package/src/server/index.ts

@@ -49,10 +49,6 @@ export type {
 // FormData Preprocessing
 export { coerce, parseFormData } from './form-data.ts';
 
-// Form Flash (no-JS error round-trip)
-export { getFormFlash } from './form-flash.ts';
-export type { FormFlashData } from './form-flash.ts';
-
 // Revalidation — user-facing revalidation APIs
 export { revalidatePath, revalidateTag } from './actions.ts';
 

package/src/server/logger.ts

@@ -168,7 +168,12 @@ export function logProxyError(data: { error: unknown }): void {
 }
 
 /** Log unhandled error in server action. Level: error. */
-export function logActionError(data: { method: string; path: string; error: unknown }): void {
+export function logActionError(data: {
+  method: string;
+  path: string;
+  error: unknown;
+  errorId?: string;
+}): void {
   if (isControlFlowSignal(data.error)) return;
   _logger.error('unhandled server action error', withTraceContext(data));
 }

package/src/server/pipeline.ts

@@ -41,6 +41,8 @@ import { enforceRscCacheKey, hardenRscPayloadResponse } from './rsc-cache-key-gu
 import { stripHeadBody } from './head-response.ts';
 import { RSC_KEY_HEADERS } from '../shared/rsc-cache-key.ts';
 import { isDebug } from './debug.ts';
+import type { ReactFormState } from 'react-dom/client';
+import type { ActionErrorForRender } from './als-registry.ts';
 
 // ─── Route Match Result ────────────────────────────────────────────────────
 
@@ -249,11 +251,11 @@ export interface PipelineConfig {
    * from `req.url` (which re-encodes).
    *
    * The `reenter` parameter is the full pipeline function (including proxy,
-   * ALS, tracing) for the no-JS validation rerender path — the synthetic
-   * GET flows through the complete pipeline. Its `cookies` argument becomes
-   * that request's parsed cookies (`runWithRequestContext`'s `cookies`
-   * option), so the rerender reads the action's post-mutation state without
-   * the pipeline needing the same `Request` object to reach it.
+   * ALS, tracing) for the no-JS action rerender path — the synthetic GET
+   * flows through the complete pipeline. Its `cookies` become that request's
+   * parsed cookies and its `formState` the action's form state for SSR
+   * (`runWithRequestContext`'s options), so the rerender reads both without
+   * the pipeline needing the same `Request` object to reach them.
    *
    * Moved into the pipeline (TIM-1213) so proxy.ts runs on action POSTs,
    * matching the design doc contract: "proxy.ts runs on every request,
@@ -262,10 +264,23 @@ export interface PipelineConfig {
   dispatchAction?: (
     req: Request,
     canonicalPath: string,
-    reenter: (req: Request, cookies: Map<string, string>) => Promise<Response>
+    reenter: (req: Request, reentry: PipelineReentry) => Promise<Response>
   ) => Promise<Response | null>;
 }
 
+/**
+ * What the no-JS action rerender hands the pipeline when it re-enters it:
+ * the action's post-mutation cookies and, when its form used
+ * `useActionState`, the form state React decoded from the submission — or,
+ * when the action threw, the error to render in place of the page.
+ */
+export interface PipelineReentry {
+  cookies: Map<string, string>;
+  formState?: ReactFormState;
+  /** The error a no-JS action threw, rendered where the page would be. */
+  actionError?: ActionErrorForRender;
+}
+
 // ─── Pipeline ──────────────────────────────────────────────────────────────
 
 /**
@@ -295,7 +310,7 @@ export function createPipeline(config: PipelineConfig): (req: Request) => Promis
   // passes a synthetic GET back through the full pipeline (including
   // proxy, ALS, tracing). The inner closure captures `pipelineFn` by
   // name; by the time it's invoked, the const binding is initialized.
-  const pipelineFn = async (req: Request, cookies?: Map<string, string>): Promise<Response> => {
+  const pipelineFn = async (req: Request, reentry?: PipelineReentry): Promise<Response> => {
     const url = new URL(req.url);
     const method = req.method;
     const path = url.pathname;
@@ -536,7 +551,11 @@ export function createPipeline(config: PipelineConfig): (req: Request) => Promis
 
         return serverTiming === 'detailed' ? runWithTimingCollector(runRequest) : runRequest();
       };
-      return runWithRequestContext(req, inRequestContext, { cookies });
+      return runWithRequestContext(req, inRequestContext, {
+        cookies: reentry?.cookies,
+        formState: reentry?.formState,
+        actionError: reentry?.actionError,
+      });
     });
   };
 

package/src/server/request-context.ts

@@ -15,7 +15,11 @@
  */
 
 import type { CoercedParams } from '../shared/param-value.ts';
-import { requestContextAls, type RequestContextStore } from './als-registry.ts';
+import {
+  requestContextAls,
+  type ActionErrorForRender,
+  type RequestContextStore,
+} from './als-registry.ts';
 import { _setGetSearchParamsFn, _setGetSegmentParamsFn } from '../shared/als-slots.ts';
 import { appVisibleSearch } from '../shared/rsc-cache-key.ts';
 import {
@@ -25,6 +29,7 @@ import {
 } from '../shared/slot-params.ts';
 import { isDebug } from './debug.ts';
 import { runWithReactCacheScope, type ReactCacheScope } from './react-cache-scope.ts';
+import type { ReactFormState } from 'react-dom/client';
 
 // Re-export the ALS for framework-internal consumers that need direct access.
 export { requestContextAls };
@@ -321,6 +326,16 @@ export interface RequestContextOptions {
    * (TIM-868).
    */
   cookies?: Map<string, string>;
+  /**
+   * The form state of the no-JS action this render answers. Only the
+   * action dispatcher's re-entry passes it; see `RequestContextStore.formState`.
+   */
+  formState?: ReactFormState;
+  /**
+   * The error of the no-JS action this render answers. Only the action
+   * dispatcher's re-entry passes it; see `RequestContextStore.actionError`.
+   */
+  actionError?: ActionErrorForRender;
 }
 
 /**
@@ -342,7 +357,7 @@ export interface RequestContextOptions {
 export function runWithRequestContext<T>(
   req: Request,
   fn: () => T,
-  { reactCacheScope, cookies }: RequestContextOptions = {}
+  { reactCacheScope, cookies, formState, actionError }: RequestContextOptions = {}
 ): T {
   const originalCopy = new Headers(req.headers);
   const appVisible = appVisibleSearch(new URL(req.url));
@@ -366,6 +381,8 @@ export function runWithRequestContext<T>(
     cookieJar: new Map(),
     flushed: false,
     mutableContext: false,
+    formState,
+    actionError,
   };
   return requestContextAls.run(store, () => runWithReactCacheScope(fn, reactCacheScope));
 }
@@ -463,3 +480,23 @@ function freezeHeaders(source: Headers): Headers {
     },
   });
 }
+
+/**
+ * The form state of the no-JS action this render answers, or `null`. Read by
+ * the SSR renderer only (`rsc-entry/ssr-renderer.ts`), which passes it to
+ * Fizz and embeds it for `hydrateRoot`. Framework-internal: not exported
+ * from `@timber-js/app/server`.
+ */
+export function getFormStateForSsr(): ReactFormState | null {
+  return requestContextAls.getStore()?.formState ?? null;
+}
+
+/**
+ * The error of the no-JS action this render answers, or `null`. Read by the
+ * route element builder, which renders it in place of the page, and by the
+ * Flight `onError`, which gives it the ID the action logged it with.
+ * Framework-internal: not exported from `@timber-js/app/server`.
+ */
+export function getActionErrorForRender(): ActionErrorForRender | null {
+  return requestContextAls.getStore()?.actionError ?? null;
+}

package/src/server/route-element-builder.ts

@@ -50,6 +50,7 @@ import { setFirstDeniedSegmentIndex } from './deny-boundary.ts';
 import { loadModule, type ManifestLoader } from './safe-load.ts';
 import { loadFallbackModule } from './pipeline-helpers.ts';
 import { replaceOutermostSegmentOutlet } from './route-element-helpers.ts';
+import { getActionErrorForRender } from './request-context.ts';
 
 /**
  * The `segments` array handed to a layout's `SegmentProvider` — the value
@@ -264,8 +265,18 @@ export async function buildRouteElement(
   // so they go through createElement normally — no wrapper needed.
   const leafIndex = segments.length - 1;
   const leafDenyPages = denyPageChains.get(leafIndex);
+  // A no-JS action that threw is answered by this route with the error in
+  // place of its page (design/08 §"The Basic Wire-Up"). The layouts and
+  // access gates above still render, so the nearest error page answers and
+  // a denied segment's layout never wraps it — the render-error path.
+  const actionError = getActionErrorForRender();
   let element: React.ReactElement;
-  if (isClientReference(PageComponent)) {
+  if (actionError) {
+    const ActionError = (): never => {
+      throw actionError.error;
+    };
+    element = h(ActionError, {});
+  } else if (isClientReference(PageComponent)) {
     element = h(PageComponent, {});
   } else if (leafDenyPages && leafDenyPages.length > 0) {
     element = h(PageDenyBoundary, {

package/src/server/rsc-entry/action-dispatcher.ts

@@ -8,7 +8,8 @@
  * `createPipeline` calls it after proxy.ts runs (TIM-1213), so proxy.ts
  * sees action POSTs — "proxy.ts runs on every request, no exclusions." It
  * encapsulates action detection, the route-type check, action handler
- * dispatch, and the no-JS validation rerender path.
+ * dispatch, and the answer to a no-JS action that did not redirect: the
+ * page rerendered with React's form state, or the error page.
  *
  * The CSRF gate is not here: it runs in `createPipeline` before proxy.ts
  * (`csrfGate` in pipeline-helpers.ts). The action handler repeats the
@@ -19,12 +20,10 @@
  * auth/validation belongs in `createActionClient({ middleware })`.
  */
 
-import type { FormRerender } from '../action-handler.ts';
 import { handleActionRequest, isActionRequest } from '../action-handler.ts';
 import type { BodyLimitsConfig } from '../body-limits.ts';
 import type { CsrfConfig } from '../csrf.ts';
-import { runWithFormFlash } from '../form-flash.ts';
-import type { RouteMatcher } from '../pipeline.ts';
+import type { PipelineReentry, RouteMatcher } from '../pipeline.ts';
 import { isApiRouteChain } from '../route-matcher.ts';
 import type { SensitiveFieldsOption } from '../sensitive-fields.ts';
 import type { RevalidateRenderer } from '../actions.ts';
@@ -69,8 +68,8 @@ export interface ActionDispatcherDeps {
  *
  * Called after proxy.ts runs (inside the pipeline) for every request.
  * Checks if the request is a server action POST, handles the route-type
- * check (TIM-870), dispatches to the action handler, and handles the
- * no-JS validation rerender path.
+ * check (TIM-870), dispatches to the action handler, and answers a no-JS
+ * action that did not redirect.
  *
  * Returns `Response` if the request was handled as an action, `null` to
  * fall through to normal routing.
@@ -80,12 +79,12 @@ export function buildActionDispatcher(
 ): (
   req: Request,
   canonicalPath: string,
-  reenter: (req: Request, cookies: Map<string, string>) => Promise<Response>
+  reenter: (req: Request, reentry: PipelineReentry) => Promise<Response>
 ) => Promise<Response | null> {
   return async (
     req: Request,
     canonicalPath: string,
-    reenter: (req: Request, cookies: Map<string, string>) => Promise<Response>
+    reenter: (req: Request, reentry: PipelineReentry) => Promise<Response>
   ): Promise<Response | null> => {
     if (!isActionRequest(req)) return null;
 
@@ -109,34 +108,41 @@ export function buildActionDispatcher(
       revalidateRenderer: deps.buildRevalidateRenderer(req),
     });
 
-    if (actionResponse) {
-      // No-JS validation rerender
-      if ('rerender' in actionResponse) {
-        const formRerender = actionResponse as FormRerender;
-        // Build a synthetic GET request for the rerender pipeline:
-        //   - Same URL (so route matching lands on the same page)
-        //   - Cookie header DROPPED entirely. The post-action RYW state
-        //     is handed to `reenter` as a parsed `Map<string, string>`,
-        //     which becomes the rerender request context's cookies.
-        //   - Method GET because the rerender is conceptually a page render.
-        const rerenderHeaders = new Headers(req.headers);
-        rerenderHeaders.delete('cookie');
-        const rerenderReq = new Request(req.url, {
-          method: 'GET',
-          headers: rerenderHeaders,
-        });
-        const response = await runWithFormFlash(formRerender.rerender, () =>
-          reenter(rerenderReq, formRerender.cookies)
-        );
-        // Apply Set-Cookie headers snapshotted from the action's ALS scope.
-        for (const value of formRerender.setCookieHeaders) {
-          response.headers.append('Set-Cookie', value);
-        }
-        return response;
-      }
+    if (actionResponse === null || actionResponse instanceof Response) {
       return actionResponse;
     }
 
-    return null;
+    // Both answers re-enter the pipeline for a page render of the same URL,
+    // as a GET — the rerender with the action's form state, the throw with
+    // its error, which the route renders in place of its page so the
+    // nearest error page answers (SSR has no error boundaries, so that page
+    // comes from the shell-failure path):
+    //   - Same URL (so route matching lands on the same page)
+    //   - Cookie header DROPPED entirely. The post-action RYW state is
+    //     handed over as a parsed `Map<string, string>` and becomes the
+    //     render's request-context cookies, so the page reads what the
+    //     action wrote, not what the request carried (TIM-868).
+    //   - Method GET because it is a page render.
+    //   - The POST's abort signal, so a client that disconnects stops the
+    //     render (and the form state encode) as it would any page's.
+    const rerenderHeaders = new Headers(req.headers);
+    rerenderHeaders.delete('cookie');
+    const rerenderReq = new Request(req.url, {
+      method: 'GET',
+      headers: rerenderHeaders,
+      signal: req.signal,
+    });
+    const { cookies } = actionResponse;
+    const response = await reenter(
+      rerenderReq,
+      actionResponse.kind === 'error'
+        ? { cookies, actionError: { error: actionResponse.error, errorId: actionResponse.errorId } }
+        : { cookies, formState: actionResponse.formState }
+    );
+    // Apply Set-Cookie headers snapshotted from the action's ALS scope.
+    for (const value of actionResponse.setCookieHeaders) {
+      response.headers.append('Set-Cookie', value);
+    }
+    return response;
   };
 }

package/src/server/rsc-entry/error-renderer.ts

@@ -29,6 +29,7 @@ import { getCookiesForSsr } from '../cookie-context.ts';
 import { callSsr } from './ssr-bridge.ts';
 import { teeWithErrorPropagation } from '../stream-utils.ts';
 import { isDevMode } from '../debug.ts';
+import { clientErrorMessage } from '../client-error-message.ts';
 import { ErrorReconstituter } from '../../client/error-reconstituter.tsx';
 import type { SerializableError } from '../../client/error-reconstituter.tsx';
 import type { ManifestLoader } from '../safe-load.ts';
@@ -148,7 +149,7 @@ function toSerializableError(error: unknown): SerializableError {
   const err = error instanceof Error ? error : new Error(String(error));
   const devMode = isDevMode();
   return {
-    message: devMode ? err.message : 'An unexpected error occurred.',
+    message: clientErrorMessage(err),
     name: devMode ? err.name : 'Error',
     ...(devMode && err.stack ? { stack: err.stack } : {}),
   };

package/src/server/rsc-entry/index.ts

@@ -322,6 +322,7 @@ async function createRequestHandler(manifest: typeof routeManifest, runtimeConfi
           clientSegmentCache,
           renderDenyFallback,
           buildManifest: typedBuildManifest,
+          renderTimeoutMs: (config as Record<string, unknown>).renderTimeoutMs as number,
           globalError: manifest.globalError,
         },
         interception

package/src/server/rsc-entry/render-route.ts

@@ -38,6 +38,8 @@ import type { DenyFallbackRenderer } from './deny-fallback.ts';
 import { isRscRequest } from '../../shared/rsc-media-type.ts';
 import { buildRscPayloadResponse } from './rsc-payload.ts';
 import { renderRscStream } from './rsc-stream.ts';
+import { encodeFormState } from '../form-state-flight.ts';
+import { getFormStateForSsr } from '../request-context.ts';
 import { renderSsrResponse } from './ssr-renderer.ts';
 
 /**
@@ -51,6 +53,8 @@ export interface RenderRouteDeps {
   clientSegmentCache: boolean;
   renderDenyFallback: DenyFallbackRenderer;
   buildManifest: BuildManifest;
+  /** The resolved `renderTimeoutMs`: bounds encoding a no-JS form state. */
+  renderTimeoutMs: number;
   globalError?: { load: () => Promise<unknown>; filePath: string };
 }
 
@@ -210,6 +214,17 @@ export async function renderRoute(
     );
   }
 
+  // The form state of the no-JS action this page answers, if any, as the
+  // Flight bytes both SSR and the browser decode (design/08 §"No-JS Result
+  // Round-Trip"). Encoded while the RSC render above is already running,
+  // under the render timeout and the request's abort signal. A promise in
+  // the result holds the response until it settles: the page must carry the
+  // whole state, as Fizz would wait for it anyway.
+  const pendingFormState = getFormStateForSsr();
+  const formState = pendingFormState
+    ? await encodeFormState(pendingFormState, deps.renderTimeoutMs, req.signal)
+    : null;
+
   // Pipe through SSR for HTML rendering with streaming Suspense support.
   return renderSsrResponse({
     req,
@@ -225,5 +240,6 @@ export async function renderRoute(
     deferSuspenseFor,
     globalError,
     slotSkipInfo,
+    formState,
   });
 }