react-router 0.0.0-experimental-73e447577 → 0.0.0-experimental-e613d4238

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # `react-router`
 
+## 7.9.3
+
+### Patch Changes
+
+- Do not try to use `turbo-stream` to decode CDN errors that never reached the server ([#14385](https://github.com/remix-run/react-router/pull/14385))
+  - We used to do this but lost this check with the adoption of single fetch
+
+- Fix Data Mode regression causing a 404 during initial load in when `middleware` exists without any `loader` functions ([#14393](https://github.com/remix-run/react-router/pull/14393))
+
+## 7.9.2
+
+### Patch Changes
+
+- - Update client-side router to run client `middleware` on initial load even if no loaders exist ([#14348](https://github.com/remix-run/react-router/pull/14348))
+  - Update `createRoutesStub` to run route middleware
+    - You will need to set the `<RoutesStub future={{ v8_middleware: true }} />` flag to enable the proper `context` type
+
+- Update Lazy Route Discovery manifest requests to use a singular comma-separated `paths` query param instead of repeated `p` query params ([#14321](https://github.com/remix-run/react-router/pull/14321))
+  - This is because Cloudflare has a hard limit of 100 URL search param key/value pairs when used as a key for caching purposes
+  - If more that 100 paths were included, the cache key would be incomplete and could produce false-positive cache hits
+
+- \[UNSTABLE] Add `fetcher.unstable_reset()` API ([#14206](https://github.com/remix-run/react-router/pull/14206))
+
+- Made useOutlet element reference have stable identity in-between route chages ([#13382](https://github.com/remix-run/react-router/pull/13382))
+
+- feat: enable full transition support for the rsc router ([#14362](https://github.com/remix-run/react-router/pull/14362))
+
+- In RSC Data Mode, handle SSR'd client errors and re-try in the browser ([#14342](https://github.com/remix-run/react-router/pull/14342))
+
+- Support `middleware` prop on `<Route>` for usage with a data router via `createRoutesFromElements` ([#14357](https://github.com/remix-run/react-router/pull/14357))
+
+- Handle encoded question mark and hash characters in ancestor splat routes ([#14249](https://github.com/remix-run/react-router/pull/14249))
+
+- Fail gracefully on manifest version mismatch logic if `sessionStorage` access is blocked ([#14335](https://github.com/remix-run/react-router/pull/14335))
+
 ## 7.9.1
 
 ### Patch Changes

package/dist/development/{chunk-NKIXC2FA.mjs → chunk-2YVPYFDJ.mjs}

@@ -1,5 +1,5 @@
 /**
- * react-router v0.0.0-experimental-73e447577
+ * react-router v0.0.0-experimental-e613d4238
  *
  * Copyright (c) Remix Software Inc.
  *
@@ -22,6 +22,7 @@ import {
   SingleFetchRedirectSymbol,
   StaticRouterProvider,
   StreamTransfer,
+  UNSTABLE_TransitionEnabledRouterProvider,
   convertRoutesToDataRoutes,
   createBrowserHistory,
   createContext,
@@ -37,7 +38,6 @@ import {
   getManifestPath,
   getSingleFetchDataStrategyImpl,
   getStaticContextFromError,
-  instrumentHandler,
   invariant,
   isDataWithResponseInit,
   isMutationMethod,
@@ -60,7 +60,7 @@ import {
   withComponentProps,
   withErrorBoundaryProps,
   withHydrateFallbackProps
-} from "./chunk-PF7FO4KS.mjs";
+} from "./chunk-5P3HEZQU.mjs";
 
 // lib/dom/ssr/server.tsx
 import * as React from "react";
@@ -517,8 +517,7 @@ async function callRouteHandler(handler, args) {
   let result = await handler({
     request: stripRoutesParam(stripIndexParam2(args.request)),
     params: args.params,
-    context: args.context,
-    pattern: args.pattern
+    context: args.context
   });
   if (isDataWithResponseInit(result) && result.init && result.init.status && isRedirectStatusCode(result.init.status)) {
     throw new Response(null, result.init);
@@ -1011,8 +1010,7 @@ function derive(build, mode) {
   let dataRoutes = createStaticHandlerDataRoutes(build.routes, build.future);
   let serverMode = isServerMode(mode) ? mode : "production" /* Production */;
   let staticHandler = createStaticHandler(dataRoutes, {
-    basename: build.basename,
-    unstable_instrumentations: build.entry.module.unstable_instrumentations
+    basename: build.basename
   });
   let errorHandler = build.entry.module.handleError || ((error, { request }) => {
     if (serverMode !== "test" /* Test */ && !request.signal.aborted) {
@@ -1022,7 +1020,35 @@ function derive(build, mode) {
       );
     }
   });
-  let requestHandler = async (request, initialContext) => {
+  return {
+    routes,
+    dataRoutes,
+    serverMode,
+    staticHandler,
+    errorHandler
+  };
+}
+var createRequestHandler = (build, mode) => {
+  let _build;
+  let routes;
+  let serverMode;
+  let staticHandler;
+  let errorHandler;
+  return async function requestHandler(request, initialContext) {
+    _build = typeof build === "function" ? await build() : build;
+    if (typeof build === "function") {
+      let derived = derive(_build, mode);
+      routes = derived.routes;
+      serverMode = derived.serverMode;
+      staticHandler = derived.staticHandler;
+      errorHandler = derived.errorHandler;
+    } else if (!routes || !serverMode || !staticHandler || !errorHandler) {
+      let derived = derive(_build, mode);
+      routes = derived.routes;
+      serverMode = derived.serverMode;
+      staticHandler = derived.staticHandler;
+      errorHandler = derived.errorHandler;
+    }
     let params = {};
     let loadContext;
     let handleError = (error) => {
@@ -1035,7 +1061,7 @@ function derive(build, mode) {
         request
       });
     };
-    if (build.future.v8_middleware) {
+    if (_build.future.v8_middleware) {
       if (initialContext && !(initialContext instanceof RouterContextProvider)) {
         let error = new Error(
           "Invalid `context` value provided to `handleRequest`. When middleware is enabled you must return an instance of `RouterContextProvider` from your `getLoadContext` function."
@@ -1048,7 +1074,7 @@ function derive(build, mode) {
       loadContext = initialContext || {};
     }
     let url = new URL(request.url);
-    let normalizedBasename = build.basename || "/";
+    let normalizedBasename = _build.basename || "/";
     let normalizedPath = url.pathname;
     if (stripBasename(normalizedPath, normalizedBasename) === "/_root.data") {
       normalizedPath = normalizedBasename;
@@ -1059,7 +1085,7 @@ function derive(build, mode) {
       normalizedPath = normalizedPath.slice(0, -1);
     }
     let isSpaMode = getBuildTimeHeader(request, "X-React-Router-SPA-Mode") === "yes";
-    if (!build.ssr) {
+    if (!_build.ssr) {
       let decodedPath = decodeURI(normalizedPath);
       if (normalizedBasename !== "/") {
         let strippedPath = stripBasename(decodedPath, normalizedBasename);
@@ -1083,9 +1109,9 @@ function derive(build, mode) {
         }
         decodedPath = strippedPath;
       }
-      if (build.prerender.length === 0) {
+      if (_build.prerender.length === 0) {
         isSpaMode = true;
-      } else if (!build.prerender.includes(decodedPath) && !build.prerender.includes(decodedPath + "/")) {
+      } else if (!_build.prerender.includes(decodedPath) && !_build.prerender.includes(decodedPath + "/")) {
         if (url.pathname.endsWith(".data")) {
           errorHandler(
             new ErrorResponseImpl(
@@ -1109,19 +1135,19 @@ function derive(build, mode) {
       }
     }
     let manifestUrl = getManifestPath(
-      build.routeDiscovery.manifestPath,
+      _build.routeDiscovery.manifestPath,
       normalizedBasename
     );
     if (url.pathname === manifestUrl) {
       try {
-        let res = await handleManifestRequest(build, routes, url);
+        let res = await handleManifestRequest(_build, routes, url);
         return res;
       } catch (e) {
         handleError(e);
         return new Response("Unknown Server Error", { status: 500 });
       }
     }
-    let matches = matchServerRoutes(routes, normalizedPath, build.basename);
+    let matches = matchServerRoutes(routes, normalizedPath, _build.basename);
     if (matches && matches.length > 0) {
       Object.assign(params, matches[0].params);
     }
@@ -1132,11 +1158,11 @@ function derive(build, mode) {
       let singleFetchMatches = matchServerRoutes(
         routes,
         handlerUrl.pathname,
-        build.basename
+        _build.basename
       );
       response = await handleSingleFetchRequest(
         serverMode,
-        build,
+        _build,
         staticHandler,
         request,
         handlerUrl,
@@ -1147,12 +1173,12 @@ function derive(build, mode) {
         response = generateSingleFetchRedirectResponse(
           response,
           request,
-          build,
+          _build,
           serverMode
         );
       }
-      if (build.entry.module.handleDataRequest) {
-        response = await build.entry.module.handleDataRequest(response, {
+      if (_build.entry.module.handleDataRequest) {
+        response = await _build.entry.module.handleDataRequest(response, {
           context: loadContext,
           params: singleFetchMatches ? singleFetchMatches[0].params : {},
           request
@@ -1161,7 +1187,7 @@ function derive(build, mode) {
           response = generateSingleFetchRedirectResponse(
             response,
             request,
-            build,
+            _build,
             serverMode
           );
         }
@@ -1169,7 +1195,7 @@ function derive(build, mode) {
     } else if (!isSpaMode && matches && matches[matches.length - 1].route.module.default == null && matches[matches.length - 1].route.module.ErrorBoundary == null) {
       response = await handleResourceRequest(
         serverMode,
-        build,
+        _build,
         staticHandler,
         matches.slice(-1)[0].route.id,
         request,
@@ -1179,14 +1205,14 @@ function derive(build, mode) {
     } else {
       let { pathname } = url;
       let criticalCss = void 0;
-      if (build.unstable_getCriticalCss) {
-        criticalCss = await build.unstable_getCriticalCss({ pathname });
+      if (_build.unstable_getCriticalCss) {
+        criticalCss = await _build.unstable_getCriticalCss({ pathname });
       } else if (mode === "development" /* Development */ && getDevServerHooks()?.getCriticalCss) {
         criticalCss = await getDevServerHooks()?.getCriticalCss?.(pathname);
       }
       response = await handleDocumentRequest(
         serverMode,
-        build,
+        _build,
         staticHandler,
         request,
         loadContext,
@@ -1204,47 +1230,6 @@ function derive(build, mode) {
     }
     return response;
   };
-  if (build.entry.module.unstable_instrumentations) {
-    requestHandler = instrumentHandler(
-      requestHandler,
-      build.entry.module.unstable_instrumentations.map((i) => i.handler).filter(Boolean)
-    );
-  }
-  return {
-    routes,
-    dataRoutes,
-    serverMode,
-    staticHandler,
-    errorHandler,
-    requestHandler
-  };
-}
-var createRequestHandler = (build, mode) => {
-  let _build;
-  let routes;
-  let serverMode;
-  let staticHandler;
-  let errorHandler;
-  let _requestHandler;
-  return async function requestHandler(request, initialContext) {
-    _build = typeof build === "function" ? await build() : build;
-    if (typeof build === "function") {
-      let derived = derive(_build, mode);
-      routes = derived.routes;
-      serverMode = derived.serverMode;
-      staticHandler = derived.staticHandler;
-      errorHandler = derived.errorHandler;
-      _requestHandler = derived.requestHandler;
-    } else if (!routes || !serverMode || !staticHandler || !errorHandler || !_requestHandler) {
-      let derived = derive(_build, mode);
-      routes = derived.routes;
-      serverMode = derived.serverMode;
-      staticHandler = derived.staticHandler;
-      errorHandler = derived.errorHandler;
-      _requestHandler = derived.requestHandler;
-    }
-    return _requestHandler(request, initialContext);
-  };
 };
 async function handleManifestRequest(build, routes, url) {
   if (build.assets.version !== url.searchParams.get("version")) {
@@ -1474,7 +1459,6 @@ async function handleResourceRequest(serverMode, build, staticHandler, routeId,
   }
   function handleQueryRouteError(error) {
     if (isResponse(error)) {
-      error.headers.set("X-Remix-Catch", "yes");
       return error;
     }
     if (isRouteErrorResponse(error)) {
@@ -1501,10 +1485,7 @@ function errorResponseToJson(errorResponse, serverMode) {
     ),
     {
       status: errorResponse.status,
-      statusText: errorResponse.statusText,
-      headers: {
-        "X-Remix-Error": "yes"
-      }
+      statusText: errorResponse.statusText
     }
   );
 }
@@ -1872,7 +1853,7 @@ function createCallServer({
   return async (id, args) => {
     let actionId = globalVar.__routerActionID = (globalVar.__routerActionID ?? (globalVar.__routerActionID = 0)) + 1;
     const temporaryReferences = createTemporaryReferenceSet();
-    const response = await fetchImplementation(
+    const payloadPromise = fetchImplementation(
       new Request(location.href, {
         body: await encodeReply(args, { temporaryReferences }),
         method: "POST",
@@ -1881,44 +1862,45 @@ function createCallServer({
           "rsc-action-id": id
         }
       })
-    );
-    if (!response.body) {
-      throw new Error("No response body");
-    }
-    const payload = await createFromReadableStream(response.body, {
-      temporaryReferences
-    });
-    if (payload.type === "redirect") {
-      if (payload.reload) {
-        window.location.href = payload.location;
-        return;
+    ).then((response) => {
+      if (!response.body) {
+        throw new Error("No response body");
       }
-      globalVar.__reactRouterDataRouter.navigate(payload.location, {
-        replace: payload.replace
+      return createFromReadableStream(response.body, {
+        temporaryReferences
       });
-      return payload.actionResult;
-    }
-    if (payload.type !== "action") {
-      throw new Error("Unexpected payload type");
-    }
-    if (payload.rerender) {
-      React4.startTransition(
-        // @ts-expect-error - We have old react types that don't know this can be async
-        async () => {
-          const rerender = await payload.rerender;
-          if (!rerender) return;
-          if (landedActionId < actionId && globalVar.__routerActionID <= actionId) {
-            landedActionId = actionId;
-            if (rerender.type === "redirect") {
-              if (rerender.reload) {
-                window.location.href = rerender.location;
-                return;
-              }
+    });
+    globalVar.__reactRouterDataRouter.__setPendingRerender(
+      Promise.resolve(payloadPromise).then(async (payload) => {
+        if (payload.type === "redirect") {
+          if (payload.reload || isExternalLocation(payload.location)) {
+            window.location.href = payload.location;
+            return () => {
+            };
+          }
+          return () => {
+            globalVar.__reactRouterDataRouter.navigate(payload.location, {
+              replace: payload.replace
+            });
+          };
+        }
+        if (payload.type !== "action") {
+          throw new Error("Unexpected payload type");
+        }
+        const rerender = await payload.rerender;
+        if (rerender && landedActionId < actionId && globalVar.__routerActionID <= actionId) {
+          if (rerender.type === "redirect") {
+            if (rerender.reload || isExternalLocation(rerender.location)) {
+              window.location.href = rerender.location;
+              return;
+            }
+            return () => {
               globalVar.__reactRouterDataRouter.navigate(rerender.location, {
                 replace: rerender.replace
               });
-              return;
-            }
+            };
+          }
+          return () => {
             let lastMatch;
             for (const match of rerender.matches) {
               globalVar.__reactRouterDataRouter.patchRoutes(
@@ -1929,29 +1911,32 @@ function createCallServer({
               lastMatch = match;
             }
             window.__reactRouterDataRouter._internalSetStateDoNotUseOrYouWillBreakYourApp(
-              {}
+              {
+                loaderData: Object.assign(
+                  {},
+                  globalVar.__reactRouterDataRouter.state.loaderData,
+                  rerender.loaderData
+                ),
+                errors: rerender.errors ? Object.assign(
+                  {},
+                  globalVar.__reactRouterDataRouter.state.errors,
+                  rerender.errors
+                ) : null
+              }
             );
-            React4.startTransition(() => {
-              window.__reactRouterDataRouter._internalSetStateDoNotUseOrYouWillBreakYourApp(
-                {
-                  loaderData: Object.assign(
-                    {},
-                    globalVar.__reactRouterDataRouter.state.loaderData,
-                    rerender.loaderData
-                  ),
-                  errors: rerender.errors ? Object.assign(
-                    {},
-                    globalVar.__reactRouterDataRouter.state.errors,
-                    rerender.errors
-                  ) : null
-                }
-              );
-            });
-          }
+          };
         }
-      );
-    }
-    return payload.actionResult;
+        return () => {
+        };
+      }).catch(() => {
+      })
+    );
+    return payloadPromise.then((payload) => {
+      if (payload.type !== "action" && payload.type !== "redirect") {
+        throw new Error("Unexpected payload type");
+      }
+      return payload.actionResult;
+    });
   };
 }
 function createRouterFromPayload({
@@ -2171,8 +2156,8 @@ function getFetchAndDecodeViaRSC(createFromReadableStream, fetchImplementation)
     let res = await fetchImplementation(
       new Request(url, await createRequestInit(request))
     );
-    if (res.status === 404 && !res.headers.has("X-Remix-Response")) {
-      throw new ErrorResponseImpl(404, "Not Found", true);
+    if (res.status >= 400 && !res.headers.has("X-Remix-Response")) {
+      throw new ErrorResponseImpl(res.status, res.statusText, await res.text());
     }
     invariant(res.body, "No response body to decode");
     try {
@@ -2318,7 +2303,7 @@ function RSCHydratedRouter({
     routeDiscovery: { mode: "lazy", manifestPath: "/__manifest" },
     routeModules
   };
-  return /* @__PURE__ */ React4.createElement(RSCRouterContext.Provider, { value: true }, /* @__PURE__ */ React4.createElement(RSCRouterGlobalErrorBoundary, { location: location2 }, /* @__PURE__ */ React4.createElement(FrameworkContext.Provider, { value: frameworkContext }, /* @__PURE__ */ React4.createElement(RouterProvider, { router, flushSync: ReactDOM.flushSync }))));
+  return /* @__PURE__ */ React4.createElement(RSCRouterContext.Provider, { value: true }, /* @__PURE__ */ React4.createElement(RSCRouterGlobalErrorBoundary, { location: location2 }, /* @__PURE__ */ React4.createElement(FrameworkContext.Provider, { value: frameworkContext }, /* @__PURE__ */ React4.createElement(UNSTABLE_TransitionEnabledRouterProvider, { router, flushSync: ReactDOM.flushSync }))));
 }
 function createRouteFromServerManifest(match, payload) {
   let hasInitialData = payload && match.id in payload.loaderData;
@@ -2475,6 +2460,10 @@ function debounce(callback, wait) {
     timeoutId = window.setTimeout(() => callback(...args), wait);
   };
 }
+function isExternalLocation(location2) {
+  const newLocation = new URL(location2, window.location.href);
+  return newLocation.origin !== window.location.origin;
+}
 
 // lib/rsc/server.ssr.tsx
 import * as React5 from "react";
@@ -2660,7 +2649,7 @@ async function routeRSCServerRequest({
       headers2.delete("Content-Encoding");
       headers2.delete("Content-Length");
       headers2.delete("Content-Type");
-      headers2.delete("x-remix-response");
+      headers2.delete("X-Remix-Response");
       headers2.set("Location", payload.location);
       return new Response(serverResponseB?.body || "", {
         headers: headers2,