-
Notifications
You must be signed in to change notification settings - Fork 26.7k
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
Add test for Server Components HMR after navigating to page with Edge runtime #67782
Merged
eps1lon
merged 2 commits into
canary
from
sebbie/07-15-illustrate_hmr_bug_when_navigating_between_pages_with_different_runtimes
Jul 17, 2024
Merged
Changes from all commits
Commits
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -3,6 +3,8 @@ import { retry, waitFor } from 'next-test-utils' | |
|
||
const envFile = '.env.development.local' | ||
|
||
const isPPREnabledByDefault = process.env.__NEXT_EXPERIMENTAL_PPR === 'true' | ||
|
||
describe(`app-dir-hmr`, () => { | ||
const { next } = nextTestSetup({ | ||
files: __dirname, | ||
|
@@ -54,7 +56,86 @@ describe(`app-dir-hmr`, () => { | |
} | ||
}) | ||
|
||
it('should update server components after navigating to a page with a different runtime', async () => { | ||
const envContent = await next.readFile(envFile) | ||
|
||
const browser = await next.browser('/env/node') | ||
await browser.loadPage(`${next.url}/env/edge`) | ||
await browser.eval('window.__TEST_NO_RELOAD = true') | ||
|
||
await next.patchFile(envFile, 'MY_DEVICE="ipad"') | ||
|
||
try { | ||
const logs = await browser.log() | ||
|
||
if (process.env.TURBOPACK) { | ||
await retry(async () => { | ||
const fastRefreshLogs = logs.filter((log) => { | ||
return log.message.startsWith('[Fast Refresh]') | ||
}) | ||
// FIXME: 3+ "rebuilding" but single "done" is confusing. | ||
// There may actually be more "rebuilding" but not reliably. | ||
// To ignore this flakiness, we just assert on subset matches. | ||
// Once the bug is fixed, each "rebuilding" should be paired with a "done in" exactly. | ||
expect(fastRefreshLogs).toEqual( | ||
expect.arrayContaining([ | ||
{ source: 'log', message: '[Fast Refresh] rebuilding' }, | ||
{ source: 'log', message: '[Fast Refresh] rebuilding' }, | ||
{ | ||
source: 'log', | ||
message: expect.stringContaining('[Fast Refresh] done in '), | ||
}, | ||
{ source: 'log', message: '[Fast Refresh] rebuilding' }, | ||
]) | ||
) | ||
}) | ||
} else { | ||
await retry( | ||
async () => { | ||
const fastRefreshLogs = logs.filter((log) => { | ||
return log.message.startsWith('[Fast Refresh]') | ||
}) | ||
// FIXME: Should be either a single "rebuilding"+"done" or the last "rebuilding" should be followed by "done" | ||
expect(fastRefreshLogs).toEqual([ | ||
{ source: 'log', message: '[Fast Refresh] rebuilding' }, | ||
{ source: 'log', message: '[Fast Refresh] rebuilding' }, | ||
{ | ||
source: 'log', | ||
message: expect.stringContaining('[Fast Refresh] done in '), | ||
}, | ||
{ source: 'log', message: '[Fast Refresh] rebuilding' }, | ||
]) | ||
}, | ||
// Very slow Hot Update for some reason. | ||
// May be related to receiving 3 rebuild events but only one finish event | ||
5000 | ||
) | ||
} | ||
const envValue = await browser.elementByCss('p').text() | ||
const mpa = await browser.eval('window.__TEST_NO_RELOAD === undefined') | ||
// Flaky sometimes in Webpack: | ||
// A. misses update and just receives `{ envValue: 'mac', mpa: false }` | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. |
||
// B. triggers error on server resulting in MPA: `{ envValue: 'ipad', mpa: true }` and server logs: ⨯ [TypeError: Cannot read properties of undefined (reading 'polyfillFiles')] ⨯ [TypeError: Cannot read properties of null (reading 'default')] | ||
// A is more common than B. | ||
expect({ envValue, mpa }).toEqual({ | ||
envValue: | ||
isPPREnabledByDefault && !process.env.TURBOPACK | ||
? // FIXME: Should be 'ipad' but PPR+Webpack swallows the update reliably | ||
'mac' | ||
: 'ipad', | ||
mpa: false, | ||
}) | ||
} finally { | ||
await next.patchFile(envFile, envContent) | ||
} | ||
}) | ||
|
||
it('should update server components pages when env files is changed (nodejs)', async () => { | ||
// If "should update server components after navigating to a page with a different runtime" failed, the dev server is in a corrupted state. | ||
// Restart fixes this. | ||
await next.stop() | ||
await next.start() | ||
|
||
const envContent = await next.readFile(envFile) | ||
const browser = await next.browser('/env/node') | ||
expect(await browser.elementByCss('p').text()).toBe('mac') | ||
|
@@ -91,6 +172,10 @@ describe(`app-dir-hmr`, () => { | |
}) | ||
|
||
it('should update server components pages when env files is changed (edge)', async () => { | ||
// Restart to work around a bug highlighted in the flakiness of "should update server components after navigating to a page with a different runtime" | ||
await next.stop() | ||
await next.start() | ||
|
||
const envContent = await next.readFile(envFile) | ||
const browser = await next.browser('/env/edge') | ||
expect(await browser.elementByCss('p').text()).toBe('mac') | ||
|
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is the essence of the repro:
.env
fileWhat happens next varies with Webpack, Turbopack and PPR.