([^<]+)<\/div>/);
+
+ expect(ssrClientTimestamp).not.toBeNull();
+ expect(ssrClientRandom).not.toBeNull();
+ expect(ssrClientTimestamp[1]).toBe(ssrTimestamp[1]);
+ expect(ssrClientRandom[1]).toBe(ssrRandom[1]);
+});
+
+test("use cache request - streamed Suspense cache entries hydrate correctly", async () => {
+ await server("fixtures/use-cache-request-suspense.jsx");
+
+ // Verify incremental injection uses Object.assign
+ const res = await fetch(hostname, { headers: { accept: "text/html" } });
+ const html = await res.text();
+ expect(html).toContain(
+ "Object.assign(self.__react_server_request_cache_entries__"
+ );
+
+ // Load in a real browser — all values from the same request
+ await page.goto(hostname);
+
+ // Wait for the Suspense boundary to resolve
+ await page.waitForSelector("#suspense-client");
+
+ // Eager: server component and client component should share the same value
+ const eagerTimestamp = await page.textContent("#eager-timestamp");
+ const eagerRandom = await page.textContent("#eager-random");
+ const clientTimestamp = await page.textContent("#client-timestamp");
+ const clientRandom = await page.textContent("#client-random");
+
+ expect(clientTimestamp).toBe(eagerTimestamp);
+ expect(clientRandom).toBe(eagerRandom);
+
+ // Delayed (Suspense-streamed): server component and client component
+ // should share the same value — proving the incrementally-injected
+ // cache entry was picked up during hydration
+ const delayedTimestamp = await page.textContent("#delayed-timestamp");
+ const delayedRandom = await page.textContent("#delayed-random");
+ const suspenseClientTimestamp = await page.textContent(
+ "#suspense-client-timestamp"
+ );
+ const suspenseClientRandom = await page.textContent(
+ "#suspense-client-random"
+ );
+
+ expect(suspenseClientTimestamp).toBe(delayedTimestamp);
+ expect(suspenseClientRandom).toBe(delayedRandom);
+});
+
+test("use cache request - hydrate=false client recomputes on browser", async () => {
+ await server("fixtures/use-cache-request-no-hydrate.jsx");
+
+ // Fetch raw HTML to get SSR values
+ const res = await fetch(hostname, { headers: { accept: "text/html" } });
+ const html = await res.text();
+
+ const ssrTimestamp = html.match(/
([^<]+)<\/div>/);
+
+ // Load in browser — client component should recompute since hydrate=false
+ // means the cache value is NOT embedded in the HTML
+ await page.goto(hostname);
+ await page.waitForFunction(() => typeof document !== "undefined");
+
+ const clientTimestamp = await page.textContent("#client-timestamp");
+
+ // With hydrate=false, the browser recomputes the value, so it should differ
+ // from the SSR value (different timestamp = different computation)
+ expect(clientTimestamp).not.toBe(ssrTimestamp[1]);
+});
diff --git a/test/fixtures/use-cache-request-client.jsx b/test/fixtures/use-cache-request-client.jsx
new file mode 100644
index 00000000..21e58722
--- /dev/null
+++ b/test/fixtures/use-cache-request-client.jsx
@@ -0,0 +1,17 @@
+"use client";
+
+import { use } from "react";
+import { getRequestData } from "./use-cache-request-data.mjs";
+
+export default function ClientDisplay() {
+ const data = use(getRequestData());
+ return (
+
+
{data.timestamp}
+
{data.random}
+
+ {data.createdAt instanceof Date ? "Date" : typeof data.createdAt}
+
+
+ );
+}
diff --git a/test/fixtures/use-cache-request-data.mjs b/test/fixtures/use-cache-request-data.mjs
new file mode 100644
index 00000000..a747b2b8
--- /dev/null
+++ b/test/fixtures/use-cache-request-data.mjs
@@ -0,0 +1,41 @@
+let computeCount = 0;
+
+export async function getRequestData() {
+ "use cache: request";
+ await new Promise((resolve) => setTimeout(resolve, 5));
+ computeCount++;
+ return {
+ timestamp: Date.now(),
+ random: Math.random(),
+ computeCount,
+ createdAt: new Date(),
+ };
+}
+
+let noHydrateCount = 0;
+
+export async function getNoHydrateData() {
+ "use cache: request; hydrate=false";
+ await new Promise((resolve) => setTimeout(resolve, 5));
+ noHydrateCount++;
+ return {
+ timestamp: Date.now(),
+ random: Math.random(),
+ computeCount: noHydrateCount,
+ createdAt: new Date(),
+ };
+}
+
+let suspenseCount = 0;
+
+export async function getSuspenseData() {
+ "use cache: request";
+ // Longer delay to ensure this resolves after the initial Suspense shell
+ await new Promise((resolve) => setTimeout(resolve, 200));
+ suspenseCount++;
+ return {
+ timestamp: Date.now(),
+ random: Math.random(),
+ computeCount: suspenseCount,
+ };
+}
diff --git a/test/fixtures/use-cache-request-no-hydrate-client.jsx b/test/fixtures/use-cache-request-no-hydrate-client.jsx
new file mode 100644
index 00000000..8ae0f106
--- /dev/null
+++ b/test/fixtures/use-cache-request-no-hydrate-client.jsx
@@ -0,0 +1,17 @@
+"use client";
+
+import { use } from "react";
+import { getNoHydrateData } from "./use-cache-request-data.mjs";
+
+export default function NoHydrateClient() {
+ const data = use(getNoHydrateData());
+ return (
+
+
{data.timestamp}
+
{data.random}
+
+ {data.createdAt instanceof Date ? "Date" : typeof data.createdAt}
+
+
+ );
+}
diff --git a/test/fixtures/use-cache-request-no-hydrate.jsx b/test/fixtures/use-cache-request-no-hydrate.jsx
new file mode 100644
index 00000000..0c6f5310
--- /dev/null
+++ b/test/fixtures/use-cache-request-no-hydrate.jsx
@@ -0,0 +1,24 @@
+import { getNoHydrateData } from "./use-cache-request-data.mjs";
+import NoHydrateClient from "./use-cache-request-no-hydrate-client.jsx";
+
+async function ServerDisplay() {
+ const data = await getNoHydrateData();
+ return (
+ <>
+
{data.timestamp}
+
{data.random}
+
+ {data.createdAt instanceof Date ? "Date" : typeof data.createdAt}
+
+
+ );
+}
+
+export default async function App() {
+ return (
+
+
+
+
+ );
+}
diff --git a/test/fixtures/use-cache-request-suspense-client.jsx b/test/fixtures/use-cache-request-suspense-client.jsx
new file mode 100644
index 00000000..44890982
--- /dev/null
+++ b/test/fixtures/use-cache-request-suspense-client.jsx
@@ -0,0 +1,14 @@
+"use client";
+
+import { use } from "react";
+import { getSuspenseData } from "./use-cache-request-data.mjs";
+
+export default function SuspenseClientDisplay() {
+ const data = use(getSuspenseData());
+ return (
+
+
{data.timestamp}
+
{data.random}
+
+ );
+}
diff --git a/test/fixtures/use-cache-request-suspense.jsx b/test/fixtures/use-cache-request-suspense.jsx
new file mode 100644
index 00000000..2b866eb0
--- /dev/null
+++ b/test/fixtures/use-cache-request-suspense.jsx
@@ -0,0 +1,37 @@
+import { Suspense } from "react";
+import { getRequestData, getSuspenseData } from "./use-cache-request-data.mjs";
+import ClientDisplay from "./use-cache-request-client.jsx";
+import SuspenseClientDisplay from "./use-cache-request-suspense-client.jsx";
+
+async function Eager() {
+ const data = await getRequestData();
+ return (
+ <>
+
{data.timestamp}
+
{data.random}
+
+ );
+}
+
+async function Delayed() {
+ const data = await getSuspenseData();
+ return (
+ <>
+
{data.timestamp}
+
{data.random}
+
+
+ );
+}
+
+export default async function App() {
+ return (
+
+
+
+ Loading...
}>
+
+
+
+ );
+}
diff --git a/test/fixtures/use-cache-request.jsx b/test/fixtures/use-cache-request.jsx
new file mode 100644
index 00000000..5c5366e4
--- /dev/null
+++ b/test/fixtures/use-cache-request.jsx
@@ -0,0 +1,38 @@
+import { getRequestData } from "./use-cache-request-data.mjs";
+import ClientDisplay from "./use-cache-request-client.jsx";
+
+async function First() {
+ const data = await getRequestData();
+ return (
+ <>
+
+ {data.createdAt instanceof Date ? "Date" : typeof data.createdAt}
+
+
+ );
+}
+
+async function Second() {
+ const data = await getRequestData();
+ return (
+ <>
+
+ {data.createdAt instanceof Date ? "Date" : typeof data.createdAt}
+