fix: decode each time getPayload() is called to allow for "in-context" decoding and hoisting of contextual assets

chore: use `vite build` for rsc framework fixtures

Author: jacob-ebey

.changeset/shiny-hotels-guess.md

@@ -0,0 +1,5 @@
+---
+"react-router": patch
+---
+
+decode each time `getPayload()` is called to allow for "in-context" decoding and hoisting of contextual assets

integration/helpers/create-fixture.ts

@@ -480,7 +480,12 @@ export async function createFixtureProject(
   if (templateName.includes("parcel")) {
     parcelBuild(projectDir, init.buildStdio, mode);
   } else {
-    reactRouterBuild(projectDir, init.buildStdio, mode);
+    reactRouterBuild(
+      projectDir,
+      init.buildStdio,
+      mode,
+      templateName.includes("rsc"),
+    );
   }
 
   return projectDir;
@@ -526,6 +531,7 @@ function reactRouterBuild(
   projectDir: string,
   buildStdio?: Writable,
   mode?: ServerMode,
+  isRsc?: boolean,
 ) {
   // We have a "require" instead of a dynamic import in readConfig gated
   // behind mode === ServerMode.Test to make jest happy, but that doesn't
@@ -535,8 +541,9 @@ function reactRouterBuild(
   mode = mode === ServerMode.Test ? ServerMode.Production : mode;
 
   let reactRouterBin = "node_modules/@react-router/dev/dist/cli/index.js";
+  let viteBin = "node_modules/vite/dist/node/cli.js";
 
-  let buildArgs: string[] = [reactRouterBin, "build"];
+  let buildArgs: string[] = [isRsc ? viteBin : reactRouterBin, "build"];
 
   let buildSpawn = spawnSync("node", buildArgs, {
     cwd: projectDir,

packages/react-router/lib/rsc/server.ssr.tsx

@@ -120,11 +120,38 @@ export async function routeRSCServerRequest({
   }
 
   const body = serverResponse.body;
-  let payloadPromise: Promise<RSCPayload>;
+
+  let buffer: Uint8Array[] | undefined;
+  let streamControllers: ReadableStreamDefaultController<Uint8Array>[] = [];
+
+  const createStream = () => {
+    if (!buffer) {
+      buffer = [];
+      return body.pipeThrough(
+        new TransformStream({
+          transform(chunk, controller) {
+            buffer!.push(chunk);
+            controller.enqueue(chunk);
+            streamControllers.forEach((c) => c.enqueue(chunk));
+          },
+          flush() {
+            streamControllers.forEach((c) => c.close());
+            streamControllers = [];
+          },
+        }),
+      );
+    }
+
+    return new ReadableStream({
+      start(controller) {
+        buffer!.forEach((chunk) => controller.enqueue(chunk));
+        streamControllers.push(controller);
+      },
+    });
+  };
+
   const getPayload = async () => {
-    if (payloadPromise) return payloadPromise;
-    payloadPromise = createFromReadableStream(body) as Promise<RSCPayload>;
-    return payloadPromise;
+    return createFromReadableStream(createStream()) as Promise<RSCPayload>;
   };
 
   try {