@rangojs/router 0.24.3 → 0.25.0

package/src/server/request-context.ts

@@ -23,7 +23,7 @@ import {
   serializeStateCookie,
 } from "../browser/cookie-name.js";
 import type { LoaderDefinition, LoaderContext } from "../types.js";
-import type { ScopedReverseFunction } from "../reverse.js";
+import type { AutofillAwareReverseFunction } from "../types/handler-context.js";
 import type {
   DefaultEnv,
   DefaultReverseRouteMap,
@@ -65,6 +65,8 @@ import {
 } from "../theme/constants.js";
 import type { LocationStateEntry } from "../browser/react/location-state-shared.js";
 import type { RoutineTrace } from "../rsc/routine-plan.js";
+import type { ActionContinuation } from "../rsc/server-action.js";
+import type { FormActionOutcome } from "../rsc/progressive-enhancement.js";
 import { NOCACHE_SYMBOL, assertNotInsideCacheExec } from "../cache/taint.js";
 import {
   assertCachedHeaderWriteAllowed,
@@ -345,6 +347,13 @@ export interface RequestContext<
    */
   _shellCaptureRun?: boolean;
 
+  /**
+   * @internal Set beside `_shellCaptureRun` when the shell is keyed by the
+   * visitor's URL (`rewrite(...).shell("visitor")`): the capture renders the
+   * visitor's location and `ctx.rewrittenFrom`; the theme stays the default.
+   */
+  _shellCaptureForVisitor?: boolean;
+
   /**
    * @internal Bake-lane loader containers collected DURING a shell capture:
    * segment-key -> the loader's (pre-wrap) result promise. Populated by
@@ -774,8 +783,15 @@ export interface RequestContext<
    * Generate URLs from route names.
    * Uses the global route map. After route matching, scoped (`.name`) resolution
    * works within the matched include() scope.
-   */
-  reverse: ScopedReverseFunction<
+   *
+   * Params are optional in the type because the fill depends on the phase.
+   * After the route match (route middleware, handlers, loaders, server actions)
+   * missing params come from the matched route's params; explicit params win.
+   * In global middleware before `next()` nothing is matched and the fill is
+   * empty, so a route with a required param throws `Missing param "<name>" for
+   * route "<route>"` at runtime (a param-less route still resolves).
+   */
+  reverse: AutofillAwareReverseFunction<
     Record<string, string>,
     DefaultReverseRouteMap
   >;
@@ -786,6 +802,13 @@ export interface RequestContext<
   /** @internal Previous route key (from the navigation source), used for revalidation */
   _prevRouteKey?: string;
 
+  /**
+   * @internal Leaving a rewritten page, the visitor's URL moved
+   * (router/match-api.ts): the default revalidation counts it as a search
+   * change, since the render may read `ctx.rewrittenFrom`.
+   */
+  _visitorMoved?: boolean;
+
   /**
    * @internal True while the post-action revalidation render is running (set by
    * revalidateAfterAction). The "use cache" runtime reads this to prefer
@@ -796,6 +819,19 @@ export interface RequestContext<
    */
   _inActionRevalidation?: boolean;
 
+  /**
+   * @internal The outcome of the action this request ran (a JS server
+   * action's continuation, a no-JS form post's form state), set before route
+   * middleware wraps the re-render. While it is unset, applyRewrite
+   * (rsc/rewrite-passes.ts) moves a mutation with its body, so the action
+   * runs on the target's pass, or refuses it (`disallowMutations()`, or a
+   * body middleware read); once set, the request moves to the target, whose
+   * pass re-renders from it instead of running the action again (#1145).
+   */
+  _actionRan?:
+    | { kind: "action"; continuation: ActionContinuation }
+    | { kind: "form"; outcome: FormActionOutcome };
+
   /**
    * @internal Render barrier for experimental `rendered()` API.
    * Resolves when all non-loader segments have settled and handle data
@@ -1017,6 +1053,7 @@ export type PublicRequestContext<
   | "_onDemandProducer"
   | "_searchParamsFilter"
   | "_shellCaptureRun"
+  | "_shellCaptureForVisitor"
   | "_shellImplicitCache"
   | "_shellLoaderSeed"
   | "_shellCaptureLoaderRecords"
@@ -1048,7 +1085,9 @@ export type PublicRequestContext<
   | "_locationState"
   | "_routeName"
   | "_prevRouteKey"
+  | "_visitorMoved"
   | "_inActionRevalidation"
+  | "_actionRan"
   | "_reportedErrors"
   | "_renderErrors"
   | "_recoveredHandlerErrors"

package/src/server/request-headers.ts

@@ -45,6 +45,38 @@ export function requestHeaders(request: Request): Headers {
   return RAW_HEADERS.get(request) ?? request.headers;
 }
 
+/**
+ * A copy of `request`'s headers for a bodyless mirror of it (the PE
+ * re-render, route middleware around it, a rewrite pass after an action),
+ * without the body-framing ones and `content-type`, so a body check gated on
+ * the content-type passes over a request that has no body.
+ */
+export function bodylessHeaders(request: Request): Headers {
+  const headers = new Headers(requestHeaders(request));
+  headers.delete("content-length");
+  headers.delete("content-encoding");
+  headers.delete("transfer-encoding");
+  headers.delete("content-type");
+  return headers;
+}
+
+/**
+ * A bodyless mirror of `request` at `url`: `method`, its
+ * {@link bodylessHeaders}, the signal and workerd's `cf`.
+ */
+export function bodylessRequest(
+  url: string | URL,
+  request: Request,
+  method: string,
+): Request {
+  return new Request(url, {
+    method,
+    headers: bodylessHeaders(request),
+    signal: request.signal,
+    cf: (request as { cf?: unknown }).cf,
+  } as RequestInit);
+}
+
 /**
  * Shadow `request.headers` with an own, non-enumerable getter that calls
  * `beforeRead` and returns the request's own Headers (stable per request, so

package/src/server/rewrite-trail.ts

@@ -11,8 +11,15 @@
 import { contextGet, contextSet, createVar } from "../context-var.js";
 import { RewriteLoopError } from "../errors.js";
 import { documentCacheStoresRender } from "../cache/document-cache-policy.js";
-import { guardIdentityRead, type IdentityReadWording } from "./context.js";
+import {
+  guardIdentityRead,
+  recordLoaderIdentityRead,
+  refuseInCacheScope,
+  type IdentityReadWording,
+} from "./context.js";
+import { isInsideIdentityExempt } from "../cache/cache-exec-scope.js";
 import { stripInternalParams } from "../router/internal-params.js";
+import type { RewriteShell } from "../route-definition/rewrite.js";
 import type { RequestContext } from "./request-context.js";
 
 /** Most rewrites one request may take; the next one is a RewriteLoopError. */
@@ -23,7 +30,8 @@ const REWRITE_TRAIL = createVar<readonly string[]>();
 
 type TrailContext = Pick<RequestContext<any>, "_variables">;
 
-function pathKey(url: URL): string {
+/** A URL's path and search: what a rewrite hop, a target and a visitor's move compare. */
+export function pathKey(url: URL): string {
   return url.pathname + url.search;
 }
 
@@ -60,6 +68,25 @@ export function recordRewriteHop(
   return hops;
 }
 
+/** The `.shell()` choice of the hop that reached the route that renders. */
+const REWRITE_SHELL = createVar<RewriteShell | undefined>();
+
+export function recordRewriteShell(
+  reqCtx: TrailContext,
+  audience: RewriteShell | undefined,
+): void {
+  contextSet(reqCtx._variables, REWRITE_SHELL, audience);
+}
+
+/** The last hop's `rewrite(...).shell()` choice; undefined: none. */
+export function rewriteShellAudience(
+  reqCtx: TrailContext | undefined,
+): RewriteShell | undefined {
+  return reqCtx?._variables
+    ? (contextGet(reqCtx._variables, REWRITE_SHELL) as RewriteShell | undefined)
+    : undefined;
+}
+
 type AudienceContext = Pick<
   RequestContext<any>,
   "_shellCaptureRun" | "_documentCacheRender" | "res"
@@ -68,7 +95,8 @@ type AudienceContext = Pick<
 /**
  * A render other visitors may be served: a PPR shell capture, or a render
  * the document cache stores (its response opted in before next()). It shows
- * what a direct visit to its URL shows: no visitor theme, no visitor URL.
+ * no visitor theme, and no visitor URL unless it is a visitor-keyed shell
+ * capture (`_shellCaptureForVisitor`).
  */
 export function rendersForSharedAudience(reqCtx: AudienceContext): boolean {
   return reqCtx._shellCaptureRun === true || documentCacheStoresRender(reqCtx);
@@ -112,9 +140,9 @@ export type RewrittenFromReader = "render" | "middleware";
  * The read behind every `ctx.rewrittenFrom`. Guarded like cookies(): inside
  * a `cache()` boundary or a `"use cache"` function it throws, and a loader's
  * own `cache()` fill records it. A render other visitors may be served sees
- * `undefined`, as on a direct visit; any other render that sees the visitor's
- * URL marks `_payloadVisitorLocation`, so the document cache does not store
- * it.
+ * `undefined`, as on a direct visit, except a visitor-keyed shell capture,
+ * whose key covers the URL; any other render that sees the visitor's URL
+ * marks `_payloadVisitorLocation`, so the document cache does not store it.
  */
 function readRewrittenFrom(
   reqCtx: RequestContext<any> | undefined,
@@ -122,7 +150,15 @@ function readRewrittenFrom(
 ): string | undefined {
   if (!reqCtx) return undefined;
   if (reader === "render" && rendersForSharedAudience(reqCtx)) {
-    return undefined;
+    if (!reqCtx._shellCaptureForVisitor) return undefined;
+    // guardIdentityRead minus the capture guard: a cache() boundary, a "use
+    // cache" body or a loader's own cache() inside the capture is keyed
+    // without the URL.
+    if (!isInsideIdentityExempt()) {
+      refuseInCacheScope("ctx.rewrittenFrom", REWRITTEN_FROM_READ, reqCtx);
+      recordLoaderIdentityRead("ctx.rewrittenFrom", REWRITTEN_FROM_READ.verb);
+    }
+    return rewriteTrail(reqCtx)?.[0];
   }
   guardIdentityRead(reqCtx, "ctx.rewrittenFrom", REWRITTEN_FROM_READ);
   const href = rewriteTrail(reqCtx)?.[0];
@@ -145,15 +181,25 @@ function copyFor(holder: object, href: string | undefined): URL | undefined {
   return copy;
 }
 
+/**
+ * The ctx defineRewrittenFrom ran on: `holder`, or the one it derives from
+ * (a layout's ctx is an Object.create child of the route's, withReverseScope).
+ */
+function definedOn(holder: object): object {
+  while (!SOURCES.has(holder)) holder = Object.getPrototypeOf(holder);
+  return holder;
+}
+
 /**
  * Non-enumerable, like `ctx.theme`: serializing a ctx (React's dev debug
  * info) must not count as a read.
  */
 const SCOPED_DESCRIPTOR: PropertyDescriptor = {
   get(this: object): URL | undefined {
+    const owner = definedOn(this);
     const href = readRewrittenFrom(
-      SOURCES.get(this),
-      READERS.get(this) ?? "render",
+      SOURCES.get(owner),
+      READERS.get(owner) ?? "render",
     );
     return copyFor(this, href);
   },

package/src/ssr/ssr-root.tsx

@@ -16,9 +16,10 @@ import type { NavigationStoreContextValue } from "../browser/react/context.js";
 import type { HandleData } from "../browser/types.js";
 import type { ResolvedSegment } from "../types.js";
 import type { ResolvedThemeConfig, Theme } from "../theme/types.js";
-import type {
-  EventController,
-  DerivedNavigationState,
+import {
+  DEFAULT_ACTION_STATE,
+  type EventController,
+  type DerivedNavigationState,
 } from "../browser/event-controller.js";
 
 /**
@@ -111,16 +112,11 @@ function createSsrEventController(opts: {
     getState: () => state,
     getLocation: () => location,
     subscribe: () => () => {},
-    getActionState: () => ({
-      state: "idle",
-      actionId: null,
-      payload: null,
-      error: null,
-      result: null,
-    }),
+    getActionState: () => DEFAULT_ACTION_STATE,
     subscribeToAction: () => () => {},
     subscribeToHandles: () => () => {},
     flushRouteState: () => {},
+    releaseRouteState: () => {},
     setHandleData: () => {},
     getHandleState: () => handleState,
     lockHydration: () => {},

package/src/testing/dispatch.ts

@@ -129,7 +129,7 @@ import type { CacheProfile } from "../cache/profile-registry.js";
 // onto the whole testing barrel's eager graph and break every consumer suite
 // that imports `@rangojs/router/testing` without mocking plugin-rsc.
 import type { EntryData } from "../server/context.js";
-import { setRouterManifest } from "../route-map-builder.js";
+import { ensureRouterTrie } from "../rsc/manifest-init.js";
 import { RESPONSE_TYPE_MIME } from "../router/content-negotiation.js";
 import { RouterError } from "../errors.js";
 import { createProblemDetails } from "../rsc/response-error.js";
@@ -170,6 +170,8 @@ interface DispatchableRouter<TEnv> {
   /** createRouter({ version }), the consumer-set version. */
   version?: string;
   routeMap: Record<string, unknown>;
+  /** The routes() patterns the dev trie is rebuilt from (rsc/manifest-init.ts). */
+  urlpatterns?: unknown;
   middleware: MiddlewareEntry<TEnv>[];
   onError?: OnErrorCallback<TEnv>;
   /**
@@ -409,11 +411,8 @@ export async function dispatch<TEnv = any>(
   const url = new URL(req.url);
   const env = (opts.env ?? {}) as TEnv;
 
-  // Seed the per-router manifest so reverse() resolves during handler execution.
   const routerId = router.id ?? router.routerId;
-  if (routerId) {
-    setRouterManifest(routerId, router.routeMap as Record<string, string>);
-  }
+  await ensureRouterTrie(router);
 
   // The visitor's URL is matched before any middleware runs, so an RSC route
   // fails here, before a middleware side effect. A rewrite target is matched

package/src/testing/e2e/index.ts

@@ -51,6 +51,7 @@ export {
   PPR_REPLAY_STATUS_HEADER,
   shellCacheKey,
   SHELL_STATUS_HEADER,
+  visitorShellCacheKey,
   type PprReplayBypassReason,
   type PprReplayStatus,
   type ShellCachePartition,

package/src/testing/flight.entry.ts

@@ -67,5 +67,6 @@ export type {
   ServeShellRequestAction,
   ServeShellRequestOptions,
   ServeShellRequestResult,
+  ShellRequestAction,
   ShellRequestHandles,
 } from "./serve-shell-request.js";

package/src/testing/index.ts

@@ -112,6 +112,7 @@ export {
   PPR_REPLAY_STATUS_HEADER,
   shellCacheKey,
   SHELL_STATUS_HEADER,
+  visitorShellCacheKey,
 } from "./shell-status.js";
 export type {
   PprReplayBypassReason,

package/src/testing/internal/client-urls-projection.ts

@@ -19,9 +19,10 @@ import type { ShouldRevalidateFn } from "../../types.js";
  *
  * A Vitest project runs no hoist plugin, so the source's revalidate()
  * predicates are plain functions. Each is registered under a key named for
- * its reference, route and loader, as the plugin's generated module registers
- * its own, and the projection carries the keys: materialization attaches them
- * and the server runs them, as in an app.
+ * its reference, route or intercept, and loader, as the plugin's generated
+ * module registers its own, and the projection carries the keys:
+ * materialization attaches them and the server runs them, as in an app. A
+ * boolean rides in the projection as itself, as the plugin leaves a literal.
  */
 export function installClientUrlsProjection(
   referenceId: string,
@@ -50,21 +51,40 @@ function withRevalidateKeys(
   projection: ClientUrlProjection,
 ): ClientUrlProjection {
   const fns: Record<string, ShouldRevalidateFn<any, any>> = {};
-  const routes = projection.routes.map((route) => {
-    const record = definition.routes.find(({ id }) => id === route.id);
-    const loaderRevalidate = (record?.loaders ?? []).map(
+  // A route's or an intercept's loaders, keyed under `owner`.
+  const withKeys = <T extends object>(
+    projected: T,
+    owner: string,
+    loaders: ClientUrlPatterns["routes"][number]["loaders"] | undefined,
+  ): T => {
+    const loaderRevalidate = (loaders ?? []).map(
       ({ revalidate }, loaderIndex) =>
         revalidate.map((entry, index) => {
           if (isHoistedRevalidateRef(entry)) return entry.$$rangoRevalidate;
-          const key = `${referenceId}:${route.id}:${loaderIndex}:${index}`;
+          if (typeof entry === "boolean") return entry;
+          const key = `${referenceId}:${owner}:${loaderIndex}:${index}`;
           fns[key] = entry;
           return key;
         }),
     );
     return loaderRevalidate.some((keys) => keys.length > 0)
-      ? { ...route, loaderRevalidate }
-      : route;
-  });
+      ? { ...projected, loaderRevalidate }
+      : projected;
+  };
+  const routes = projection.routes.map((route) =>
+    withKeys(
+      route,
+      route.id,
+      definition.routes.find(({ id }) => id === route.id)?.loaders,
+    ),
+  );
+  const intercepts = projection.intercepts?.map((intercept, index) =>
+    withKeys(
+      intercept,
+      `intercept${index}`,
+      definition.intercepts[index]?.loaders,
+    ),
+  );
   registerClientUrlRevalidators(fns);
-  return { ...projection, routes };
+  return { ...projection, routes, ...(intercepts && { intercepts }) };
 }

package/src/testing/render-route.tsx

@@ -23,13 +23,16 @@
  *     SEEDED directly into client context (see the `loaders` / `locationState` /
  *     `handles` / `outletPending` options) — nothing is executed on the server.
  *     This exercises the context read path, not the run path.
- *   - navigate() does NOT drive the navigation lifecycle: useNavigation().state,
- *     useLinkStatus().pending, and useAction().state stay "idle". Assert
- *     pending/loading/submitting transition states with renderServerTree / e2e
- *     instead (navigate() warns once if used). The one pending state it does
- *     model is the held-navigation useLoader().isLoading: a `transition` spec
- *     plus a pending Promise seeded via navigate(url, { loaders }) commits
- *     through production's commitInTransition (browser/partial-update.ts).
+ *   - navigate() drives the navigation lifecycle as a click does:
+ *     useNavigation() reads loading from the call and idle with the commit,
+ *     and useLinkStatus().pending is true for a link to the destination until
+ *     the commit is handed to React. A `transition` spec plus a pending
+ *     Promise seeded via navigate(url, { loaders }) commits through
+ *     production's commitInTransition (browser/partial-update.ts), which React
+ *     holds: useNavigation() stays loading and the held reader's
+ *     useLoader().isLoading reads true until the data lands. Without
+ *     `transition` the commit is urgent (production's same-structure hold is
+ *     not modeled). useAction().state stays idle: no action runs.
  *   - A spec's transition({ when }) decides every commit with production's
  *     browser decision: navigate() and useRouter().push model kind "push",
  *     useRouter().replace kind "replace", refresh() kind "revalidate".
@@ -81,7 +84,10 @@ import type {
   NavigationBridge,
   UpdateSubscriber,
 } from "../browser/types.js";
-import type { EventController } from "../browser/event-controller.js";
+import type {
+  EventController,
+  NavigationHandle,
+} from "../browser/event-controller.js";
 import type { ResolvedSegment, RscMetadata } from "../browser/types.js";
 import { NavigationProvider } from "../browser/react/NavigationProvider.js";
 import {
@@ -407,9 +413,10 @@ export interface TestRouterHandle {
    * pending Promise suspends the read like a streaming Flight chunk. When a
    * spec in the chain has `transition`, the commit goes through production's
    * commitInTransition: the reader stays on screen with
-   * `useLoader().isLoading === true` until the promise settles. Settle it
-   * inside RTL's `act()` to flush the commit. Without `transition` the commit
-   * is urgent and the read suspends to the nearest Suspense boundary.
+   * `useLoader().isLoading === true`, and `useNavigation().state` reads
+   * "loading", until the promise settles. Settle it inside RTL's `act()` to
+   * flush the commit. Without `transition` the commit is urgent and the read
+   * suspends to the nearest Suspense boundary.
    *
    * @example
    * await router.navigate("/products/2", { loaders: [[ProductLoader, next]] });
@@ -429,10 +436,16 @@ export interface TestRouterHandle {
    * location state as a production replace does). With neither, history is
    * left alone and readers keep the state they have: `navigate(url)` and
    * `navigate(url, { replace: false })` are the same call.
+   *
+   * `options.handles` are the destination's handle pushes (`[handle,
+   * values]`, attached to its leaf route as in `renderRoute`'s own
+   * `handles`). They arrive on the response's handle stream, so `useHandle`
+   * readers take them with the page's commit: while React holds the page,
+   * readers keep the values of the page being left.
    */
   navigate(
     url: string,
-    options?: Pick<RenderRouteOptions, "loaders"> &
+    options?: Pick<RenderRouteOptions, "loaders" | "handles"> &
       Pick<NavigateOptions, "state" | "replace" | "transition">,
   ): Promise<void>;
   /**
@@ -791,17 +804,36 @@ export async function renderRoute(
     };
   }
 
-  let warnedNavLifecycle = false;
+  type NavigateCall = Pick<RenderRouteOptions, "loaders" | "handles"> & {
+    history?: Pick<NavigateOptionsInternal, "state" | "replace" | "transition">;
+    kind?: TransitionWhenKind;
+    transition?: boolean;
+  };
+  // The navigation's lifecycle, as navigation-transaction.ts drives it:
+  // useNavigation() reads loading from the call, delivered before the commit
+  // as a click's notification goes out while its response is in flight, and
+  // idle with the location at the commit, which React may hold.
   const navigate = async (
     target: string,
-    navOptions?: Pick<RenderRouteOptions, "loaders"> & {
-      history?: Pick<
-        NavigateOptionsInternal,
-        "state" | "replace" | "transition"
-      >;
-      kind?: TransitionWhenKind;
-      transition?: boolean;
-    },
+    navOptions?: NavigateCall,
+  ): Promise<void> => {
+    const handle = eventController.startNavigation(
+      new URL(target, TEST_ORIGIN).href,
+    );
+    // Synchronous, in the caller's task: a <Link> click's own act() scope
+    // takes it, and no act() of the caller's can overlap it.
+    act(() => eventController.flushRouteState());
+    try {
+      await commitNavigation(handle, target, navOptions);
+    } finally {
+      // Back to idle when the commit never came (a render that threw).
+      handle[Symbol.dispose]();
+    }
+  };
+  const commitNavigation = async (
+    handle: NavigationHandle,
+    target: string,
+    navOptions?: NavigateCall,
   ): Promise<void> => {
     // A useRouter().push/replace or <Link> navigation (`history`) writes its
     // entry the way production does (navigation-bridge.ts navigate ->
@@ -819,21 +851,6 @@ export async function renderRoute(
             : undefined,
         )
       : undefined;
-    // No server fetch, so the navigation lifecycle never starts: the state
-    // useNavigation()/useLinkStatus()/useAction() read stays "idle" — asserting
-    // a pending/loading/submitting state here proves nothing. Warn once (per
-    // render) under the test runner so that false-confidence trap is loud.
-    if (isUnderTestRunner() && !warnedNavLifecycle) {
-      warnedNavLifecycle = true;
-      console.warn(
-        "renderRoute: navigate()/useRouter().push do NOT drive the navigation " +
-          "lifecycle. useNavigation().state, useLinkStatus().pending, and " +
-          'useAction().state stay "idle" here. Assert params/pathname/content ' +
-          "after navigate(); use renderServerTree or e2e to assert " +
-          "pending/loading/submitting transition states. A held " +
-          "useLoader().isLoading is modeled: see navigate(url, { loaders }).",
-      );
-    }
     const nextUrl = new URL(target, TEST_ORIGIN);
     const match = resolve(nextUrl.pathname);
     const segments = buildSegments(
@@ -843,6 +860,23 @@ export async function renderRoute(
       mount,
     );
     const metadata = makeMetadata(nextUrl.pathname, segments, match.params);
+    // The destination's handle pushes arrive on the response's handle
+    // stream, as production's do, behind the page's commit.
+    const navHandles = navOptions?.handles;
+    if (navHandles) {
+      const leafId =
+        [...segments].reverse().find((s) => s.type === "route")?.id ??
+        segments[segments.length - 1]?.id;
+      const pushed: HandleDataSeed = {};
+      for (const [h, values] of navHandles) {
+        if (leafId === undefined) continue;
+        const id = (h as unknown as { $$id: string }).$$id;
+        (pushed[id] ??= {})[leafId] = values;
+      }
+      metadata.handles = (async function* () {
+        yield pushed;
+      })();
+    }
     // Production's browser-run transition({ when }) decision
     // (browser/partial-update.ts): the committed location is the source.
     const kind: TransitionWhenKind =
@@ -872,7 +906,10 @@ export async function renderRoute(
       outletPending: options.outletPending,
       transitionGatedOff: gatedOff,
     });
-    eventController.setLocation(nextUrl);
+    // A newer navigate() started meanwhile: this one commits nothing, as
+    // production's (browser/partial-update.ts) returns on its aborted signal.
+    if (handle.signal.aborted) return;
+    handle.complete(nextUrl);
     eventController.setParams(match.params);
     store.setCurrentUrl(nextUrl.href);
     store.setSegmentIds(segments.map((s) => s.id));
@@ -892,9 +929,14 @@ export async function renderRoute(
       // same-structure / fully-prefetched / optimistic hold lanes are not
       // modeled: without transition() the commit stays urgent.
       if (shouldStartViewTransition(segments, gatedOff)) {
-        commitInTransition(store.loaders, emit, segments, { root, metadata }, [
-          "navigation",
-        ]);
+        commitInTransition(
+          store.loaders,
+          emit,
+          segments,
+          { root, metadata },
+          kind,
+          ["navigation"],
+        );
       } else {
         emit({ root, metadata });
       }
@@ -1024,6 +1066,7 @@ export async function renderRoute(
     navigate: (target, navOptions) =>
       navigate(target, {
         loaders: navOptions?.loaders,
+        handles: navOptions?.handles,
         transition: navOptions?.transition,
         history:
           navOptions?.state !== undefined || navOptions?.replace