Files
next.js/test/development/acceptance/ReactRefreshLogBox-app-doc.test.ts
Arian Tron 61f56f997c
Some checks failed
Test examples / Test Examples (20) (push) Has been cancelled
Test examples / Test Examples (22) (push) Has been cancelled
Lock Threads / action (push) Has been cancelled
Trigger Release / start (push) Has been cancelled
Stale issue handler / stale (push) Has been cancelled
Update Font Data / create-pull-request (push) Has been cancelled
build-and-deploy / deploy-target (push) Has been cancelled
build-and-deploy / build (push) Has been cancelled
build-and-deploy / stable - aarch64-unknown-linux-musl - node@16 (push) Has been cancelled
build-and-deploy / stable - x86_64-unknown-linux-musl - node@16 (push) Has been cancelled
build-and-deploy / stable - aarch64-unknown-linux-gnu - node@16 (push) Has been cancelled
build-and-deploy / stable - x86_64-unknown-linux-gnu - node@16 (push) Has been cancelled
build-and-deploy / stable - aarch64-pc-windows-msvc - node@16 (push) Has been cancelled
build-and-deploy / stable - x86_64-pc-windows-msvc - node@16 (push) Has been cancelled
build-and-deploy / stable - aarch64-apple-darwin - node@16 (push) Has been cancelled
build-and-deploy / stable - x86_64-apple-darwin - node@16 (push) Has been cancelled
build-and-deploy / build-wasm (nodejs) (push) Has been cancelled
build-and-deploy / build-wasm (web) (push) Has been cancelled
build-and-deploy / Deploy preview tarball (push) Has been cancelled
build-and-deploy / Potentially publish release (push) Has been cancelled
build-and-deploy / publish-turbopack-npm-packages (push) Has been cancelled
build-and-deploy / Deploy examples (push) Has been cancelled
build-and-deploy / thank you, build (push) Has been cancelled
build-and-deploy / Upload Turbopack Bytesize metrics to Datadog (push) Has been cancelled
Rspack Next.js development integration tests / Rspack integration tests (push) Has been cancelled
Rspack Next.js production integration tests / Rspack integration tests (push) Has been cancelled
Turbopack Next.js development integration tests / Next.js integration tests (push) Has been cancelled
Turbopack Next.js production integration tests / Next.js integration tests (push) Has been cancelled
Update Rspack test manifest / Update and upload Rspack development test manifest (push) Has been cancelled
Update Rspack test manifest / Update and upload Rspack production test manifest (push) Has been cancelled
Upload bundler test manifests to areweturboyet.com / Upload test results (push) Has been cancelled
Update React / create-pull-request (push) Has been cancelled
test-e2e-project-reset-cron / reset-test-project (push) Has been cancelled
Notify about the top 15 issues/PRs/feature requests (most reacted) in the last 90 days / run (push) Has been cancelled
first commit
2026-03-10 19:37:31 +03:30

