Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

refactor(rsc): use inline style for server css during dev #875

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
hi-ogawa wants to merge 5 commits into main
base: main
Choose a base branch
Loading
from 09-18-refactor_rsc_use_inline_style_for_server_css
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 7 additions & 7 deletions packages/plugin-rsc/e2e/basic.test.ts
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -739,13 +739,13 @@
'link[rel="stylesheet"][data-precedence="vite-rsc/client-reference"]',
),
).toHaveCount(0)
await expect(
page
.locator(
'link[rel="stylesheet"][data-precedence="vite-rsc/importer-resources"]',
)
.nth(0),
).toBeAttached()
// await expect(
// page
// .locator(
// 'link[rel="stylesheet"][data-precedence="vite-rsc/importer-resources"]',
// )
// .nth(0),
// ).toBeAttached()
await expect(
page
.locator(
Expand Down Expand Up @@ -830,7 +830,7 @@
`/* color: rgb(0, 165, 255); */`,
),
)
await expect(page.locator('.test-style-server')).toHaveCSS(

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (rolldown)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (rolldown)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (rolldown)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-canary)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-canary)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-canary)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-experimental)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-experimental)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-experimental)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / chromium)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / chromium)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / chromium)

[chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [chromium] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ───────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 3 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 6 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / webkit)

[webkit] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [webkit] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ─────────────────────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / webkit)

[webkit] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [webkit] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ─────────────────────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 3 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 6 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / webkit)

[webkit] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [webkit] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ─────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / firefox)

[firefox] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [firefox] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ────────────────────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / firefox)

[firefox] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [firefox] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ────────────────────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56

Check failure on line 833 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / firefox)

[firefox] › e2e/basic.test.ts:816:5 › dev-default › css hmr server 

 1) [firefox] › e2e/basic.test.ts:816:5 › dev-default › css hmr server ────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 2 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(0, 165, 255)"
 7 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 831 | ),
 832 | )
 > 833 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 834 | 'color',
 835 | 'rgb(0, 0, 0)',
 836 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:833:56
'color',
'rgb(0, 0, 0)',
)
Expand Down Expand Up @@ -865,7 +865,7 @@
editor.edit((s) =>
s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
)
await expect(page.locator('.test-style-server')).toHaveCSS(

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (rolldown)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (rolldown)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (rolldown)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-canary)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-canary)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-canary)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-experimental)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-experimental)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium) (react-experimental)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / chromium)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / chromium)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / chromium)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / chromium)

[chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [chromium] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ───────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / webkit)

[webkit] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [webkit] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ─────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / webkit)

[webkit] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [webkit] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ─────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (macos-latest / webkit)

[webkit] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [webkit] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ─────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /Users/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / firefox)

[firefox] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [firefox] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ────────────
 Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / firefox)

[firefox] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [firefox] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ────────────
 Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58

Check failure on line 868 in packages/plugin-rsc/e2e/basic.test.ts

View workflow job for this annotation

GitHub Actions / test-rsc (ubuntu-latest / firefox)

[firefox] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js 

 2) [firefox] › e2e/basic.test.ts:850:5 › dev-default › adding/removing css server @js ────────────
 Error: expect(locator).toHaveCSS(expected) failed
 Locator: locator('.test-style-server')
 Expected string: "rgb(0, 0, 0)"
 Received string: "rgb(255, 165, 0)"
 Timeout: 5000ms
 Call log:
 - Expect "toHaveCSS" with timeout 5000ms
 - waiting for locator('.test-style-server')
 9 ×ばつ locator resolved to <div class="test-style-server">test-style-server</div>
 - unexpected value "rgb(255, 165, 0)"
 866 | s.replaceAll(`import './server.css'`, `/* import './server.css' */`),
 867 | )
 > 868 | await expect(page.locator('.test-style-server')).toHaveCSS(
 | ^
 869 | 'color',
 870 | 'rgb(0, 0, 0)',
 871 | )
 at /home/runner/work/vite-plugin-react/vite-plugin-react/packages/plugin-rsc/e2e/basic.test.ts:868:58
