Merge branch 'dev' into markdalgleish/rsc-framework-mode

Author: markdalgleish

.changeset/chilly-needles-taste.md

@@ -0,0 +1,8 @@
+---
+"react-router": patch
+---
+
+Update Lazy Route Discovery manifest requests to use a singular comma-separated `paths` query param instead of repeated `p` query params
+
+- 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

.changeset/honest-bears-pull.md

@@ -0,0 +1,5 @@
+---
+"react-router": patch
+---
+
+Made useOutlet element reference have stable identity in-between route chages

.changeset/silent-emus-grow.md

@@ -0,0 +1,5 @@
+---
+"react-router": patch
+---
+
+In RSC Data Mode, handle SSR'd client errors and re-try in the browser

.changeset/sour-crews-destroy.md

@@ -0,0 +1,5 @@
+---
+"@react-router/dev": patch
+---
+
+Switch internal vite plugin Response logic to use `@remix-run/node-fetch-server`

.changeset/yellow-ears-begin.md

@@ -0,0 +1,5 @@
+---
+"react-router": patch
+---
+
+Fail gracefully on manifest version mismatch logic if `sessionStorage` access is blocked

contributors.yml

@@ -189,6 +189,7 @@
 - johnpangalos
 - jonkoops
 - joseph0926
+- jplhomer
 - jrakotoharisoa
 - jrestall
 - juanpprieto
@@ -239,6 +240,7 @@
 - m-shojaei
 - machour
 - majamarijan
+- Malien
 - Manc
 - manzano78
 - marc2332

docs/api/rsc/RSCStaticRouter.md

@@ -46,13 +46,13 @@ routeRSCServerRequest({
   fetchServer,
   createFromReadableStream,
   async renderHTML(getPayload) {
-    const payload = await getPayload();
+    const payload = getPayload();
 
     return await renderHTMLToReadableStream(
       <RSCStaticRouter getPayload={getPayload} />,
       {
         bootstrapScriptContent,
-        formState: await getFormState(payload),
+        formState: await payload.formState,
       }
     );
   },

docs/api/rsc/routeRSCServerRequest.md

@@ -48,13 +48,13 @@ routeRSCServerRequest({
   fetchServer,
   createFromReadableStream,
   async renderHTML(getPayload) {
-    const payload = await getPayload();
+    const payload = getPayload();
 
     return await renderHTMLToReadableStream(
       <RSCStaticRouter getPayload={getPayload} />,
       {
         bootstrapScriptContent,
-        formState: await getFormState(payload),
+        formState: await payload.formState,
       }
     );
   },
@@ -75,7 +75,7 @@ async function routeRSCServerRequest({
   fetchServer: (request: Request) => Promise<Response>;
   createFromReadableStream: SSRCreateFromReadableStreamFunction;
   renderHTML: (
-    getPayload: () => Promise<RSCPayload>,
+    getPayload: () => DecodedPayload,
   ) => ReadableStream<Uint8Array> | Promise<ReadableStream<Uint8Array>>;
   hydrate?: boolean;
 }): Promise<Response>

docs/how-to/react-server-components.md

@@ -644,17 +644,13 @@ export async function generateHTML(
     createFromReadableStream,
     // Render the router to HTML.
     async renderHTML(getPayload) {
-      const payload = await getPayload();
-      const formState =
-        payload.type === "render"
-          ? await payload.formState
-          : undefined;
+      const payload = getPayload();
 
       return await renderHTMLToReadableStream(
         <RSCStaticRouter getPayload={getPayload} />,
         {
           bootstrapScriptContent,
-          formState,
+          formState: await payload.formState,
         },
       );
     },
@@ -877,11 +873,7 @@ export async function generateHTML(
     createFromReadableStream,
     // Render the router to HTML.
     async renderHTML(getPayload) {
-      const payload = await getPayload();
-      const formState =
-        payload.type === "render"
-          ? await payload.formState
-          : undefined;
+      const payload = getPayload();
 
       const bootstrapScriptContent =
         await import.meta.viteRsc.loadBootstrapScriptContent(
@@ -892,7 +884,7 @@ export async function generateHTML(
         <RSCStaticRouter getPayload={getPayload} />,
         {
           bootstrapScriptContent,
-          formState,
+          formState: payload.formState,
         },
       );
     },

integration/fog-of-war-test.ts

@@ -715,7 +715,7 @@ test.describe("Fog of War", () => {
     expect(await app.getHtml("#parent")).toMatch(`Parent`);
     expect(await app.getHtml("#child2")).toMatch(`Child 2`);
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fparent%2Fchild2&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fparent%2Fchild2&version=/),
     ]);
   });
 
@@ -783,7 +783,7 @@ test.describe("Fog of War", () => {
       ),
     ).toEqual(["root", "routes/_index", "routes/$slug"]);
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fsomething&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fsomething&version=/),
     ]);
     manifestRequests = [];
 
@@ -797,7 +797,7 @@ test.describe("Fog of War", () => {
     await page.waitForSelector("#static");
     expect(await app.getHtml("#static")).toMatch("Static");
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fstatic&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fstatic&version=/),
     ]);
     expect(
       await page.evaluate(() =>
@@ -870,7 +870,7 @@ test.describe("Fog of War", () => {
       ),
     ).toEqual(["root", "routes/_index", "routes/$"]);
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fsomething&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fsomething&version=/),
     ]);
     manifestRequests = [];
 