318 lines
9.4 KiB
TypeScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import { createSandbox } from 'development-sandbox'
import { FileRef, nextTestSetup } from 'e2e-utils'
import { outdent } from 'outdent'
import path from 'path'
const isRspack = process.env.NEXT_RSPACK !== undefined
describe('ReactRefreshLogBox _app _document', () => {
const { isTurbopack, next } = nextTestSetup({
files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
skipStart: true,
})
test('empty _app shows logbox', async () => {
await using sandbox = await createSandbox(
next,
new Map([['pages/_app.js', ``]])
)
const { browser, session } = sandbox
await expect(browser).toDisplayRedbox(`
{
"code": "E394",
"description": "The default export is not a React Component in page: "/_app"",
"environmentLabel": null,
"label": "Runtime Error",
"source": null,
"stack": [],
}
`)
await session.patch(
'pages/_app.js',
outdent`
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />;
}
export default MyApp
`
)
await session.waitForNoRedbox()
})
test('empty _document shows logbox', async () => {
await using sandbox = await createSandbox(
next,
new Map([['pages/_document.js', ``]])
)
const { browser, session } = sandbox
await expect(browser).toDisplayRedbox(`
{
"code": "E394",
"description": "The default export is not a React Component in page: "/_document"",
"environmentLabel": null,
"label": "Runtime Error",
"source": null,
"stack": [],
}
`)
await session.patch(
'pages/_document.js',
outdent`
import Document, { Html, Head, Main, NextScript } from 'next/document'
class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx)
return { ...initialProps }
}
render() {
return (
<Html>
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
}
export default MyDocument
`
)
await session.waitForNoRedbox()
})
test('_app syntax error shows logbox', async () => {
await using sandbox = await createSandbox(
next,
new Map([
[
'pages/_app.js',
outdent`
function MyApp({ Component, pageProps }) {
return <<Component {...pageProps} />;
}
export default MyApp
`,
],
])
)
const { browser, session } = sandbox
if (isTurbopack) {
await expect(browser).toDisplayRedbox(`
{
"description": "Expression expected",
"environmentLabel": null,
"label": "Build Error",
"source": "./pages/_app.js (2:10)
Expression expected
> 2 | return <<Component {...pageProps} />;
| ^^",
"stack": [],
}
`)
} else if (isRspack) {
await expect({ browser, next }).toDisplayRedbox(`
{
"description": " ╰─▶ × Error: x Expression expected",
"environmentLabel": null,
"label": "Build Error",
"source": "./pages/_app.js
╰─▶ × Error: x Expression expected
│ ,-[2:1]
│ 1 | function MyApp({ Component, pageProps }) {
│ 2 | return <<Component {...pageProps} />;
│ : ^^
│ 3 | }
│ 4 | export default MyApp
\`----
│ x Expected ';', got '{'
│ ,-[2:1]
│ 1 | function MyApp({ Component, pageProps }) {
│ 2 | return <<Component {...pageProps} />;
│ : ^
│ 3 | }
│ 4 | export default MyApp
\`----
│ Caused by:
│ Syntax Error",
"stack": [],
}
`)
} else {
await expect(browser).toDisplayRedbox(`
{
"description": " x Expression expected",
"environmentLabel": null,
"label": "Build Error",
"source": "./pages/_app.js
Error: x Expression expected
,-[2:1]
1 | function MyApp({ Component, pageProps }) {
2 | return <<Component {...pageProps} />;
: ^^
3 | }
4 | export default MyApp
\`----
x Expected ';', got '{'
,-[2:1]
1 | function MyApp({ Component, pageProps }) {
2 | return <<Component {...pageProps} />;
: ^
3 | }
4 | export default MyApp
\`----
Caused by:
Syntax Error",
"stack": [],
}
`)
}
await session.patch(
'pages/_app.js',
outdent`
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />;
}
export default MyApp
`
)
await session.waitForNoRedbox()
})
test('_document syntax error shows logbox', async () => {
await using sandbox = await createSandbox(
next,
new Map([
[
'pages/_document.js',
outdent`
import Document, { Html, Head, Main, NextScript } from 'next/document'
class MyDocument extends Document {{
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx)
return { ...initialProps }
}
render() {
return (
<Html>
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
}
export default MyDocument
`,
],
])
)
const { browser, session } = sandbox
if (isTurbopack) {
await expect(browser).toDisplayRedbox(`
{
"description": "Unexpected token \`{\`. Expected identifier, string literal, numeric literal or [ for the computed key",
"environmentLabel": null,
"label": "Build Error",
"source": "./pages/_document.js (3:36)
Unexpected token \`{\`. Expected identifier, string literal, numeric literal or [ for the computed key
> 3 | class MyDocument extends Document {{
| ^",
"stack": [],
}
`)
} else if (isRspack) {
await expect({ browser, next }).toDisplayRedbox(`
{
"description": " ╰─▶ × Error: x Unexpected token \`{\`. Expected identifier, string literal, numeric literal or [ for the computed key",
"environmentLabel": null,
"label": "Build Error",
"source": "./pages/_document.js
╰─▶ × Error: x Unexpected token \`{\`. Expected identifier, string literal, numeric literal or [ for the computed key
│ ,-[3:1]
│ 1 | import Document, { Html, Head, Main, NextScript } from 'next/document'
│ 2 |
│ 3 | class MyDocument extends Document {{
│ : ^
│ 4 | static async getInitialProps(ctx) {
│ 5 | const initialProps = await Document.getInitialProps(ctx)
│ 6 | return { ...initialProps }
\`----
│ Caused by:
│ Syntax Error",
"stack": [],
}
`)
} else {
await expect(browser).toDisplayRedbox(`
{
"description": " x Unexpected token \`{\`. Expected identifier, string literal, numeric literal or [ for the computed key",
"environmentLabel": null,
"label": "Build Error",
"source": "./pages/_document.js
Error: x Unexpected token \`{\`. Expected identifier, string literal, numeric literal or [ for the computed key
,-[3:1]
1 | import Document, { Html, Head, Main, NextScript } from 'next/document'
2 |
3 | class MyDocument extends Document {{
: ^
4 | static async getInitialProps(ctx) {
5 | const initialProps = await Document.getInitialProps(ctx)
6 | return { ...initialProps }
\`----
Caused by:
Syntax Error",
"stack": [],
}
`)
}
await session.patch(
'pages/_document.js',
outdent`
import Document, { Html, Head, Main, NextScript } from 'next/document'
class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx)
return { ...initialProps }
}
render() {
return (
<Html>
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
}
export default MyDocument
`
)
await session.waitForNoRedbox()
})
})