'color',
'rgb(0, 0, 0)',
)
Expand Down
168 changes: 162 additions & 6 deletions packages/plugin-rsc/src/plugin.ts
View file Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ import {
cleanUrl,
directRequestRE,
evalValue,
injectQuery,
normalizeViteImportAnalysisUrl,
prepareError,
} from './plugins/vite-utils'
Expand Down Expand Up @@ -992,6 +993,21 @@ export default assetsManifest.bootstrapScriptContent;
async function () {
assert(this.environment.mode === 'dev')
let code = ''
code += `;(${() => {
const nodes = document.querySelectorAll<HTMLStyleElement>('style')
nodes.forEach((node) => {
if (
node.dataset.precedence?.startsWith(
'vite-rsc/importer-resources/',
)
) {
const id = node.dataset.precedence.slice(
'vite-rsc/importer-resources/'.length,
)
node.dataset.viteDevId = id
}
})
}})();`
// enable hmr only when react plugin is available
const resolved = await this.resolve('/@react-refresh')
if (resolved) {
Expand Down Expand Up @@ -1923,6 +1939,55 @@ function vitePluginRscCss(
return { ids: [...cssIds], hrefs, visitedFiles: [...visitedFiles] }
}

async function collectCss2(
environment: DevEnvironment,
clientEnvironment: DevEnvironment,
entryId: string,
) {
const visited = new Set<string>()
const cssIds = new Set<string>()
const visitedFiles = new Set<string>()

function recurse(id: string) {
if (visited.has(id)) {
return
}
visited.add(id)
const mod = environment.moduleGraph.getModuleById(id)
if (mod?.file) {
visitedFiles.add(mod.file)
}
for (const next of mod?.importedModules ?? []) {
if (next.id) {
if (isCSSRequest(next.id)) {
if (hasSpecialCssQuery(next.id)) {
continue
}
cssIds.add(next.id)
} else {
recurse(next.id)
}
}
}
}

recurse(entryId)

const styles: Record<string, string> = {}
for (const id of cssIds) {
try {
const result = await clientEnvironment.transformRequest(
injectQuery(id, 'direct'),
)
styles[id] = result?.code ?? ''
} catch (e) {
console.error(`[collectCss failed '${id}']`, e)
}
}

return { ids: [...cssIds], styles, visitedFiles: [...visitedFiles] }
}

function getRscCssTransformFilter({
id,
code,
Expand Down Expand Up @@ -2122,23 +2187,38 @@ function vitePluginRscCss(
}
}
},
load(id) {
async load(id) {
const { server } = manager
const parsed = parseCssVirtual(id)
if (parsed?.type === 'rsc') {
assert(this.environment.name === 'rsc')
const importer = parsed.id
if (this.environment.mode === 'dev') {
const result = collectCss(server.environments.rsc!, importer)
const result = await collectCss2(
server.environments.rsc!,
server.environments.client,
importer,
)
for (const file of [importer, ...result.visitedFiles]) {
this.addWatchFile(file)
}
const cssHrefs = result.hrefs.map((href) => href.slice(1))
const deps = assetsURLOfDeps({ css: cssHrefs, js: [] }, manager)
return generateResourcesCode(
serializeValueWithRuntime(deps),
const jsHrefs = [
`/@id/__x00__${toCssVirtual({ id: importer, type: 'rsc-browser' })}`,
]
return generateResourcesCode2(
{ styles: result.styles, js: jsHrefs },
manager,
)
// const result = collectCss(server.environments.rsc!, importer)
// for (const file of [importer, ...result.visitedFiles]) {
// this.addWatchFile(file)
// }
// const cssHrefs = result.hrefs.map((href) => href.slice(1))
// const deps = assetsURLOfDeps({ css: cssHrefs, js: [] }, manager)
// return generateResourcesCode(
// serializeValueWithRuntime(deps),
// manager,
// )
} else {
const key = manager.toRelativeId(importer)
manager.serverResourcesMetaMap[importer] = { key }
Expand All @@ -2153,6 +2233,23 @@ function vitePluginRscCss(
`
}
}
if (parsed?.type === 'rsc-browser') {
assert(this.environment.name === 'client')
assert(this.environment.mode === 'dev')
const importer = parsed.id
const result = collectCss(server.environments.rsc!, importer)
for (const file of [importer, ...result.visitedFiles]) {
this.addWatchFile(file)
}
let code = result.ids
.map((id) => id.replace(/^0円/, ''))
.map((id) => `import ${JSON.stringify(id)};\n`)
.join('')
// ensure hmr boundary at this virtual since otherwise non-self accepting css
// (e.g. css module) causes full reload
code += `if (import.meta.hot) { import.meta.hot.accept() }\n`
return code
}
},
},
createVirtualPlugin(
Expand Down Expand Up @@ -2188,6 +2285,65 @@ export default function RemoveDuplicateServerCss() {
]
}

function generateResourcesCode2(
deps: { styles: Record<string, string>; js: string[] },
manager: RscPluginManager,
) {
const ResourcesFn = (
React: typeof import('react'),
deps: { styles: Record<string, string>; js: string[] },
RemoveDuplicateServerCss?: React.FC,
) => {
return function Resources() {
return React.createElement(React.Fragment, null, [
...Object.entries(deps.styles).map(([id, content]) =>
React.createElement(
'style',
{
key: 'css:' + id,
// https://react.dev/reference/react-dom/components/style#rendering-an-inline-css-stylesheet
href: 'vite-rsc/importer-resources/' + id,
precedence: 'vite-rsc/importer-resources/' + id,
// TODO: hoisted style doesn't support arbitrary attributes so they are injected in browser entry
// https://github.com/vitejs/vite/blob/dfd8d8aebec412f56346d078bb00170807f0883e/packages/vite/src/client/client.ts#L504
// 'data-vite-dev-id': id,
},
content,
),
),
...deps.js.map((href: string) =>
React.createElement('script', {
key: 'js:' + href,
type: 'module',
async: true,
src: href,
}),
),
RemoveDuplicateServerCss &&
React.createElement(RemoveDuplicateServerCss, {
key: 'remove-duplicate-css',
}),
])
}
}

return `
import __vite_rsc_react__ from "react";

${
manager.config.command === 'serve'
? `import RemoveDuplicateServerCss from "virtual:vite-rsc/remove-duplicate-server-css";`
: `const RemoveDuplicateServerCss = undefined;`
}

export const Resources = (${ResourcesFn.toString()})(
__vite_rsc_react__,
${JSON.stringify(deps)},
RemoveDuplicateServerCss,
);
`
}

function generateResourcesCode(depsCode: string, manager: RscPluginManager) {
const ResourcesFn = (
React: typeof import('react'),
Expand Down
2 changes: 1 addition & 1 deletion packages/plugin-rsc/src/plugins/shared.ts
View file Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
type CssVirtual = {
id: string
type: 'ssr' | 'rsc'
type: 'ssr' | 'rsc' | 'rsc-browser'
}

export function toCssVirtual({ id, type }: CssVirtual) {
Expand Down
Loading

AltStyle によって変換されたページ (->オリジナル) /