Skip to content
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

Failing test for client navigation to layout with React.Suspense #74552

Draft
wants to merge 3 commits into
base: canary
Choose a base branch
from

Conversation

eps1lon
Copy link
Member

@eps1lon eps1lon commented Jan 6, 2025

Failing test for #72060

Fixed when experimental.ppr is enabled. Not directly tied to React's Experimental release channel since it still fails with experimental.taint.

@ijjk ijjk added created-by: Next.js team PRs by the Next.js team. tests labels Jan 6, 2025
@ijjk
Copy link
Member

ijjk commented Jan 6, 2025

Tests Passed

@ijjk
Copy link
Member

ijjk commented Jan 6, 2025

Stats from current PR

Default Build (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
buildDuration 42.2s 39.4s N/A
buildDurationCached 39s 30.4s N/A
nodeModulesSize 417 MB 417 MB ⚠️ +818 B
nextStartRea..uration (ms) 1.1s 860ms N/A
Client Bundles (main, webpack)
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
1187-HASH.js gzip 52.6 kB 52.6 kB N/A
8276.HASH.js gzip 169 B 168 B N/A
8377-HASH.js gzip 5.44 kB 5.44 kB N/A
bccd1874-HASH.js gzip 53 kB 53 kB N/A
framework-HASH.js gzip 57.5 kB 57.5 kB N/A
main-app-HASH.js gzip 233 B 235 B N/A
main-HASH.js gzip 34.1 kB 34.1 kB N/A
webpack-HASH.js gzip 1.71 kB 1.71 kB N/A
Overall change 0 B 0 B
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
polyfills-HASH.js gzip 39.4 kB 39.4 kB
Overall change 39.4 kB 39.4 kB
Client Pages
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
_app-HASH.js gzip 193 B 193 B
_error-HASH.js gzip 193 B 193 B
amp-HASH.js gzip 512 B 510 B N/A
css-HASH.js gzip 343 B 342 B N/A
dynamic-HASH.js gzip 1.84 kB 1.84 kB
edge-ssr-HASH.js gzip 265 B 265 B
head-HASH.js gzip 363 B 362 B N/A
hooks-HASH.js gzip 393 B 392 B N/A
image-HASH.js gzip 4.57 kB 4.57 kB N/A
index-HASH.js gzip 268 B 268 B
link-HASH.js gzip 2.35 kB 2.34 kB N/A
routerDirect..HASH.js gzip 328 B 328 B
script-HASH.js gzip 397 B 397 B
withRouter-HASH.js gzip 323 B 326 B N/A
1afbb74e6ecf..834.css gzip 106 B 106 B
Overall change 3.59 kB 3.59 kB
Client Build Manifests
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
_buildManifest.js gzip 749 B 747 B N/A
Overall change 0 B 0 B
Rendered Page Sizes
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
index.html gzip 523 B 523 B
link.html gzip 539 B 537 B N/A
withRouter.html gzip 519 B 520 B N/A
Overall change 523 B 523 B
Edge SSR bundle Size
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
edge-ssr.js gzip 128 kB 128 kB N/A
page.js gzip 206 kB 206 kB N/A
Overall change 0 B 0 B
Middleware size
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
middleware-b..fest.js gzip 669 B 669 B
middleware-r..fest.js gzip 155 B 156 B N/A
middleware.js gzip 31.2 kB 31.2 kB N/A
edge-runtime..pack.js gzip 844 B 844 B
Overall change 1.51 kB 1.51 kB
Next Runtimes
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
274-experime...dev.js gzip 322 B 322 B
274.runtime.dev.js gzip 314 B 314 B
app-page-exp...dev.js gzip 364 kB 364 kB
app-page-exp..prod.js gzip 129 kB 129 kB
app-page-tur..prod.js gzip 142 kB 142 kB
app-page-tur..prod.js gzip 138 kB 138 kB
app-page.run...dev.js gzip 352 kB 352 kB
app-page.run..prod.js gzip 125 kB 125 kB
app-route-ex...dev.js gzip 37.5 kB 37.5 kB
app-route-ex..prod.js gzip 25.6 kB 25.6 kB
app-route-tu..prod.js gzip 25.6 kB 25.6 kB
app-route-tu..prod.js gzip 25.4 kB 25.4 kB
app-route.ru...dev.js gzip 39.2 kB 39.2 kB
app-route.ru..prod.js gzip 25.4 kB 25.4 kB
pages-api-tu..prod.js gzip 9.69 kB 9.69 kB
pages-api.ru...dev.js gzip 11.6 kB 11.6 kB
pages-api.ru..prod.js gzip 9.68 kB 9.68 kB
pages-turbo...prod.js gzip 21.7 kB 21.7 kB
pages.runtim...dev.js gzip 27.5 kB 27.5 kB
pages.runtim..prod.js gzip 21.7 kB 21.7 kB
server.runti..prod.js gzip 916 kB 916 kB
Overall change 2.45 MB 2.45 MB
build cache Overall increase ⚠️
vercel/next.js canary vercel/next.js sebbie/layout-suspense Change
0.pack gzip 2.09 MB 2.09 MB ⚠️ +1.35 kB
index.pack gzip 75.3 kB 74.3 kB N/A
Overall change 2.09 MB 2.09 MB ⚠️ +1.35 kB
Diff details
Diff for 1187-HASH.js

Diff too large to display

Diff for main-HASH.js

Diff too large to display

Commit: cbf30f5

@eps1lon eps1lon force-pushed the sebbie/layout-suspense branch from 1d330e8 to 45c5f25 Compare January 6, 2025 15:20
@eps1lon eps1lon changed the base branch from canary to sebbie/01-06-test_utils_include_origin_of_failed_browser._in_stack January 6, 2025 15:20
Copy link
Member Author

eps1lon commented Jan 6, 2025

@eps1lon eps1lon force-pushed the sebbie/layout-suspense branch from 45c5f25 to ae53c05 Compare January 6, 2025 15:32
@eps1lon eps1lon changed the base branch from sebbie/01-06-test_utils_include_origin_of_failed_browser._in_stack to graphite-base/74552 January 6, 2025 18:28
@eps1lon eps1lon force-pushed the graphite-base/74552 branch from 03d9168 to c94fdef Compare January 6, 2025 18:29
@eps1lon eps1lon force-pushed the sebbie/layout-suspense branch from ae53c05 to 65c97fa Compare January 6, 2025 18:29
@eps1lon eps1lon changed the base branch from graphite-base/74552 to canary January 6, 2025 18:29
@eps1lon eps1lon force-pushed the sebbie/layout-suspense branch 2 times, most recently from b7da77d to 9f40afe Compare January 7, 2025 18:26
Comment on lines 21 to 22
<Suspense fallback={<h1>Loading...</h1>}>
{props.children}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Once we move the page i.e. props.children outside of the Suspense boundary, we correctly show the resolved boundary after client navigation.

})

it('resolves data after client navigation to a nested layout with Suspense', async () => {
const browser = await next.browser('/nested')
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Landing on the faulty page is critical.


await browser.waitForElementByCss('a[href="/nested"]').click()

await browser.waitForElementByCss('[data-testid="nested-resolved"]')
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suspense boundary hangs indefinitely unless experimental.ppr is enabled.

@eps1lon eps1lon force-pushed the sebbie/layout-suspense branch from 9f40afe to a918a3b Compare January 7, 2025 20:07
@ztanner ztanner force-pushed the sebbie/layout-suspense branch from 2a20466 to cbf30f5 Compare January 7, 2025 20:54
@ijjk ijjk added the type: next label Jan 7, 2025
Comment on lines +393 to +394
// Suspend while waiting for lazyData to resolve
use(lazyData)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is the fix I added, though it's strange that this was necessary and feels like a potential React bug

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants