mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
Aurora ScharffandGitHub
18d2e2da5f
## Summary
The instant / blocking-prerender insight console errors printed a docs
URL under each fix option (two or three anchors per message). This
collapses them to a single `Learn more:` link at the end of each
message, while keeping the `[stream]`/`[cache]`/`[block]` fix-option
labels. It restores the single-link format these builders originally
shipped with.
**Before:**
```
Ways to fix this:
- [stream] Provide a placeholder with `<Suspense fallback={...}>` around the data access
https://nextjs.org/docs/messages/blocking-prerender-runtime#wrap-in-or-move-into-suspense
- [block] Set `export const instant = false` to allow a blocking route
https://nextjs.org/docs/messages/blocking-prerender-runtime#allow-blocking-route
```
**After:**
```
Ways to fix this:
- [stream] Provide a placeholder with `<Suspense fallback={...}>` around the data access
- [block] Set `export const instant = false` to allow a blocking route
Learn more: https://nextjs.org/docs/messages/blocking-prerender-runtime
```
Covers all 16 insight-kind errors, across `blocking-route-messages.ts`,
`sync-io-messages.ts`, `dynamic-rendering-utils.ts`, and
`instant-messages.ts`.
Because the dev overlay classified these errors by the `#`-anchored docs
URL, `getBlockingRouteErrorDetails` is updated to match the anchor-less
`Learn more:` URL. Console-message snapshots and the guidance-data
extraction test are updated to the new format. The dev-overlay fix-card
data (`instant-guidance-data.ts`) keeps its per-card links, since those
are the overlay UI rather than the console message.
## Verification
- `pnpm --filter=next types`
- Snapshots regenerated with `jest -u` for the affected suites
<!-- NEXT_JS_LLM -->
126 lines
3.9 KiB
TypeScript
126 lines
3.9 KiB
TypeScript
import { nextTestSetup } from 'e2e-utils'
|
|
|
|
describe('prefetch-true-partial-warning', () => {
|
|
const { next } = nextTestSetup({
|
|
files: __dirname,
|
|
})
|
|
|
|
// A stable substring of the dev warning emitted from navigation.ts.
|
|
const WARNING = 'Next.js encountered dynamic data during prefetching'
|
|
|
|
async function navigateViaAccordion(
|
|
browser: Awaited<ReturnType<typeof next.browser>>,
|
|
href: string
|
|
) {
|
|
const toggle = await browser.elementByCss(
|
|
`input[data-link-accordion="${href}"]`
|
|
)
|
|
await toggle.click()
|
|
const link = await browser.elementByCss(`a[href="${href}"]`)
|
|
await link.click()
|
|
}
|
|
|
|
it('warns when a prefetch={true} link navigates to a route without partial prefetching', async () => {
|
|
const browser = await next.browser('/')
|
|
await navigateViaAccordion(browser, '/default-route')
|
|
|
|
// Wait for the navigation to fully complete (dynamic content rendered).
|
|
// The warning fires synchronously at the start of the navigation, so by
|
|
// now it must already be in the console log.
|
|
await browser.waitForElementByCss('#dynamic-content')
|
|
expect(await browser.elementById('dynamic-content').text()).toBe(
|
|
'Default dynamic'
|
|
)
|
|
|
|
await expect(browser).toDisplayCollapsedRedbox(`
|
|
{
|
|
"code": "E1435",
|
|
"description": "Next.js encountered dynamic data during prefetching.",
|
|
"environmentLabel": null,
|
|
"label": "Instant",
|
|
"source": "components/link-accordion.tsx (25:9) @ LinkAccordion
|
|
> 25 | <Link href={href} prefetch={prefetch}>
|
|
| ^",
|
|
"stack": [
|
|
"LinkAccordion components/link-accordion.tsx (25:9)",
|
|
"Page app/page.tsx (10:11)",
|
|
],
|
|
}
|
|
`)
|
|
expect(await browser.log()).toContainEqual(
|
|
expect.objectContaining({
|
|
source: 'error',
|
|
message: expect.stringContaining(WARNING),
|
|
})
|
|
)
|
|
})
|
|
|
|
it('does not warn when the target route opts into partial prefetching', async () => {
|
|
const browser = await next.browser('/')
|
|
await navigateViaAccordion(browser, '/partial-route')
|
|
|
|
await browser.waitForElementByCss('#dynamic-content')
|
|
expect(await browser.elementById('dynamic-content').text()).toBe(
|
|
'Partial dynamic'
|
|
)
|
|
|
|
expect(await browser.log()).not.toContainEqual(
|
|
expect.objectContaining({
|
|
source: 'error',
|
|
message: expect.stringContaining(WARNING),
|
|
})
|
|
)
|
|
})
|
|
|
|
it('does not warn for a default (non-full) prefetch link', async () => {
|
|
const browser = await next.browser('/')
|
|
await navigateViaAccordion(browser, '/control-route')
|
|
|
|
await browser.waitForElementByCss('#dynamic-content')
|
|
expect(await browser.elementById('dynamic-content').text()).toBe(
|
|
'Control dynamic'
|
|
)
|
|
|
|
expect(await browser.log()).not.toContainEqual(
|
|
expect.objectContaining({
|
|
source: 'error',
|
|
message: expect.stringContaining(WARNING),
|
|
})
|
|
)
|
|
})
|
|
|
|
it('does not warn when the target page exports instant = false', async () => {
|
|
const browser = await next.browser('/')
|
|
await navigateViaAccordion(browser, '/instant-false-route')
|
|
|
|
await browser.waitForElementByCss('#dynamic-content')
|
|
expect(await browser.elementById('dynamic-content').text()).toBe(
|
|
'Instant-false dynamic'
|
|
)
|
|
|
|
expect(await browser.log()).not.toContainEqual(
|
|
expect.objectContaining({
|
|
source: 'error',
|
|
message: expect.stringContaining(WARNING),
|
|
})
|
|
)
|
|
})
|
|
|
|
it('does not warn when instant = false is set on a parent layout', async () => {
|
|
const browser = await next.browser('/')
|
|
await navigateViaAccordion(browser, '/instant-false-layout')
|
|
|
|
await browser.waitForElementByCss('#dynamic-content')
|
|
expect(await browser.elementById('dynamic-content').text()).toBe(
|
|
'Layout-instant-false dynamic'
|
|
)
|
|
|
|
expect(await browser.log()).not.toContainEqual(
|
|
expect.objectContaining({
|
|
source: 'error',
|
|
message: expect.stringContaining(WARNING),
|
|
})
|
|
)
|
|
})
|
|
})
|