Merge branch 'main' into test-stable-react-chunks

Author: hi-ogawa

.github/workflows/ci-rsc.yml

@@ -1,4 +1,7 @@
 name: ci-rsc
+
+permissions: {}
+
 on:
   push:
     branches:

.npmrc

@@ -5,3 +5,5 @@ hoist-pattern[]=eslint-import-resolver-*
 strict-peer-dependencies=false
 shell-emulator=true
 auto-install-peers=false
+link-workspace-packages=true
+prefer-workspace-packages=true

package.json

@@ -72,9 +72,6 @@
     ]
   },
   "pnpm": {
-    "overrides": {
-      "@vitejs/plugin-rsc": "workspace:*"
-    },
     "packageExtensions": {
       "generouted": {
         "peerDependencies": {

packages/plugin-rsc/README.md

@@ -98,7 +98,6 @@ export default defineConfig({
     // this environment is responsible for:
     // - RSC stream deserialization (RSC stream -> React VDOM)
     // - traditional SSR (React VDOM -> HTML string/stream)
-    // (NOTE: as it can be seen in the above diagram. SSR is technically an optional mechanism.)
     ssr: {
       build: {
         rollupOptions: {

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

@@ -12,6 +12,33 @@ test.describe('dev-default', () => {
   defineTest(f)
 })
 
+test.describe('dev-initial', () => {
+  const f = useFixture({ root: 'examples/basic', mode: 'dev' })
+
+  // verify css is collected properly on server startup (i.e. empty module graph)
+  testNoJs('style', async ({ page }) => {
+    await page.goto(f.url('./'))
+    await expect(page.locator('.test-style-client')).toHaveCSS(
+      'color',
+      'rgb(255, 165, 0)',
+    )
+    await expect(page.locator('.test-style-server')).toHaveCSS(
+      'color',
+      'rgb(255, 165, 0)',
+    )
+    await expect(page.locator('.test-tw-client')).toHaveCSS(
+      'color',
+      // blue-500
+      'rgb(0, 0, 255)',
+    )
+    await expect(page.locator('.test-tw-server')).toHaveCSS(
+      'color',
+      // red-500
+      'rgb(255, 0, 0)',
+    )
+  })
+})
+
 test.describe('build-default', () => {
   const f = useFixture({ root: 'examples/basic', mode: 'build' })
   defineTest(f)
@@ -43,6 +70,39 @@ test.describe('build-base', () => {
   defineTest(f)
 })
 
+test.describe('dev-react-compiler', () => {
+  const f = useFixture({
+    root: 'examples/basic',
+    mode: 'dev',
+    cliOptions: {
+      env: {
+        TEST_REACT_COMPILER: 'true',
+      },
+    },
+  })
+  defineTest(f)
+
+  test('verify react compiler', async ({ page }) => {
+    await page.goto(f.url())
+    await waitForHydration(page)
+    const res = await page.request.get(f.url('src/routes/client.tsx'))
+    expect(await res.text()).toContain('react.memo_cache_sentinel')
+  })
+})
+
+test.describe('build-react-compiler', () => {
+  const f = useFixture({
+    root: 'examples/basic',
+    mode: 'build',
+    cliOptions: {
+      env: {
+        TEST_REACT_COMPILER: 'true',
+      },
+    },
+  })
+  defineTest(f)
+})
+
 test.describe(() => {
   // disabled by default
   if (!process.env.TEST_ISOLATED) return
@@ -623,15 +683,6 @@ function defineTest(f: Fixture) {
         'rgb(255, 0, 0)',
       )
     })
-
-    testNoJs('no FOUC after server restart @nojs', async ({ page }) => {
-      const res = await page.request.get(f.url('/__test_restart'))
-      expect(await res.text()).toBe('ok')
-      await new Promise((r) => setTimeout(r, 100))
-      await page.goto(f.url('./'))
-      await testCss(page)
-      await testTailwind(page)
-    })
   })
 
   test('temporary references @js', async ({ page }) => {

packages/plugin-rsc/examples/basic/package.json

@@ -13,20 +13,22 @@
   },
   "dependencies": {
     "@vitejs/plugin-rsc": "latest",
-    "react": "latest",
-    "react-dom": "latest"
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.1.4",
-    "@types/react": "latest",
-    "@types/react-dom": "latest",
+    "@types/react": "^19.1.8",
+    "@types/react-dom": "^19.1.6",
     "@vitejs/plugin-react": "latest",
     "@vitejs/test-dep-client-in-server": "file:./test-dep/client-in-server",
     "@vitejs/test-dep-client-in-server2": "file:./test-dep/client-in-server2",
     "@vitejs/test-dep-server-in-client": "file:./test-dep/server-in-client",
     "@vitejs/test-dep-server-in-server": "file:./test-dep/server-in-server",
+    "babel-plugin-react-compiler": "19.1.0-rc.2",
     "tailwindcss": "^4.1.4",
     "vite": "^7.0.2",
-    "vite-plugin-inspect": "^11.2.0"
+    "vite-plugin-inspect": "^11.2.0",
+    "wrangler": "^4.22.0"
   }
 }

packages/plugin-rsc/examples/basic/vite.config.ts

@@ -29,7 +29,14 @@ export default defineConfig({
   clearScreen: false,
   plugins: [
     tailwindcss(),
-    react(),
+    process.env.TEST_REACT_COMPILER
+      ? (react({
+          babel: { plugins: ['babel-plugin-react-compiler'] },
+        }).map((p) => ({
+          ...p,
+          applyToEnvironment: (e: any) => e.name === 'client',
+        })) as any)
+      : react(),
     vitePluginUseCache(),
     rsc({
       entries: {
@@ -45,23 +52,6 @@ export default defineConfig({
     }),
     // avoid ecosystem CI fail due to vite-plugin-inspect compatibility
     !process.env.ECOSYSTEM_CI && inspect(),
-    {
-      // test server restart scenario on e2e
-      name: 'test-api',
-      configureServer(server) {
-        server.middlewares.use((req, res, next) => {
-          const url = new URL(req.url!, 'http://localhost')
-          if (url.pathname === '/__test_restart') {
-            setTimeout(() => {
-              server.restart()
-            }, 10)
-            res.end('ok')
-            return
-          }
-          next()
-        })
-      },
-    },
     {
       name: 'test-client-reference-tree-shaking',
       enforce: 'post',