mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
Redesign the https://github.com/vercel/next.js/pull/87988 error pages to be more aligned with Next.js aesthetic, along with copy to be sharper. | Client | Server | |--------|--------| | <img width="4992" height="2830" alt="CleanShot 2026-03-03 at 17 26 07@2x" src="https://github.com/user-attachments/assets/f42bee3e-2ce8-44dc-9e26-79b81cf965d8" /> | <img width="4992" height="2830" alt="CleanShot 2026-03-03 at 17 23 38@2x" src="https://github.com/user-attachments/assets/19a596c6-6da7-4a42-9b53-16e3c2e6f867" /> | | <img width="4992" height="2830" alt="CleanShot 2026-03-03 at 17 25 22@2x" src="https://github.com/user-attachments/assets/a3075d79-c76a-4fbf-af6e-d4a44f1434eb" /> | <img width="4992" height="2830" alt="CleanShot 2026-03-03 at 17 24 17@2x" src="https://github.com/user-attachments/assets/5811cc98-f8e4-4451-bf9c-501548292245" /> | --------- Co-authored-by: Jimmy Lai <[email protected]> Co-authored-by: Tim Neutkens <[email protected]>
68 lines
2.2 KiB
TypeScript
68 lines
2.2 KiB
TypeScript
import { nextTestSetup } from 'e2e-utils'
|
|
import webdriver from 'next-webdriver'
|
|
|
|
describe('next-link', () => {
|
|
const { skipped, next, isNextDev } = nextTestSetup({
|
|
files: __dirname,
|
|
skipDeployment: true,
|
|
})
|
|
|
|
if (skipped) return
|
|
|
|
it('errors on invalid href', async () => {
|
|
const browser = await webdriver(next.appPort, '/invalid-href')
|
|
|
|
if (isNextDev) {
|
|
await expect(browser).toDisplayRedbox(`
|
|
{
|
|
"code": "E319",
|
|
"description": "Failed prop type: The prop \`href\` expects a \`string\` or \`object\` in \`<Link>\`, but got \`undefined\` instead.
|
|
Open your browser's console to view the Component stack trace.",
|
|
"environmentLabel": null,
|
|
"label": "Runtime Error",
|
|
"source": "app/invalid-href/page.js (6:10) @ Hello
|
|
> 6 | return <Link>Hello, Dave!</Link>
|
|
| ^",
|
|
"stack": [
|
|
"Hello app/invalid-href/page.js (6:10)",
|
|
],
|
|
}
|
|
`)
|
|
}
|
|
// Client errors show "This page couldn\u2019t load"
|
|
expect(await browser.elementByCss('body').text()).toContain(
|
|
'This page couldn\u2019t load'
|
|
)
|
|
})
|
|
|
|
it('invalid `prefetch` causes runtime error (dev-only)', async () => {
|
|
const browser = await webdriver(next.appPort, '/invalid-prefetch')
|
|
|
|
if (isNextDev) {
|
|
await expect(browser).toDisplayRedbox(`
|
|
{
|
|
"code": "E319",
|
|
"description": "Failed prop type: The prop \`prefetch\` expects a \`boolean | "auto"\` in \`<Link>\`, but got \`string\` instead.
|
|
Open your browser's console to view the Component stack trace.",
|
|
"environmentLabel": null,
|
|
"label": "Runtime Error",
|
|
"source": "app/invalid-prefetch/page.js (7:5) @ Hello
|
|
> 7 | <Link prefetch="unknown" href="https://nextjs.org/">
|
|
| ^",
|
|
"stack": [
|
|
"Hello app/invalid-prefetch/page.js (7:5)",
|
|
],
|
|
}
|
|
`)
|
|
// Client errors show "This page couldn\u2019t load"
|
|
expect(await browser.elementByCss('body').text()).toContain(
|
|
'This page couldn\u2019t load'
|
|
)
|
|
} else {
|
|
expect(await browser.elementByCss('body').text()).toMatchInlineSnapshot(
|
|
`"Link with unknown \`prefetch\` renders in prod."`
|
|
)
|
|
}
|
|
})
|
|
})
|