test: add e2e

Author: hi-ogawa

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

@@ -244,6 +244,13 @@ function defineTest(f: Fixture) {
     await page.getByRole('button', { name: 'client-counter: 1' }).click()
   })
 
+  test('import environment', async ({ page }) => {
+    await page.goto(f.url())
+    await expect(page.getByTestId('import-environment')).toHaveText(
+      '[test-import-environment: test-ssr]',
+    )
+  })
+
   test('server action @js', async ({ page }) => {
     await page.goto(f.url())
     await waitForHydration(page)

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

@@ -0,0 +1,13 @@
+export async function TestImportEnvironment() {
+  const ssr = await import.meta.viteRsc.import<typeof import('./ssr')>(
+    './ssr.tsx',
+    { environment: 'ssr' },
+  )
+  const html = ssr.testSsrModule()
+  return (
+    <div data-testid="import-environment">
+      [test-import-environment:{' '}
+      <span dangerouslySetInnerHTML={{ __html: html }} />]
+    </div>
+  )
+}

packages/plugin-rsc/examples/basic/src/routes/import-environment/ssr.tsx

@@ -0,0 +1,13 @@
+import { useState } from 'react'
+import { renderToString } from 'react-dom/server'
+
+// SSR-only: useState and renderToString are not available in RSC environment
+
+function ClientComponent() {
+  const [state] = useState('test-ssr')
+  return <span>{state}</span>
+}
+
+export function testSsrModule(): string {
+  return renderToString(<ClientComponent />)
+}

packages/plugin-rsc/examples/basic/src/routes/root.tsx

@@ -34,6 +34,7 @@ import { TestHmrSharedServer } from './hmr-shared/server'
 import { TestHmrSwitchClient } from './hmr-switch/client'
 import { TestHmrSwitchServer } from './hmr-switch/server'
 import { TestHydrationMismatch } from './hydration-mismatch/server'
+import { TestImportEnvironment } from './import-environment/server'
 import { TestImportMetaGlob } from './import-meta-glob/server'
 import { TestLazyCssClientToClient } from './lazy-css/client-to-client'
 import { TestLazyCssServerToClient } from './lazy-css/server-to-client'
@@ -111,6 +112,7 @@ export function Root(props: { url: URL }) {
         <TestReactCache url={props.url} />
         <TestCssQueries />
         <TestImportMetaGlob />
+        <TestImportEnvironment />
         <TestAssetsServer />
         <TestTreeShakeServer />
         <TestTreeShake2 />