@@ -884,7 +884,7 @@ test.describe("Fog of War", () => {
     await page.waitForSelector("#static");
     expect(await app.getHtml("#static")).toMatch("Static");
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fstatic&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fstatic&version=/),
     ]);
     expect(
       await page.evaluate(() =>
@@ -956,7 +956,7 @@ test.describe("Fog of War", () => {
     await page.waitForSelector("#slug");
     expect(await app.getHtml("#slug")).toMatch("Slug: a");
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fa&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fa&version=/),
     ]);
     manifestRequests = [];
 
@@ -977,7 +977,7 @@ test.describe("Fog of War", () => {
     await page.waitForSelector("#slug");
     expect(await app.getHtml("#slug")).toMatch("Slug: b");
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fb&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fb&version=/),
     ]);
   });
 
@@ -1044,7 +1044,7 @@ test.describe("Fog of War", () => {
     await page.waitForSelector("#splat");
     expect(await app.getHtml("#splat")).toMatch("Splat: a");
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fa&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fa&version=/),
     ]);
     manifestRequests = [];
 
@@ -1065,7 +1065,7 @@ test.describe("Fog of War", () => {
     await page.waitForSelector("#splat");
     expect(await app.getHtml("#splat")).toMatch("Splat: b/c");
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fb%2Fc&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fb%2Fc&version=/),
     ]);
   });
 
@@ -1137,15 +1137,15 @@ test.describe("Fog of War", () => {
     await app.clickLink("/not/a/path");
     await page.waitForSelector("#error");
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fnot%2Fa%2Fpath&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fnot%2Fa%2Fpath&version=/),
     ]);
     manifestRequests = [];
 
     // Go to a valid slug route
     await app.clickLink("/something");
     await page.waitForSelector("#slug");
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/__manifest\?p=%2Fsomething&version=/),
+      expect.stringMatching(/\/__manifest\?paths=%2Fsomething&version=/),
     ]);
     manifestRequests = [];
 
@@ -1233,7 +1233,7 @@ test.describe("Fog of War", () => {
     await new Promise((resolve) => setTimeout(resolve, 250));
     expect(manifestRequests).toEqual([
       expect.stringMatching(
-        /\/__manifest\?p=%2F&p=%2Fa&p=%2Fb&version=[a-z0-9]{8}/,
+        /\/__manifest\?paths=%2F%2C%2Fa%2C%2Fb&version=[a-z0-9]{8}/,
       ),
     ]);
   });
@@ -1275,7 +1275,7 @@ test.describe("Fog of War", () => {
     await new Promise((resolve) => setTimeout(resolve, 250));
     expect(manifestRequests).toEqual([
       expect.stringMatching(
-        /\/__manifest\?p=%2F&p=%2Fa&p=%2Fb&p=%2Fc&p=%2Fd&p=%2Fe&p=%2Ff&p=%2F/,
+        /\/__manifest\?paths=%2F%2C%2Fa%2C%2Fb%2C%2Fc%2C%2Fd%2C%2Fe%2C%2Ff%2C%2Fg/,
       ),
     ]);
   });
@@ -1439,7 +1439,7 @@ test.describe("Fog of War", () => {
       ),
     ).toEqual(["root", "routes/_index", "routes/a"]);
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/custom-manifest\?p=%2F&p=%2Fa&version=/),
+      expect.stringMatching(/\/custom-manifest\?paths=%2F%2C%2Fa&version=/),
     ]);
     manifestRequests = [];
 
@@ -1449,7 +1449,7 @@ test.describe("Fog of War", () => {
     // Wait for eager discovery to kick off
     await new Promise((r) => setTimeout(r, 500));
     expect(manifestRequests).toEqual([
-      expect.stringMatching(/\/custom-manifest\?p=%2Fa%2Fb&version=/),
+      expect.stringMatching(/\/custom-manifest\?paths=%2Fa%2Fb&version=/),
     ]);
 
     expect(wrongManifestRequests).toEqual([]);