feat(rsc): add support for renderBuiltInUrl on assets metadata

Author: hlimas

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

@@ -1,8 +1,12 @@
 import { createHash } from 'node:crypto'
-import { readFileSync } from 'node:fs'
 import { type Page, expect, test } from '@playwright/test'
 import { type Fixture, setupIsolatedFixture, useFixture } from './fixture'
-import { expectNoReload, testNoJs, waitForHydration } from './helper'
+import {
+  expectNoReload,
+  loadRSCManifest,
+  testNoJs,
+  waitForHydration,
+} from './helper'
 import path from 'node:path'
 import os from 'node:os'
 
@@ -72,6 +76,58 @@ test.describe('build-base', () => {
   defineTest(f)
 })
 
+test.describe('dev-render-builtin-url-runtime', () => {
+  const f = useFixture({
+    root: 'examples/basic',
+    mode: 'dev',
+    cliOptions: {
+      env: {
+        TEST_RENDER_BUILTIN_URL: 'runtime',
+      },
+    },
+  })
+  defineTest(f)
+})
+
+test.describe('build-render-builtin-url-runtime', () => {
+  const f = useFixture({
+    root: 'examples/basic',
+    mode: 'build',
+    cliOptions: {
+      env: {
+        TEST_RENDER_BUILTIN_URL: 'runtime',
+      },
+    },
+  })
+  defineTest(f)
+})
+
+test.describe('dev-render-builtin-url-string', () => {
+  const f = useFixture({
+    root: 'examples/basic',
+    mode: 'dev',
+    cliOptions: {
+      env: {
+        TEST_RENDER_BUILTIN_URL: 'string',
+      },
+    },
+  })
+  defineTest(f)
+})
+
+test.describe('build-render-builtin-url-string', () => {
+  const f = useFixture({
+    root: 'examples/basic',
+    mode: 'build',
+    cliOptions: {
+      env: {
+        TEST_RENDER_BUILTIN_URL: 'string',
+      },
+    },
+  })
+  defineTest(f)
+})
+
 test.describe('dev-react-compiler', () => {
   const f = useFixture({
     root: 'examples/basic',
@@ -233,12 +289,9 @@ function defineTest(f: Fixture) {
         .evaluateAll((elements) =>
           elements.map((el) => el.getAttribute('href')),
         )
-      const manifest = JSON.parse(
-        readFileSync(
-          f.root + '/dist/ssr/__vite_rsc_assets_manifest.js',
-          'utf-8',
-        ).slice('export default '.length),
-      )
+
+      const manifest = await loadRSCManifest(f.root)
+
       const hashString = (v: string) =>
         createHash('sha256').update(v).digest().toString('hex').slice(0, 12)
       const deps =

packages/plugin-rsc/e2e/helper.ts

@@ -1,4 +1,5 @@
 import test, { type Page, expect } from '@playwright/test'
+import { readFileSync } from 'node:fs'
 
 export const testNoJs = test.extend({
   javaScriptEnabled: ({}, use) => use(false),
@@ -42,3 +43,16 @@ export async function expectNoReload(page: Page) {
     },
   }
 }
+
+export async function loadRSCManifest(root: string) {
+  // Use dynamic "data:" import instead of URL path imports so it is
+  // not cached by the runtime.
+  const manifestFileContent = readFileSync(
+    root + '/dist/ssr/__vite_rsc_assets_manifest.js',
+    'utf-8',
+  )
+  const manifest = (await import('data:text/javascript,' + manifestFileContent))
+    .default
+
+  return manifest
+}

packages/plugin-rsc/e2e/react-router.test.ts

@@ -1,8 +1,12 @@
 import { createHash } from 'node:crypto'
 import { expect, test } from '@playwright/test'
 import { type Fixture, useFixture } from './fixture'
-import { expectNoReload, testNoJs, waitForHydration } from './helper'
-import { readFileSync } from 'node:fs'
+import {
+  expectNoReload,
+  loadRSCManifest,
+  testNoJs,
+  waitForHydration,
+} from './helper'
 
 test.describe('dev-default', () => {
   const f = useFixture({ root: 'examples/react-router', mode: 'dev' })
@@ -74,12 +78,9 @@ function defineTest(f: Fixture) {
         .evaluateAll((elements) =>
           elements.map((el) => el.getAttribute('href')),
         )
-      const manifest = JSON.parse(
-        readFileSync(
-          f.root + '/dist/ssr/__vite_rsc_assets_manifest.js',
-          'utf-8',
-        ).slice('export default '.length),
-      )
+
+      const manifest = await loadRSCManifest(f.root)
+
       const hashString = (v: string) =>
         createHash('sha256').update(v).digest().toString('hex').slice(0, 12)
       const deps =

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

@@ -18,7 +18,11 @@ if (!(globalThis as any).__debugHandlerRegisterd) {
 }
 
 export default defineConfig({
-  base: process.env.TEST_BASE ? '/custom-base/' : undefined,
+  base: process.env.TEST_BASE
+    ? '/custom-base/'
+    : process.env.TEST_RENDER_BUILTIN_URL
+      ? './'
+      : undefined,
   clearScreen: false,
   plugins: [
     tailwindcss(),
@@ -157,6 +161,19 @@ export default { fetch: handler };
       '@vitejs/test-dep-server-in-client/client',
     ],
   },
+  experimental: process.env.TEST_RENDER_BUILTIN_URL
+    ? {
+        renderBuiltUrl(filename) {
+          if (process.env.TEST_RENDER_BUILTIN_URL === 'runtime') {
+            return {
+              runtime: `'/' + ${JSON.stringify(filename)}`,
+            }
+          } else {
+            return '/' + filename
+          }
+        },
+      }
+    : undefined,
 }) as any
 
 function vitePluginUseCache(): Plugin[] {

packages/plugin-rsc/package.json

@@ -39,6 +39,7 @@
   },
   "dependencies": {
     "@mjackson/node-fetch-server": "^0.7.0",
+    "devalue": "^5.1.1",
     "es-module-lexer": "^1.7.0",
     "estree-walker": "^3.0.3",
     "magic-string": "^0.30.17",