fix(rsc): fix deserializing client reference in server environment with React 19.2.1+ (#1000)

Co-authored-by: copilot-swe-agent[bot] <[email protected]>
Co-authored-by: hi-ogawa <[email protected]>
Co-authored-by: Hiroshi Ogawa <[email protected]>

Author: Copilot

packages/plugin-rsc/e2e/basic.test.ts

@@ -1252,8 +1252,7 @@ function defineTest(f: Fixture) {
       .click()
   }
 
-  // TODO: skipped since 19.2.1
-  test.skip('action bind client @js', async ({ page }) => {
+  test('action bind client @js', async ({ page }) => {
     await page.goto(f.url())
     await waitForHydration(page)
     await using _ = await expectNoReload(page)
@@ -1308,10 +1307,7 @@ function defineTest(f: Fixture) {
       .click()
   }
 
-  // TODO: skipped since 19.2.1 as round-tripping server action is broken
-  // import { createFromReadableStream, renderToReadableStream } from '@vitejs/plugin-rsc/rsc'
-  // renderToReadableStream -> createFromReadableStream
-  test.skip('test serialization @js', async ({ page }) => {
+  test('test serialization @js', async ({ page }) => {
     await page.goto(f.url())
     await waitForHydration(page)
     await expect(page.getByTestId('serialization')).toHaveText('?')

packages/plugin-rsc/e2e/browser-mode.test.ts

@@ -41,8 +41,7 @@ function defineBrowserModeTest(f: ReturnType<typeof useFixture>) {
       .click()
   }
 
-  // TODO: skipped since 19.2.1
-  test.skip('action bind client', async ({ page }) => {
+  test('action bind client', async ({ page }) => {
     await page.goto(f.url())
     await testActionBindClient(page)
   })

packages/plugin-rsc/examples/basic/src/routes/serialization/server.tsx

@@ -6,9 +6,6 @@ import { testSerializationAction } from './action'
 import { TestSerializationClient } from './client'
 
 export function TestSerializationServer() {
-  if (1) {
-    return <div>test-serialization:todo</div>
-  }
   const original = <TestSerializationClient action={testSerializationAction} />
   let serialized = renderToReadableStream(original)
   // debug serialization

packages/plugin-rsc/src/core/rsc.ts

@@ -28,24 +28,38 @@ export function setRequireModule(options: {
   ;(globalThis as any).__vite_rsc_server_require__ = memoize(
     async (id: string) => {
       if (id.startsWith(SERVER_DECODE_CLIENT_PREFIX)) {
+        // decode client reference on the server
         id = id.slice(SERVER_DECODE_CLIENT_PREFIX.length)
         id = removeReferenceCacheTag(id)
         // create `registerClientReference` on the fly since there's no way to
         // grab the original client reference module on ther server.
         // cf. https://github.com/lazarv/react-server/blob/79e7acebc6f4a8c930ad8422e2a4a9fdacfcce9b/packages/react-server/server/module-loader.mjs#L19
-        // decode client reference on the server
-        return new Proxy({} as any, {
-          get(target, name, _receiver) {
+        const target = {} as any
+        const getOrCreateClientReference = (name: string) => {
+          return (target[name] ??= ReactServer.registerClientReference(
+            () => {
+              throw new Error(
+                `Unexpectedly client reference export '${name}' is called on server`,
+              )
+            },
+            id,
+            name,
+          ))
+        }
+        return new Proxy(target, {
+          get(_target, name, _receiver) {
+            // not thennable
             if (typeof name !== 'string' || name === 'then') return
-            return (target[name] ??= ReactServer.registerClientReference(
-              () => {
-                throw new Error(
-                  `Unexpectedly client reference export '${name}' is called on server`,
-                )
-              },
-              id,
-              name,
-            ))
+            return getOrCreateClientReference(name)
+          },
+          // React 19.2.1+ uses hasOwnProperty.call() to check for exports
+          // https://github.com/facebook/react/pull/35277
+          getOwnPropertyDescriptor(_target, name) {
+            if (typeof name !== 'string' || name === 'then') {
+              return Reflect.getOwnPropertyDescriptor(target, name)
+            }
+            getOrCreateClientReference(name)
+            return Reflect.getOwnPropertyDescriptor(target, name)
           },
         })
       }