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
318 lines
9.4 KiB
TypeScript
318 lines
9.4 KiB
TypeScript
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()
|
||
})
|
||
})
|