@rangojs/router 0.0.0-experimental.18 → 0.0.0-experimental.19

package/src/browser/rsc-router.tsx

@@ -11,12 +11,7 @@ import { createEventController } from "./event-controller.js";
 import { createNavigationClient } from "./navigation-client.js";
 import { createServerActionBridge } from "./server-action-bridge.js";
 import { createNavigationBridge } from "./navigation-bridge.js";
-import {
-  NavigationProvider,
-  initHandleDataSync,
-  initSegmentsSync,
-} from "./react/index.js";
-import { initThemeConfigSync } from "../theme/theme-context.js";
+import { NavigationProvider } from "./react/index.js";
 import type {
   RscPayload,
   RscBrowserDependencies,
@@ -27,6 +22,10 @@ import type {
 import type { EventController } from "./event-controller.js";
 import type { ResolvedThemeConfig, Theme } from "../theme/types.js";
 import { initRangoState } from "./rango-state.js";
+import {
+  isInterceptSegment,
+  splitInterceptSegments,
+} from "./intercept-utils.js";
 
 // Vite HMR types are provided by vite/client
 
@@ -169,16 +168,6 @@ export async function initBrowserApp(
     initialLocation: new URL(window.location.href),
   });
 
-  // Initialize segments state BEFORE hydration to avoid mismatch
-  initSegmentsSync(
-    initialPayload.metadata?.matched,
-    initialPayload.metadata?.pathname,
-    initialPayload.metadata?.params,
-  );
-
-  // Initialize theme config for MetaTags (must match SSR state)
-  initThemeConfigSync(effectiveThemeConfig);
-
   // Initialize event controller with segment order (even without handles)
   eventController.setHandleData({}, initialPayload.metadata?.matched);
 
@@ -194,12 +183,11 @@ export async function initBrowserApp(
     for await (const handleData of handlesGenerator) {
       lastHandleData = handleData;
     }
-    // Initialize both event controller AND module-level SSR state for hydration compatibility
+    // Initialize event controller with initial handle state before hydration.
     eventController.setHandleData(
       lastHandleData,
       initialPayload.metadata?.matched,
     );
-    initHandleDataSync(lastHandleData, initialPayload.metadata?.matched);
 
     // Update the initial cache entry with the processed handleData
     // The cache entry was created by createNavigationStore but without handleData
@@ -272,16 +260,19 @@ export async function initBrowserApp(
     import.meta.hot.on("rsc:update", async () => {
       console.log("[RSCRouter] HMR: Server update, refetching RSC");
 
-      const handle = eventController.startNavigation(window.location.href, {
+      using handle = eventController.startNavigation(window.location.href, {
         replace: true,
       });
       const streamingToken = handle.startStreaming();
 
+      const interceptSourceUrl = store.getInterceptSourceUrl();
+
       try {
         const { payload, streamComplete } = await client.fetchPartial({
           targetUrl: window.location.href,
           segmentIds: [],
           previousUrl: store.getSegmentState().currentUrl,
+          interceptSourceUrl: interceptSourceUrl || undefined,
           hmr: true,
         });
 
@@ -289,10 +280,22 @@ export async function initBrowserApp(
           const segments = payload.metadata.segments || [];
           const matched = payload.metadata.matched || [];
 
+          // Derive intercept state from the returned payload, not the
+          // pre-fetch store snapshot. If the HMR edit removed intercept
+          // behavior, the response won't contain intercept segments.
+          const responseIsIntercept = segments.some(isInterceptSegment);
+
+          // Sync store intercept state with what the server returned
+          if (!responseIsIntercept && interceptSourceUrl) {
+            store.setInterceptSourceUrl(null);
+          }
+
           store.setSegmentIds(matched);
           store.setCurrentUrl(window.location.href);
 
-          const historyKey = generateHistoryKey(window.location.href);
+          const historyKey = generateHistoryKey(window.location.href, {
+            intercept: responseIsIntercept,
+          });
           store.setHistoryKey(historyKey);
           const currentHandleData = eventController.getHandleState().data;
           store.cacheSegmentsForHistory(
@@ -301,18 +304,21 @@ export async function initBrowserApp(
             currentHandleData,
           );
 
+          const { main, intercept } = splitInterceptSegments(segments);
           store.emitUpdate({
-            root: renderSegments(segments),
+            root: renderSegments(main, {
+              interceptSegments: intercept.length > 0 ? intercept : undefined,
+            }),
             metadata: payload.metadata,
           });
         }
 
         await streamComplete;
+        handle.complete(new URL(window.location.href));
+        console.log("[RSCRouter] HMR: RSC stream complete");
       } finally {
         streamingToken.end();
       }
-      handle.complete(new URL(window.location.href));
-      console.log("[RSCRouter] HMR: RSC stream complete");
     });
   }
 

package/src/browser/scroll-restoration.ts

@@ -8,6 +8,8 @@
  * - Supports hash link scrolling
  */
 
+import { debugLog } from "./logging.js";
+
 const SCROLL_STORAGE_KEY = "rsc-router-scroll-positions";
 
 /**
@@ -139,12 +141,13 @@ export function initScrollRestoration(options?: {
 
   window.addEventListener("pagehide", handlePageHide);
 
-  console.log(
+  debugLog(
     "[Scroll] Initialized, loaded positions:",
     Object.keys(savedScrollPositions).length,
   );
 
   return () => {
+    cancelScrollRestorationPolling();
     window.removeEventListener("pagehide", handlePageHide);
     window.history.scrollRestoration = "auto";
     initialized = false;
@@ -267,13 +270,13 @@ export function restoreScrollPosition(options?: {
 
   if (canScrollToPosition) {
     window.scrollTo(0, savedY);
-    console.log("[Scroll] Restored position:", savedY, "for key:", key);
+    debugLog("[Scroll] Restored position:", savedY, "for key:", key);
     return true;
   }
 
   // Scroll as far as we can for now
   window.scrollTo(0, maxScrollY);
-  console.log("[Scroll] Partial restore to:", maxScrollY, "target:", savedY);
+  debugLog("[Scroll] Partial restore to:", maxScrollY, "target:", savedY);
 
   // Poll while streaming until we can scroll to target position
   if (options?.retryIfStreaming && options?.isStreaming?.()) {
@@ -282,14 +285,14 @@ export function restoreScrollPosition(options?: {
     pendingPollInterval = setInterval(() => {
       // Stop if we've exceeded the timeout
       if (Date.now() - startTime > SCROLL_POLL_TIMEOUT_MS) {
-        console.log("[Scroll] Polling timeout, giving up");
+        debugLog("[Scroll] Polling timeout, giving up");
         cancelScrollRestorationPolling();
         return;
       }
 
       // Stop if streaming ended
       if (!options.isStreaming?.()) {
-        console.log("[Scroll] Streaming ended, stopping poll");
+        debugLog("[Scroll] Streaming ended, stopping poll");
         cancelScrollRestorationPolling();
         return;
       }
@@ -299,7 +302,7 @@ export function restoreScrollPosition(options?: {
         document.documentElement.scrollHeight - window.innerHeight;
       if (savedY <= currentMaxScrollY) {
         window.scrollTo(0, savedY);
-        console.log("[Scroll] Poll restored position:", savedY);
+        debugLog("[Scroll] Poll restored position:", savedY);
         cancelScrollRestorationPolling();
       }
     }, SCROLL_POLL_INTERVAL_MS);
@@ -322,7 +325,7 @@ export function scrollToHash(): boolean {
     const element = document.getElementById(id);
     if (element) {
       element.scrollIntoView();
-      console.log("[Scroll] Scrolled to hash element:", id);
+      debugLog("[Scroll] Scrolled to hash element:", id);
       return true;
     }
   } catch (e) {

package/src/browser/server-action-bridge.ts

@@ -9,7 +9,6 @@ import {
   reconcileSegments,
   reconcileErrorSegments,
 } from "./segment-reconciler.js";
-import { classifyActionResponse } from "./action-response-classifier.js";
 import { startTransition } from "react";
 import type { EventController } from "./event-controller.js";
 import {
@@ -22,6 +21,14 @@ import {
   isBrowserDebugEnabled,
   startBrowserTransaction,
 } from "./logging.js";
+import { validateRedirectOrigin } from "./validate-redirect-origin.js";
+import {
+  extractRscHeaderUrl,
+  emptyResponse,
+  teeWithCompletion,
+} from "./response-adapter.js";
+import { mergeLocationState } from "./history-state.js";
+import { classifyActionOutcome } from "./action-coordinator.js";
 
 // Polyfill Symbol.dispose/asyncDispose for Safari and older browsers
 if (typeof Symbol.dispose === "undefined") {
@@ -109,7 +116,7 @@ export function createServerActionBridge(
         ...(src ? { intercept: true, interceptSourceUrl: src } : {}),
       }),
       {
-        isAction: true,
+        type: "action" as const,
         ...(src ? { interceptSourceUrl: src } : {}),
       },
     );
@@ -180,6 +187,14 @@ export function createServerActionBridge(
     // Track streaming token - will be set when response arrives
     let streamingToken: { end(): void } | null = null;
 
+    // Use a dedicated abort controller for the fetch so we can cancel network
+    // I/O without disrupting the Flight stream once the response has arrived.
+    // Aborting a response mid-stream causes React's Flight decoder to throw
+    // asynchronous unhandled errors (BodyStreamBuffer was aborted).
+    const fetchAbort = new AbortController();
+    const onHandleAbort = () => fetchAbort.abort();
+    handle.signal.addEventListener("abort", onHandleAbort, { once: true });
+
     // Send action request with stream tracking
     const responsePromise = fetch(url, {
       method: "POST",
@@ -193,25 +208,21 @@ export function createServerActionBridge(
         }),
       },
       body: encodedBody,
+      signal: fetchAbort.signal,
     }).then(async (response) => {
+      // Response arrived — disconnect fetch abort from handle abort so
+      // abortAllActions() doesn't disrupt the in-progress Flight stream.
+      handle.signal.removeEventListener("abort", onHandleAbort);
+
       // Check for version mismatch - server wants us to reload
-      const reloadUrl = response.headers.get("X-RSC-Reload");
-      if (reloadUrl) {
-        // Validate origin to prevent open redirect via crafted headers
-        try {
-          const target = new URL(reloadUrl, window.location.origin);
-          if (target.origin !== window.location.origin) {
-            throw new Error(
-              `X-RSC-Reload blocked: origin mismatch (${target.origin})`,
-            );
-          }
-        } catch (e) {
-          console.error("[rango]", e);
-          return response;
-        }
-        log("version mismatch on action, reloading", { reloadUrl });
-        window.location.href = reloadUrl;
-        // Return a never-resolving promise to prevent further processing
+      const reload = extractRscHeaderUrl(response, "X-RSC-Reload");
+      if (reload === "blocked") {
+        resolveStreamComplete();
+        return emptyResponse();
+      }
+      if (reload) {
+        log("version mismatch on action, reloading", { reloadUrl: reload.url });
+        window.location.href = reload.url;
         return new Promise<Response>(() => {});
       }
 
@@ -219,64 +230,34 @@ export function createServerActionBridge(
       // Short-circuits before createFromFetch — no Flight deserialization needed.
       // Check handle.signal.aborted to avoid redirecting from a stale action
       // when the user has already navigated away.
-      const simpleRedirectUrl = response.headers.get("X-RSC-Redirect");
-      if (simpleRedirectUrl && !handle.signal.aborted) {
-        if (tx) {
-          browserDebugLog(tx, "action simple redirect", {
-            url: simpleRedirectUrl,
-          });
-        }
+      const redirect = extractRscHeaderUrl(response, "X-RSC-Redirect");
+      if (redirect && redirect !== "blocked" && !handle.signal.aborted) {
+        log("action simple redirect", { url: redirect.url });
         handle.complete(undefined);
         if (onNavigate) {
-          await onNavigate(simpleRedirectUrl, {
+          await onNavigate(redirect.url, {
             replace: true,
             _skipCache: true,
           });
         } else {
-          window.location.href = simpleRedirectUrl;
+          window.location.href = redirect.url;
         }
         return new Promise<Response>(() => {});
       }
+      if (redirect === "blocked") {
+        resolveStreamComplete();
+        return emptyResponse();
+      }
 
       // Start streaming immediately when response arrives
       if (!handle.signal.aborted) {
         streamingToken = handle.startStreaming();
       }
 
-      if (!response.body) {
-        // No body means stream is already complete
+      return teeWithCompletion(response, () => {
+        log("stream complete");
         streamingToken?.end();
         resolveStreamComplete();
-        return response;
-      }
-
-      // Tee the stream: one for RSC runtime, one for tracking completion
-      const [rscStream, trackingStream] = response.body.tee();
-
-      // Consume the tracking stream to detect when it closes
-      (async () => {
-        const reader = trackingStream.getReader();
-        try {
-          while (true) {
-            const { done } = await reader.read();
-            if (done) break;
-          }
-        } finally {
-          reader.releaseLock();
-          log("stream complete");
-          streamingToken?.end();
-          resolveStreamComplete();
-        }
-      })().catch((error) => {
-        console.error("[STREAMING] Error reading tracking stream:", error);
-        streamingToken?.end();
-      });
-
-      // Return response with the RSC stream
-      return new Response(rscStream, {
-        headers: response.headers,
-        status: response.status,
-        statusText: response.statusText,
       });
     });
 
@@ -294,6 +275,15 @@ export function createServerActionBridge(
       // resolveStreamComplete is assigned in the Promise constructor so it's safe to call
       resolveStreamComplete!();
 
+      // Silently swallow abort errors — the action was intentionally cancelled
+      // (e.g., user navigated away or abortAllActions was called).
+      // Return undefined instead of throwing to avoid surfacing as a page error.
+      // Check both DOMException AbortError and stream-level abort messages
+      // (BodyStreamBuffer was aborted) that propagate from the aborted fetch.
+      if (handle.signal.aborted) {
+        return undefined;
+      }
+
       // Convert network-level errors to NetworkError for proper handling
       const networkError = toNetworkError(error, {
         url: url.toString(),
@@ -314,6 +304,14 @@ export function createServerActionBridge(
       diffCount: payload.metadata?.diff?.length ?? 0,
     });
 
+    // Guard: if the action was aborted while streaming (e.g., user navigated
+    // away or abortAllActions fired), bail out before any reconcile/render/cache
+    // writes to avoid overwriting the current UI with stale action results.
+    if (handle.signal.aborted) {
+      log("action aborted after response, skipping reconciliation");
+      return undefined;
+    }
+
     // Process response
     const { metadata, returnValue } = payload;
 
@@ -322,9 +320,17 @@ export function createServerActionBridge(
     // Check handle.signal.aborted to avoid redirecting from a stale action
     // when the user has already navigated away.
     if (metadata?.redirect && !handle.signal.aborted) {
-      const { url: redirectUrl } = metadata.redirect;
+      const redirectUrl = validateRedirectOrigin(
+        metadata.redirect.url,
+        window.location.origin,
+      );
+      if (!redirectUrl) {
+        log("blocked action redirect payload", { url: metadata.redirect.url });
+        handle.complete(returnValue?.data);
+        return returnValue?.data;
+      }
       const redirectState = metadata.locationState;
-      console.log(`[Browser] Action redirect to ${redirectUrl}`);
+      log("action redirect", { url: redirectUrl });
       handle.complete(returnValue?.data);
       if (onNavigate) {
         await onNavigate(redirectUrl, {
@@ -338,6 +344,15 @@ export function createServerActionBridge(
       return returnValue?.data;
     }
 
+    // Bail out if the action was aborted after deserialization (e.g. user
+    // navigated away or abortAllActions was called while the Flight stream
+    // was being consumed). Without this check the code below would mutate
+    // the store / UI for a stale action.
+    if (handle.signal.aborted) {
+      log("action aborted after deserialization, skipping mutations");
+      return returnValue?.data;
+    }
+
     const { matched, diff, segments, isPartial, isError } = metadata || {};
 
     // Log action result
@@ -349,6 +364,12 @@ export function createServerActionBridge(
     if (isError && isPartial && segments && diff) {
       log("processing error boundary response");
 
+      // Fail current handle BEFORE aborting all actions so the event controller
+      // records the error state (abortAllActions clears inflight entries)
+      if (returnValue && !returnValue.ok) {
+        handle.fail(returnValue.data);
+      }
+
       // Abort all other pending action requests - error takes precedence
       // This prevents other actions from completing and overwriting the error UI
       eventController.abortAllActions();
@@ -373,6 +394,26 @@ export function createServerActionBridge(
             : undefined,
       });
 
+      // Re-check route stability after async renderSegments — user may have
+      // navigated away while the error tree was being prepared.
+      if (window.location.pathname !== actionStartPathname) {
+        log("user navigated during error render, skipping");
+        if (returnValue && !returnValue.ok) {
+          throw returnValue.data;
+        }
+        handle.complete(undefined);
+        return undefined;
+      }
+      const currentKeyNow = store.getHistoryKey();
+      if (currentKeyNow !== currentKey) {
+        log("history key changed during error render, skipping cache update");
+        if (returnValue && !returnValue.ok) {
+          throw returnValue.data;
+        }
+        handle.complete(undefined);
+        return undefined;
+      }
+
       // Update UI with error boundary
       startTransition(() => {
         onUpdate({ root: errorTree, metadata: metadata! });
@@ -395,7 +436,6 @@ export function createServerActionBridge(
 
       // Throw the error so the action promise rejects
       if (returnValue && !returnValue.ok) {
-        handle.fail(returnValue.data);
         throw returnValue.data;
       }
 
@@ -405,9 +445,13 @@ export function createServerActionBridge(
     }
 
     if (!isPartial) {
-      // Full update not supported for actions
+      // Protocol invariant: action revalidation responses MUST be partial.
+      // The server always sends isPartial: true for successful revalidation
+      // and isPartial: true + isError: true for error boundary responses.
+      // A non-partial payload here indicates a server-side bug.
       throw new Error(
-        `[Browser] Full update after action is not supported yet`,
+        `[Browser] Action response missing isPartial — the server must ` +
+          `always send partial payloads for action revalidation.`,
       );
     }
 
@@ -449,20 +493,17 @@ export function createServerActionBridge(
     }
 
     // Classify the post-reconciliation scenario
-    const consolidationSegments = handle.getConsolidationSegments();
-    const otherFetchingActions = [
-      ...eventController.getInflightActions().values(),
-    ].filter((a) => a.phase === "fetching" && a.id !== handle.id);
-
-    const scenario = classifyActionResponse({
+    const scenario = classifyActionOutcome({
+      handleId: handle.id,
+      inflightActions: eventController.getInflightActions(),
+      hadAnyConcurrentActions: eventController.hadAnyConcurrentActions(),
+      revalidatedSegments: handle.getRevalidatedSegments(),
       actionStartPathname,
       currentPathname: window.location.pathname,
       actionStartLocationKey: locationKey,
       currentLocationKey: window.history.state?.key,
       reconciledSegmentCount: fullSegments.length,
       matchedCount: matched.length,
-      consolidationSegments: consolidationSegments || null,
-      otherFetchingActionCount: otherFetchingActions.length,
       currentInterceptSource: store.getInterceptSourceUrl(),
     });
 
@@ -572,19 +613,7 @@ export function createServerActionBridge(
         // Apply server-set location state to history.state (non-redirect flow)
         const actionLocationState = metadata?.locationState;
         if (actionLocationState) {
-          const merged = {
-            ...window.history.state,
-            ...actionLocationState,
-          };
-          window.history.replaceState(merged, "", window.location.href);
-          // Notify useLocationState hooks so they re-read from history.state
-          if (
-            Object.keys(actionLocationState).some((k) =>
-              k.startsWith("__rsc_ls_"),
-            )
-          ) {
-            window.dispatchEvent(new Event("__rsc_locationstate"));
-          }
+          mergeLocationState(actionLocationState);
         }
 
         // Update store state
@@ -616,16 +645,6 @@ export function createServerActionBridge(
       deps.setServerCallback(handleServerAction);
       isRegistered = true;
     },
-
-    /**
-     * Unregister the server action callback
-     */
-    unregister(): void {
-      if (!isRegistered) {
-        return;
-      }
-      isRegistered = false;
-    },
   };
 }
 

package/src/browser/types.ts

@@ -121,7 +121,7 @@ export interface NavigationState {
   /** Whether RSC data is currently streaming (initial load or navigation) */
   isStreaming: boolean;
 
-  /** Current location (updated optimistically) */
+  /** Current location */
   location: NavigationLocation;
 
   /** URL being navigated to (null when idle) */
@@ -402,35 +402,6 @@ export interface NavigationStore {
   ): () => void;
 }
 
-// ============================================================================
-// Request Controller Types
-// ============================================================================
-
-/**
- * Disposable abort controller with automatic cleanup
- */
-export interface DisposableAbortController extends Disposable {
-  controller: AbortController;
-}
-
-/**
- * Request controller for managing concurrent requests
- *
- * Separates navigation requests (aborted on new navigation) from
- * action requests (complete independently of navigation).
- */
-export interface RequestController {
-  create(): AbortController;
-  createDisposable(): DisposableAbortController;
-  /** Create a disposable controller for actions (not aborted by navigation) */
-  createActionDisposable(): DisposableAbortController;
-  /** Abort all navigation requests (not actions) */
-  abortAll(): void;
-  /** Abort all action requests (used for error handling) */
-  abortAllActions(): void;
-  remove(controller: AbortController): void;
-}
-
 // ============================================================================
 // Navigation Client Types
 // ============================================================================
@@ -488,7 +459,6 @@ export interface LinkInterceptorOptions {
  */
 export interface ServerActionBridge {
   register(): void;
-  unregister(): void;
 }
 
 /**

package/src/browser/validate-redirect-origin.ts

@@ -0,0 +1,29 @@
+/**
+ * Validate that a client-consumed redirect URL (from headers or Flight payload)
+ * targets the same origin as the current page. Prevents open-redirect attacks
+ * via crafted responses.
+ *
+ * @returns The canonical (normalized) URL string on success, or null if blocked.
+ */
+export function validateRedirectOrigin(
+  url: string,
+  currentOrigin: string,
+): string | null {
+  try {
+    const target = new URL(url, currentOrigin);
+    if (target.origin !== currentOrigin) {
+      console.error(
+        `[rango] Redirect blocked: origin mismatch (${target.origin})`,
+      );
+      return null;
+    }
+    // Return pathname+search+hash for relative inputs, full href for absolute.
+    // This normalizes protocol-relative and other ambiguous forms.
+    return target.href.startsWith(currentOrigin)
+      ? target.href
+      : target.pathname + target.search + target.hash;
+  } catch {
+    console.error(`[rango] Redirect blocked: invalid URL "${url}"`);
+    return null;
+  }
+}

package/src/build/generate-manifest.ts

@@ -200,6 +200,11 @@ function buildPrefixTreeNode(
     }
   }
 
+  // Remove from visited so sibling branches can reuse the same patterns
+  // without false circular-include detection. Only ancestors in the current
+  // recursion path should trigger the cycle guard.
+  visited.delete(patterns);
+
   return {
     staticPrefix: extractStaticPrefix(urlPrefix),
     fullPrefix: urlPrefix,

package/src/build/generate-route-types.ts

@@ -27,6 +27,8 @@ export {
   extractUrlsVariableFromRouter,
   buildCombinedRouteMapForRouterFile,
   detectUnresolvableIncludes,
+  detectUnresolvableIncludesForUrlsFile,
   findRouterFiles,
   writeCombinedRouteTypes,
 } from "./route-types/router-processing.js";
+export { findUrlsVariableNames } from "./route-types/per-module-writer.js";