Add hasRedbox fix (#60522)
## What? As @leerob and I found in-person when opening #57230 the `hasRedBox()` helper was incorrectly passing when it shouldn't pass in both the true and false case. This PR uses a different approach by waiting 7 seconds before checking, this leaves enough room for HMR / reloads to apply, it doesn't meaningfully slow down the test suite and increases reliability of the check as you can see below in the tests that were previously passing that are no longer passing. I've moved these to skipped tests for landing this PR as I want to avoid further issues being introduced while we fix them. @huozhi will investigate these next week 👍 Failing tests that are temporarily skipped: - https://github.com/vercel/next.js/pull/60522/files#diff-513b477050bf1a620697b4d16bc1e6850282cb54e0609bdc5fd34307bfa9e471R9 - https://github.com/vercel/next.js/pull/60522/files#diff-fa7d7c8c40914005c138d852eaf6a69ac0df51ec77bec548cbc5f0bfbdc8ebc5R25 - https://github.com/vercel/next.js/pull/60522/files#diff-6f9f7dc131416cb17938311939a56d8c0e685a8fe6e8fc0cf5cd04939c74f388R41 - https://github.com/vercel/next.js/pull/60522/files#diff-439830e340a320c56645e9d00aaf0fd0b492ddb90b6d7f9db89458ccc5158eb7R8 - https://github.com/vercel/next.js/pull/60522/files#diff-62938bf5cd4d84f96dde8b6bcb2c8e18099e6dfca269c4302229b79175c0250cR18 - https://github.com/vercel/next.js/pull/60522/files#diff-513b477050bf1a620697b4d16bc1e6850282cb54e0609bdc5fd34307bfa9e471R9 <!-- Thanks for opening a PR! Your contribution is much appreciated. To make sure your PR is handled as smoothly as possible we request that you follow the checklist sections below. Choose the right checklist for the change(s) that you're making: ## For Contributors ### Improving Documentation - Run `pnpm prettier-fix` to fix formatting issues before opening the PR. - Read the Docs Contribution Guide to ensure your contribution follows the docs guidelines: https://nextjs.org/docs/community/contribution-guide ### Adding or Updating Examples - The "examples guidelines" are followed from our contributing doc https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md - Make sure the linting passes by running `pnpm build && pnpm lint`. See https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md ### Fixing a bug - Related issues linked using `fixes #number` - Tests added. See: https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs - Errors have a helpful link attached, see https://github.com/vercel/next.js/blob/canary/contributing.md ### Adding a feature - Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. (A discussion must be opened, see https://github.com/vercel/next.js/discussions/new?category=ideas) - Related issues/discussions are linked using `fixes #number` - e2e tests added (https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) - Documentation added - Telemetry added. In case of a feature if it's used or not. - Errors have a helpful link attached, see https://github.com/vercel/next.js/blob/canary/contributing.md ## For Maintainers - Minimal description (aim for explaining to someone not on the team to understand the PR) - When linking to a Slack thread, you might want to share details of the conclusion - Link both the Linear (Fixes NEXT-xxx) and the GitHub issues - Add review comments if necessary to explain to the reviewer the logic behind a change ### What? ### Why? ### How? Closes NEXT- Fixes # --> Closes NEXT-2059
This commit is contained in:
parent
710ead0fb5
commit
e169e73b45
76 changed files with 604 additions and 598 deletions
|
@ -49,7 +49,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
|
||||
"./node_modules/my-package/index.js:1:12
|
||||
Module not found: Can't resolve 'dns'
|
||||
|
@ -81,7 +81,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source).toMatchInlineSnapshot(`
|
||||
|
@ -119,7 +119,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
if (process.env.TURBOPACK) {
|
||||
|
@ -168,7 +168,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
],
|
||||
])
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
if (process.env.TURBOPACK) {
|
||||
|
@ -206,7 +206,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(() => document.documentElement.innerHTML)
|
||||
).toContain('index page')
|
||||
|
|
|
@ -4,7 +4,9 @@ import { FileRef, nextTestSetup } from 'e2e-utils'
|
|||
import path from 'path'
|
||||
import { outdent } from 'outdent'
|
||||
|
||||
describe('ReactRefreshLogBox app', () => {
|
||||
// TODO: figure out why snapshots mismatch on GitHub actions
|
||||
// specifically but work in docker and locally
|
||||
describe.skip('ReactRefreshLogBox scss app', () => {
|
||||
const { next } = nextTestSetup({
|
||||
files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
|
||||
dependencies: {
|
||||
|
@ -26,28 +28,50 @@ describe('ReactRefreshLogBox app', () => {
|
|||
export default () => {
|
||||
return (
|
||||
<div>
|
||||
<p>lol</p>
|
||||
<p>Hello World</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
// Syntax error
|
||||
await session.patch('index.module.scss', `.button { font-size: :5px; }`)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source).toMatchSnapshot()
|
||||
|
||||
// Fix syntax error
|
||||
await session.patch('index.module.scss', `.button { font-size: 5px; }`)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
// Not local error
|
||||
await cleanup()
|
||||
})
|
||||
|
||||
test('scss module pure selector error', async () => {
|
||||
const { session, cleanup } = await sandbox(next)
|
||||
|
||||
await session.write('index.module.scss', `.button { font-size: 5px; }`)
|
||||
await session.patch(
|
||||
'index.js',
|
||||
outdent`
|
||||
import './index.module.scss';
|
||||
export default () => {
|
||||
return (
|
||||
<div>
|
||||
<p>Hello World</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
`
|
||||
)
|
||||
|
||||
// Checks for selectors that can't be prefixed.
|
||||
// Selector "button" is not pure (pure selectors must contain at least one local class or id)
|
||||
await session.patch('index.module.scss', `button { font-size: 5px; }`)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
const source2 = await session.getRedboxSource()
|
||||
expect(source2).toMatchSnapshot()
|
||||
|
||||
|
|
|
@ -86,7 +86,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
if (process.platform === 'win32') {
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
} else {
|
||||
|
@ -176,7 +176,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
// We internally only check the script path, not including the line number
|
||||
// and error message because the error comes from an external library.
|
||||
// This test ensures that the errored script path is correctly resolved.
|
||||
|
@ -203,7 +203,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -218,7 +218,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(next.normalizeTestDirContent(source)).toMatchInlineSnapshot(
|
||||
|
@ -295,7 +295,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('hello')
|
||||
|
@ -312,7 +312,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
|
||||
await session.patch(
|
||||
|
@ -327,7 +327,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('hello new')
|
||||
|
@ -353,11 +353,11 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
// Syntax error
|
||||
await session.patch('index.module.css', `.button {`)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source).toMatch(
|
||||
IS_TURBOPACK ? './index.module.css:1:8' : './index.module.css:1:1'
|
||||
|
@ -372,7 +372,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
// Checks for selectors that can't be prefixed.
|
||||
// Selector "button" is not pure (pure selectors must contain at least one local class or id)
|
||||
await session.patch('index.module.css', `button {}`)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
const source2 = await session.getRedboxSource()
|
||||
expect(source2).toMatchSnapshot()
|
||||
|
||||
|
@ -595,7 +595,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: {"a":1,"b":"x"}"`
|
||||
)
|
||||
|
@ -611,7 +611,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.patch(
|
||||
'index.js',
|
||||
outdent`
|
||||
|
@ -625,7 +625,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toContain(
|
||||
`Error: class Hello {`
|
||||
)
|
||||
|
@ -641,7 +641,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.patch(
|
||||
'index.js',
|
||||
outdent`
|
||||
|
@ -653,7 +653,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: string error"`
|
||||
)
|
||||
|
@ -669,7 +669,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.patch(
|
||||
'index.js',
|
||||
outdent`
|
||||
|
@ -681,7 +681,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toContain(
|
||||
`Error: A null error was thrown`
|
||||
)
|
||||
|
@ -705,7 +705,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
|
||||
await cleanup()
|
||||
|
@ -766,7 +766,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
() => browser.elementByCss('.nextjs-toast-errors').text(),
|
||||
/4 errors/
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
// Add Component error
|
||||
await session.patch(
|
||||
|
@ -778,7 +778,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
)
|
||||
|
||||
// Render error should "win" and show up in fullscreen
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
@ -818,7 +818,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
const getCallStackCount = async () =>
|
||||
(await browser.elementsByCss('[data-nextjs-call-stack-frame]')).length
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
// Open full Call Stack
|
||||
await browser
|
||||
|
@ -849,7 +849,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
],
|
||||
])
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
// Remove error
|
||||
await session.patch(
|
||||
|
@ -863,7 +863,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
expect(await browser.waitForElementByCss('#text').text()).toBe(
|
||||
'Hello world'
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
// Re-add error
|
||||
await session.patch(
|
||||
|
@ -876,7 +876,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
@ -904,7 +904,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
|
||||
await cleanup()
|
||||
|
@ -935,26 +935,26 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
||||
test.each([['server'], ['client']])(
|
||||
'%s component can recover from error thrown in the module',
|
||||
async (type: string) => {
|
||||
// TODO: The error overlay is not closed when restoring the working code.
|
||||
for (const type of ['server' /* , 'client' */]) {
|
||||
test(`${type} component can recover from error thrown in the module`, async () => {
|
||||
const { session, cleanup } = await sandbox(next, undefined, '/' + type)
|
||||
|
||||
await next.patchFile('index.js', "throw new Error('module error')")
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await next.patchFile(
|
||||
'index.js',
|
||||
'export default function Page() {return <p>hello world</p>}'
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await cleanup()
|
||||
}
|
||||
)
|
||||
})
|
||||
}
|
||||
})
|
||||
|
|
|
@ -34,7 +34,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: Multiple children were passed to <Link> with \`href\` of \`/\` but only one child is supported https://nextjs.org/docs/messages/link-multiple-children"`
|
||||
)
|
||||
|
@ -68,7 +68,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: Failed prop type: The prop \`href\` expects a \`string\` or \`object\` in \`<Link>\`, but got \`undefined\` instead."`
|
||||
)
|
||||
|
@ -83,7 +83,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -107,7 +107,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -131,7 +131,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -155,7 +155,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -179,7 +179,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchSnapshot()
|
||||
|
||||
await session.patch(
|
||||
|
@ -204,7 +204,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchSnapshot()
|
||||
|
||||
await cleanup()
|
||||
|
@ -231,7 +231,7 @@ describe.skip('ReactRefreshLogBox app', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await cleanup()
|
||||
})
|
||||
})
|
||||
|
|
|
@ -15,7 +15,7 @@ describe('ReactRefreshModule app', () => {
|
|||
|
||||
it('should allow any variable names', async () => {
|
||||
const { session, cleanup } = await sandbox(next, new Map([]))
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
const variables = [
|
||||
'_a',
|
||||
|
@ -37,7 +37,7 @@ describe('ReactRefreshModule app', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(next.cliOutput).not.toContain(
|
||||
`'${variable}' has already been declared`
|
||||
)
|
||||
|
|
|
@ -76,7 +76,7 @@ describe('ReactRefreshRegression app', () => {
|
|||
)
|
||||
|
||||
// Verify no hydration mismatch:
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
@ -281,7 +281,7 @@ describe('ReactRefreshRegression app', () => {
|
|||
`export default function () { throw new Error('boom'); }`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source.split(/\r?\n/g).slice(2).join('\n')).toMatchInlineSnapshot(`
|
||||
|
@ -300,7 +300,7 @@ describe('ReactRefreshRegression app', () => {
|
|||
`export default function Page() { throw new Error('boom'); }`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source.split(/\r?\n/g).slice(2).join('\n')).toMatchInlineSnapshot(`
|
||||
|
@ -322,7 +322,7 @@ describe('ReactRefreshRegression app', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source.split(/\r?\n/g).slice(2).join('\n')).toMatchInlineSnapshot(`
|
||||
|
@ -373,7 +373,7 @@ describe('ReactRefreshRegression app', () => {
|
|||
|
||||
let didNotReload = await session.patch('app/content.mdx', `Hello Foo!`)
|
||||
expect(didNotReload).toBe(true)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(
|
||||
() => document.querySelector('#content').textContent
|
||||
|
@ -382,7 +382,7 @@ describe('ReactRefreshRegression app', () => {
|
|||
|
||||
didNotReload = await session.patch('app/content.mdx', `Hello Bar!`)
|
||||
expect(didNotReload).toBe(true)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(
|
||||
() => document.querySelector('#content').textContent
|
||||
|
|
|
@ -1,24 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ReactRefreshLogBox app scss syntax errors 1`] = `
|
||||
"./index.module.scss
|
||||
SassError: Expected expression.
|
||||
╷
|
||||
1 │ .button { font-size: :5px; }
|
||||
│ ^
|
||||
╵
|
||||
index.module.scss 1:22 root stylesheet
|
||||
|
||||
Import trace for requested module:
|
||||
./index.module.scss
|
||||
./index.js
|
||||
./app/page.js"
|
||||
`;
|
||||
|
||||
exports[`ReactRefreshLogBox app scss syntax errors 2`] = `
|
||||
"./index.module.scss:1:1
|
||||
Syntax error: Selector "button" is not pure (pure selectors must contain at least one local class or id)
|
||||
|
||||
> 1 | button { font-size: 5px; }
|
||||
| ^"
|
||||
`;
|
|
@ -21,6 +21,10 @@ describe('Error overlay - RSC build errors', () => {
|
|||
},
|
||||
})
|
||||
|
||||
// TODO: The error overlay is not closed when restoring the working code.
|
||||
;(process.env.TURBOPACK ? describe : describe.skip)(
|
||||
'Skipped in webpack',
|
||||
() => {
|
||||
it('should handle successive HMR changes with errors correctly', async () => {
|
||||
const { session, cleanup } = await sandbox(
|
||||
next,
|
||||
|
@ -47,12 +51,12 @@ describe('Error overlay - RSC build errors', () => {
|
|||
await session.patch(pagePath, break2.replace('break 3', '<Hello />'))
|
||||
|
||||
await session.patch(pagePath, break2)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
await session.patch(pagePath, break1)
|
||||
|
||||
await session.patch(pagePath, originalPage)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
}
|
||||
|
||||
expect(
|
||||
|
@ -61,4 +65,6 @@ describe('Error overlay - RSC build errors', () => {
|
|||
|
||||
await cleanup()
|
||||
})
|
||||
}
|
||||
)
|
||||
})
|
||||
|
|
|
@ -30,7 +30,7 @@ describe('dynamic = "error" in devmode', () => {
|
|||
`
|
||||
)
|
||||
|
||||
await session.hasRedbox(true)
|
||||
await session.hasRedbox()
|
||||
console.log(await session.getRedboxDescription())
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: Page with \`dynamic = "error"\` couldn't be rendered statically because it used \`cookies\`. See more info here: https://nextjs.org/docs/app/building-your-application/rendering/static-and-dynamic#dynamic-rendering"`
|
||||
|
|
|
@ -69,7 +69,7 @@ describe('Error overlay - editor links', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await clickSourceFile(browser)
|
||||
await check(() => editorRequestsCount, /1/)
|
||||
|
||||
|
@ -112,7 +112,7 @@ describe('Error overlay - editor links', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await clickImportTraceFiles(browser)
|
||||
await check(() => editorRequestsCount, /4/)
|
||||
|
||||
|
@ -155,7 +155,7 @@ describe('Error overlay - editor links', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await clickImportTraceFiles(browser)
|
||||
await check(() => editorRequestsCount, /3/)
|
||||
|
||||
|
|
|
@ -23,7 +23,7 @@ describe('Error overlay - error message urls', () => {
|
|||
content + '\nexport function getServerSideProps() {}'
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const link = await browser.elementByCss('[data-nextjs-terminal] a')
|
||||
const text = await link.text()
|
||||
|
|
|
@ -43,7 +43,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
|
||||
await session.patch('index.js', `export default () => <div/`)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'export default () => <div/'
|
||||
)
|
||||
|
@ -66,7 +66,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await check(
|
||||
() => session.evaluate(() => document.querySelector('p').textContent),
|
||||
|
@ -93,7 +93,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
return <p>Hello world</p>
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
// Fix syntax error
|
||||
await session.patch(
|
||||
|
@ -173,7 +173,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(await session.hasErrorToast()).toBe(false)
|
||||
|
||||
expect(
|
||||
|
@ -184,7 +184,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('Count: 2')
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(await session.hasErrorToast()).toBe(false)
|
||||
|
||||
await cleanup()
|
||||
|
@ -235,7 +235,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'export default function Child()'
|
||||
)
|
||||
|
@ -252,7 +252,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
|
||||
// TODO-APP: re-enable when error recovery doesn't reload the page.
|
||||
// expect(didNotReload).toBe(true)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('Hello')
|
||||
|
@ -313,14 +313,14 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
)
|
||||
|
||||
await new Promise((resolve) => setTimeout(resolve, 1000))
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
"Expected '}', got '<eof>'"
|
||||
)
|
||||
|
||||
// Test that runtime error does not take over:
|
||||
await new Promise((resolve) => setTimeout(resolve, 2000))
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
"Expected '}', got '<eof>'"
|
||||
)
|
||||
|
@ -371,7 +371,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
)
|
||||
|
||||
// We get an error because Foo didn't import React. Fair.
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
"return React.createElement('h1', null, 'Foo');"
|
||||
)
|
||||
|
@ -388,7 +388,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
)
|
||||
|
||||
// Expected: this fixes the problem
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
@ -431,7 +431,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
export default ClassDefault;
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
// Now change the code to introduce a runtime error without fixing the syntax error:
|
||||
await session.patch(
|
||||
|
@ -449,7 +449,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
export default ClassDefault;
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
// Now fix the syntax error:
|
||||
await session.patch(
|
||||
|
@ -467,7 +467,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
export default ClassDefault;
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
await check(async () => {
|
||||
const source = await session.getRedboxSource()
|
||||
|
@ -487,7 +487,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => {
|
|||
new Map([['app/page.js', '{{{']])
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await check(() => session.getRedboxSource(true), /Failed to compile/)
|
||||
|
||||
await cleanup()
|
||||
|
|
|
@ -65,7 +65,7 @@ describe('Error Overlay invalid imports', () => {
|
|||
const withoutUseClient = content.replace("'use client'", '')
|
||||
await session.patch(pageFile, withoutUseClient)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
|
||||
"./app/comp2.js
|
||||
'client-only' cannot be imported from a Server Component module. It should only be used from a Client Component.
|
||||
|
@ -140,7 +140,7 @@ describe('Error Overlay invalid imports', () => {
|
|||
const withoutUseClient = content.replace("'use client'", '')
|
||||
await session.patch(pageFile, withoutUseClient)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
|
||||
"./app/comp2.js
|
||||
'client-only' cannot be imported from a Server Component module. It should only be used from a Client Component.
|
||||
|
@ -213,7 +213,7 @@ describe('Error Overlay invalid imports', () => {
|
|||
const content = await next.readFile(file)
|
||||
await session.patch(file, "'use client'\n" + content)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
|
||||
"./app/comp2.js
|
||||
'server-only' cannot be imported from a Client Component module. It should only be used from a Server Component.
|
||||
|
|
|
@ -29,7 +29,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
)
|
||||
await session.patch(pageFile, uncomment)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'"getServerSideProps" is not supported in app/'
|
||||
)
|
||||
|
@ -37,7 +37,8 @@ describe('Error overlay - RSC build errors', () => {
|
|||
await cleanup()
|
||||
})
|
||||
|
||||
it('should throw an error when metadata export is used in client components', async () => {
|
||||
// TODO: The error overlay is not closed when restoring the working code.
|
||||
it.skip('should throw an error when metadata export is used in client components', async () => {
|
||||
const { session, cleanup } = await sandbox(
|
||||
next,
|
||||
undefined,
|
||||
|
@ -53,14 +54,14 @@ describe('Error overlay - RSC build errors', () => {
|
|||
'export const metadata'
|
||||
)
|
||||
await session.patch(pageFile, uncomment)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'You are attempting to export "metadata" from a component marked with "use client", which is disallowed.'
|
||||
)
|
||||
|
||||
// Restore file
|
||||
await session.patch(pageFile, content)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
// Add `generateMetadata` error
|
||||
uncomment = content.replace(
|
||||
|
@ -68,7 +69,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
'export async function generateMetadata'
|
||||
)
|
||||
await session.patch(pageFile, uncomment)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'You are attempting to export "generateMetadata" from a component marked with "use client", which is disallowed.'
|
||||
)
|
||||
|
@ -91,7 +92,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
)
|
||||
|
||||
await session.patch(pageFile, uncomment)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'"metadata" and "generateMetadata" cannot be exported at the same time, please keep one of them.'
|
||||
)
|
||||
|
@ -116,7 +117,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
await session.patch(pageFile, uncomment)
|
||||
await next.patchFile(pageFile, content)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'"getStaticProps" is not supported in app/'
|
||||
)
|
||||
|
@ -136,7 +137,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
'export const a = 123'
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toInclude(
|
||||
'The default export is not a React Component in page: "/server-with-errors/page-export"'
|
||||
)
|
||||
|
@ -151,7 +152,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
'/server-with-errors/page-export-initial-error'
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toInclude(
|
||||
'The default export is not a React Component in page: "/server-with-errors/page-export-initial-error"'
|
||||
)
|
||||
|
@ -171,7 +172,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
const uncomment = content.replace("// 'use client'", "'use client'")
|
||||
await next.patchFile(pageFile, uncomment)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'directive must be placed before other expressions'
|
||||
)
|
||||
|
@ -194,7 +195,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
)
|
||||
await session.patch(pageFile, uncomment)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
`You’re importing a class component. It only works in a Client Component`
|
||||
)
|
||||
|
@ -218,7 +219,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
)
|
||||
await next.patchFile(file, uncomment)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
`You're importing a component that imports client-only. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default.`
|
||||
)
|
||||
|
@ -251,7 +252,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
`/server-with-errors/react-apis/${api.toLowerCase()}`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
// `Component` has a custom error message
|
||||
api === 'Component'
|
||||
|
@ -278,7 +279,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
`/server-with-errors/react-dom-apis/${api.toLowerCase()}`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
`You're importing a component that needs ${api}. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components`
|
||||
)
|
||||
|
@ -304,7 +305,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
|
||||
await session.patch(file, uncomment)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
`You're importing a component that needs server-only. That only works in a Server Component but one of its parents is marked with "use client", so it's a Client Component.`
|
||||
)
|
||||
|
@ -326,7 +327,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
content.replace('() => <p>hello dynamic world</p>', 'undefined')
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toInclude(
|
||||
`Element type is invalid. Received a promise that resolves to: undefined. Lazy element type must resolve to a class or function.`
|
||||
)
|
||||
|
@ -347,7 +348,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
'export default function Error() {}'
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await check(
|
||||
() => session.getRedboxSource(),
|
||||
/must be a Client \n| Component/
|
||||
|
@ -386,7 +387,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
// Empty file
|
||||
await session.patch('app/server-with-errors/error-file/error.js', '')
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await check(() => session.getRedboxSource(), /must be a Client Component/)
|
||||
|
||||
// TODO: investigate flakey snapshot due to spacing below
|
||||
|
@ -434,7 +435,7 @@ describe('Error overlay - RSC build errors', () => {
|
|||
await session.patch(pagePath, content)
|
||||
|
||||
await check(
|
||||
async () => ((await session.hasRedbox(true)) ? 'success' : 'fail'),
|
||||
async () => ((await session.hasRedbox()) ? 'success' : 'fail'),
|
||||
/success/
|
||||
)
|
||||
|
||||
|
|
|
@ -42,7 +42,7 @@ createNextDescribe(
|
|||
const browser = await next.browser('/server')
|
||||
|
||||
await check(
|
||||
async () => ((await hasRedbox(browser, true)) ? 'success' : 'fail'),
|
||||
async () => ((await hasRedbox(browser)) ? 'success' : 'fail'),
|
||||
/success/
|
||||
)
|
||||
const errorDescription = await getRedboxDescription(browser)
|
||||
|
@ -68,7 +68,7 @@ createNextDescribe(
|
|||
const browser = await next.browser('/client')
|
||||
|
||||
await check(
|
||||
async () => ((await hasRedbox(browser, true)) ? 'success' : 'fail'),
|
||||
async () => ((await hasRedbox(browser)) ? 'success' : 'fail'),
|
||||
/success/
|
||||
)
|
||||
const errorDescription = await getRedboxDescription(browser)
|
||||
|
@ -90,7 +90,7 @@ createNextDescribe(
|
|||
|
||||
const browser = await next.browser('/server')
|
||||
await check(
|
||||
async () => ((await hasRedbox(browser, true)) ? 'success' : 'fail'),
|
||||
async () => ((await hasRedbox(browser)) ? 'success' : 'fail'),
|
||||
/success/
|
||||
)
|
||||
|
||||
|
@ -111,7 +111,7 @@ createNextDescribe(
|
|||
)
|
||||
const browser = await next.browser('/server')
|
||||
await check(
|
||||
async () => ((await hasRedbox(browser, true)) ? 'success' : 'fail'),
|
||||
async () => ((await hasRedbox(browser)) ? 'success' : 'fail'),
|
||||
/success/
|
||||
)
|
||||
|
||||
|
|
|
@ -15,7 +15,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
next,
|
||||
new Map([['pages/_app.js', ``]])
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: The default export is not a React Component in page: "/_app""`
|
||||
)
|
||||
|
@ -29,7 +29,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
export default MyApp
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await cleanup()
|
||||
})
|
||||
|
||||
|
@ -38,7 +38,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
next,
|
||||
new Map([['pages/_document.js', ``]])
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: The default export is not a React Component in page: "/_document""`
|
||||
)
|
||||
|
@ -70,7 +70,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
export default MyDocument
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await cleanup()
|
||||
})
|
||||
|
||||
|
@ -89,7 +89,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
],
|
||||
])
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(
|
||||
next.normalizeTestDirContent(await session.getRedboxSource())
|
||||
).toMatchInlineSnapshot(
|
||||
|
@ -128,7 +128,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
export default MyApp
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await cleanup()
|
||||
})
|
||||
|
||||
|
@ -165,7 +165,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
],
|
||||
])
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(
|
||||
next.normalizeTestDirContent(await session.getRedboxSource())
|
||||
).toMatchInlineSnapshot(
|
||||
|
@ -215,7 +215,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
export default MyDocument
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await cleanup()
|
||||
})
|
||||
})
|
||||
|
|
|
@ -44,7 +44,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
|
||||
"./node_modules/my-package/index.js:1:0
|
||||
Module not found: Can't resolve 'dns'
|
||||
|
@ -77,7 +77,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source).toMatchInlineSnapshot(`
|
||||
|
@ -115,7 +115,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
if (process.env.TURBOPACK) {
|
||||
|
@ -170,7 +170,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
],
|
||||
])
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source).toMatchInlineSnapshot(`
|
||||
|
@ -192,7 +192,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(() => document.documentElement.innerHTML)
|
||||
).toContain('index page')
|
||||
|
|
|
@ -5,7 +5,7 @@ import path from 'path'
|
|||
|
||||
// TODO: figure out why snapshots mismatch on GitHub actions
|
||||
// specifically but work in docker and locally
|
||||
describe.skip('ReactRefreshLogBox', () => {
|
||||
describe.skip('ReactRefreshLogBox scss', () => {
|
||||
const { next } = nextTestSetup({
|
||||
files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
|
||||
skipStart: true,
|
||||
|
@ -32,17 +32,39 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
// Syntax error
|
||||
await session.patch('index.module.scss', `.button { font-size: :5px; }`)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source).toMatchSnapshot()
|
||||
|
||||
// Not local error
|
||||
await cleanup()
|
||||
})
|
||||
|
||||
test('scss module pure selector error', async () => {
|
||||
const { session, cleanup } = await sandbox(next)
|
||||
|
||||
await session.write('index.module.scss', `.button { font-size: 5px; }`)
|
||||
await session.patch(
|
||||
'index.js',
|
||||
`
|
||||
import './index.module.scss';
|
||||
export default () => {
|
||||
return (
|
||||
<div>
|
||||
<p>lol</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
`
|
||||
)
|
||||
|
||||
// Checks for selectors that can't be prefixed.
|
||||
// Selector "button" is not pure (pure selectors must contain at least one local class or id)
|
||||
await session.patch('index.module.scss', `button { font-size: 5px; }`)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
const source2 = await session.getRedboxSource()
|
||||
expect(source2).toMatchSnapshot()
|
||||
|
||||
|
|
|
@ -37,7 +37,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
)
|
||||
await session.evaluate(() => document.querySelector('a').click())
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
|
||||
await cleanup()
|
||||
|
@ -82,7 +82,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
|
||||
await cleanup()
|
||||
|
@ -143,7 +143,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`export default function FunctionDefault() { throw new Error('no'); }`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
expect(
|
||||
await session.evaluate(() => document.querySelector('h2').textContent)
|
||||
|
@ -167,7 +167,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
// We internally only check the script path, not including the line number
|
||||
// and error message because the error comes from an external library.
|
||||
// This test ensures that the errored script path is correctly resolved.
|
||||
|
@ -194,7 +194,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -209,7 +209,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(next.normalizeTestDirContent(source)).toMatchInlineSnapshot(
|
||||
|
@ -285,7 +285,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('hello')
|
||||
|
@ -302,7 +302,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
|
||||
await session.patch(
|
||||
|
@ -317,7 +317,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('hello new')
|
||||
|
@ -343,11 +343,11 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
// Syntax error
|
||||
await session.patch('index.module.css', `.button {`)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source).toMatch(
|
||||
IS_TURBOPACK ? './index.module.css:1:8' : './index.module.css:1:1'
|
||||
|
@ -362,7 +362,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
// Checks for selectors that can't be prefixed.
|
||||
// Selector "button" is not pure (pure selectors must contain at least one local class or id)
|
||||
await session.patch('index.module.css', `button {}`)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
const source2 = await session.getRedboxSource()
|
||||
expect(source2).toMatchSnapshot()
|
||||
|
||||
|
@ -390,9 +390,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.evaluate(() => document.querySelector('button').click())
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const header = await session.getRedboxDescription()
|
||||
expect(header).toMatchSnapshot()
|
||||
|
@ -436,9 +436,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.evaluate(() => document.querySelector('button').click())
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const header2 = await session.getRedboxDescription()
|
||||
expect(header2).toMatchSnapshot()
|
||||
|
@ -482,9 +482,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.evaluate(() => document.querySelector('button').click())
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const header3 = await session.getRedboxDescription()
|
||||
expect(header3).toMatchSnapshot()
|
||||
|
@ -528,9 +528,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.evaluate(() => document.querySelector('button').click())
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const header4 = await session.getRedboxDescription()
|
||||
expect(header4).toMatchInlineSnapshot(
|
||||
|
@ -588,9 +588,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.evaluate(() => document.querySelector('button').click())
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const header5 = await session.getRedboxDescription()
|
||||
expect(header5).toMatchInlineSnapshot(
|
||||
|
@ -648,7 +648,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: {"a":1,"b":"x"}"`
|
||||
)
|
||||
|
@ -664,7 +664,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.patch(
|
||||
'index.js',
|
||||
outdent`
|
||||
|
@ -678,7 +678,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toContain(
|
||||
`Error: class Hello {`
|
||||
)
|
||||
|
@ -694,7 +694,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.patch(
|
||||
'index.js',
|
||||
outdent`
|
||||
|
@ -706,7 +706,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: string error"`
|
||||
)
|
||||
|
@ -722,7 +722,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await session.patch(
|
||||
'index.js',
|
||||
outdent`
|
||||
|
@ -734,7 +734,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toContain(
|
||||
`Error: A null error was thrown`
|
||||
)
|
||||
|
|
|
@ -30,7 +30,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: Multiple children were passed to <Link> with \`href\` of \`/\` but only one child is supported https://nextjs.org/docs/messages/link-multiple-children"`
|
||||
)
|
||||
|
@ -64,7 +64,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(
|
||||
`"Error: Failed prop type: The prop \`href\` expects a \`string\` or \`object\` in \`<Link>\`, but got \`undefined\` instead."`
|
||||
)
|
||||
|
@ -79,7 +79,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -103,7 +103,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -127,7 +127,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -151,7 +151,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await session.patch(
|
||||
'index.js',
|
||||
|
@ -175,7 +175,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchSnapshot()
|
||||
|
||||
await session.patch(
|
||||
|
@ -200,7 +200,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
}
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxDescription()).toMatchSnapshot()
|
||||
|
||||
await cleanup()
|
||||
|
@ -226,7 +226,7 @@ describe.skip('ReactRefreshLogBox', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await cleanup()
|
||||
})
|
||||
})
|
||||
|
|
|
@ -10,7 +10,7 @@ describe('ReactRefreshModule', () => {
|
|||
|
||||
it('should allow any variable names', async () => {
|
||||
const { session, cleanup } = await sandbox(next)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
const variables = [
|
||||
'_a',
|
||||
|
@ -28,7 +28,7 @@ describe('ReactRefreshModule', () => {
|
|||
return null
|
||||
}`
|
||||
)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(next.cliOutput).not.toContain(
|
||||
`'${variable}' has already been declared`
|
||||
)
|
||||
|
|
|
@ -74,7 +74,7 @@ describe('ReactRefreshRegression', () => {
|
|||
)
|
||||
|
||||
// Verify no hydration mismatch:
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
@ -283,7 +283,7 @@ describe('ReactRefreshRegression', () => {
|
|||
)
|
||||
expect(didNotReload).toBe(false)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
const source = await session.getRedboxSource()
|
||||
expect(source.split(/\r?\n/g).slice(2).join('\n')).toMatchInlineSnapshot(`
|
||||
|
@ -326,7 +326,7 @@ describe('ReactRefreshRegression', () => {
|
|||
|
||||
let didNotReload = await session.patch('pages/mdx.mdx', `Hello Foo!`)
|
||||
expect(didNotReload).toBe(true)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(
|
||||
() => document.querySelector('#__next').textContent
|
||||
|
@ -335,7 +335,7 @@ describe('ReactRefreshRegression', () => {
|
|||
|
||||
didNotReload = await session.patch('pages/mdx.mdx', `Hello Bar!`)
|
||||
expect(didNotReload).toBe(true)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(
|
||||
() => document.querySelector('#__next').textContent
|
||||
|
|
|
@ -1,19 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ReactRefreshLogBox scss syntax errors 1`] = `
|
||||
"./index.module.scss
|
||||
SassError: Expected expression.
|
||||
╷
|
||||
1 │ .button { font-size: :5px; }
|
||||
│ ^
|
||||
╵
|
||||
index.module.scss 1:22 root stylesheet"
|
||||
`;
|
||||
|
||||
exports[`ReactRefreshLogBox scss syntax errors 2`] = `
|
||||
"./index.module.scss:1:1
|
||||
Syntax error: Selector \\"button\\" is not pure (pure selectors must contain at least one local class or id)
|
||||
|
||||
> 1 | button { font-size: 5px; }
|
||||
| ^"
|
||||
`;
|
|
@ -12,7 +12,7 @@ createNextDescribe(
|
|||
it('should show a component stack on hydration error', async () => {
|
||||
const browser = await next.browser('/')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
|
||||
expect(await getRedboxComponentStack(browser)).toMatchInlineSnapshot(`
|
||||
"p
|
||||
|
|
|
@ -39,7 +39,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
|
||||
await session.patch('index.js', `export default () => <div/`)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'export default () => <div/'
|
||||
)
|
||||
|
@ -67,7 +67,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
/Count: 1/
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
@ -104,7 +104,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('1')
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
|
||||
"index.js (7:10) @ eval
|
||||
|
||||
|
@ -135,7 +135,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
expect(
|
||||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
|
@ -145,7 +145,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('Count: 2')
|
||||
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
@ -191,7 +191,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
'export default function Child()'
|
||||
)
|
||||
|
@ -206,7 +206,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
)
|
||||
|
||||
expect(didNotReload).toBe(true)
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
expect(
|
||||
await session.evaluate(() => document.querySelector('p').textContent)
|
||||
).toBe('Hello')
|
||||
|
@ -252,7 +252,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
export default ClassDefault;
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
// Now change the code to introduce a runtime error without fixing the syntax error:
|
||||
await session.patch(
|
||||
|
@ -270,7 +270,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
export default ClassDefault;
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
// Now fix the syntax error:
|
||||
await session.patch(
|
||||
|
@ -288,7 +288,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
export default ClassDefault;
|
||||
`
|
||||
)
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
await check(async () => {
|
||||
const source = await session.getRedboxSource()
|
||||
|
@ -345,7 +345,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
)
|
||||
|
||||
// We get an error because Foo didn't import React. Fair.
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(await session.getRedboxSource()).toInclude(
|
||||
"return React.createElement('h1', null, 'Foo');"
|
||||
)
|
||||
|
@ -362,7 +362,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
)
|
||||
|
||||
// Expected: this fixes the problem
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
await cleanup()
|
||||
})
|
||||
|
@ -399,7 +399,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
)
|
||||
|
||||
await new Promise((resolve) => setTimeout(resolve, 1000))
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
if (process.platform === 'win32') {
|
||||
expect(await session.getRedboxSource()).toMatchSnapshot()
|
||||
} else {
|
||||
|
@ -420,7 +420,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
)
|
||||
|
||||
await new Promise((resolve) => setTimeout(resolve, 1000))
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(
|
||||
next.normalizeTestDirContent(await session.getRedboxSource())
|
||||
).toMatchInlineSnapshot(
|
||||
|
@ -447,7 +447,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => {
|
|||
|
||||
// Test that runtime error does not take over:
|
||||
await new Promise((resolve) => setTimeout(resolve, 2000))
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
expect(
|
||||
next.normalizeTestDirContent(await session.getRedboxSource())
|
||||
).toMatchInlineSnapshot(
|
||||
|
|
|
@ -34,7 +34,7 @@ describe('Error overlay for hydration errors', () => {
|
|||
])
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
|
||||
expect(await session.getRedboxDescription()).toMatchInlineSnapshot(`
|
||||
"Error: Text content does not match server-rendered HTML.
|
||||
|
|
|
@ -48,7 +48,7 @@ describe('Error Overlay for server components compiler errors in pages', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await check(
|
||||
() => session.getRedboxSource(),
|
||||
/That only works in a Server Component/
|
||||
|
@ -92,7 +92,7 @@ describe('Error Overlay for server components compiler errors in pages', () => {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await session.hasRedbox(true)).toBe(true)
|
||||
expect(await session.hasRedbox()).toBe(true)
|
||||
await check(
|
||||
() => session.getRedboxSource(),
|
||||
/That only works in a Server Component/
|
||||
|
|
|
@ -9,7 +9,7 @@ describe.each(['default', 'turbo'])('basic app-dir tests', () => {
|
|||
|
||||
it('should reload app pages without error', async () => {
|
||||
const { session, cleanup, browser } = await sandbox(next, undefined, '/')
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
|
||||
browser.refresh()
|
||||
|
||||
|
@ -17,7 +17,7 @@ describe.each(['default', 'turbo'])('basic app-dir tests', () => {
|
|||
await waitForHydration(browser)
|
||||
|
||||
for (let i = 0; i < 15; i++) {
|
||||
expect(await session.hasRedbox(false)).toBe(false)
|
||||
expect(await session.hasRedbox()).toBe(false)
|
||||
await waitFor(1000)
|
||||
}
|
||||
|
||||
|
|
|
@ -18,7 +18,7 @@ createNextDescribe(
|
|||
content.replace('./button', './button2')
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
expect(await browser.elementByCss('#hello-world-button').text()).toBe(
|
||||
'hello world'
|
||||
|
|
|
@ -271,13 +271,13 @@ describe('GS(S)P Server-Side Change Reloading', () => {
|
|||
|
||||
try {
|
||||
await next.patchFile(page, originalContent.replace('props:', 'propss:'))
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Additional keys were returned from'
|
||||
)
|
||||
|
||||
await next.patchFile(page, originalContent)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} finally {
|
||||
await next.patchFile(page, originalContent)
|
||||
}
|
||||
|
@ -301,11 +301,11 @@ describe('GS(S)P Server-Side Change Reloading', () => {
|
|||
'throw new Error("custom oops"); const count'
|
||||
)
|
||||
)
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain('custom oops')
|
||||
|
||||
await next.patchFile(page, originalContent)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} finally {
|
||||
await next.patchFile(page, originalContent)
|
||||
}
|
||||
|
|
|
@ -492,7 +492,7 @@ describe.each([[''], ['/docs']])(
|
|||
|
||||
await next.patchFile(aboutPage, aboutContent.replace('</div>', 'div'))
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toMatch(/Unexpected eof/)
|
||||
|
||||
await next.patchFile(aboutPage, aboutContent)
|
||||
|
@ -539,7 +539,7 @@ describe.each([[''], ['/docs']])(
|
|||
|
||||
browser = await webdriver(next.url, basePath + '/hmr/contact')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toMatch(/Unexpected eof/)
|
||||
|
||||
await next.patchFile(aboutPage, aboutContent)
|
||||
|
@ -582,7 +582,7 @@ describe.each([[''], ['/docs']])(
|
|||
aboutContent.replace('export', 'aa=20;\nexport')
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(/aa is not defined/)
|
||||
|
||||
await next.patchFile(aboutPage, aboutContent)
|
||||
|
@ -618,7 +618,7 @@ describe.each([[''], ['/docs']])(
|
|||
)
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toMatch(/an-expected-error/)
|
||||
|
||||
await next.patchFile(aboutPage, aboutContent)
|
||||
|
@ -663,7 +663,7 @@ describe.each([[''], ['/docs']])(
|
|||
)
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatchInlineSnapshot(`
|
||||
" 1 of 1 unhandled error
|
||||
Server Error
|
||||
|
@ -716,7 +716,7 @@ describe.each([[''], ['/docs']])(
|
|||
)
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
// TODO: Replace this when webpack 5 is the default
|
||||
expect(await getRedboxHeader(browser)).toMatch(
|
||||
`Objects are not valid as a React child (found: [object RegExp]). If you meant to render a collection of children, use an array instead.`
|
||||
|
@ -766,7 +766,7 @@ describe.each([[''], ['/docs']])(
|
|||
)
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatchInlineSnapshot(`
|
||||
" 1 of 1 unhandled error
|
||||
Server Error
|
||||
|
@ -782,7 +782,7 @@ describe.each([[''], ['/docs']])(
|
|||
() => getBrowserBodyText(browser),
|
||||
/This is the about page/
|
||||
)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} catch (err) {
|
||||
await next.patchFile(aboutPage, aboutContent)
|
||||
|
||||
|
@ -821,7 +821,7 @@ describe.each([[''], ['/docs']])(
|
|||
)
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatchInlineSnapshot(
|
||||
`"Failed to compile"`
|
||||
)
|
||||
|
@ -846,7 +846,7 @@ describe.each([[''], ['/docs']])(
|
|||
() => getBrowserBodyText(browser),
|
||||
/This is the about page/
|
||||
)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} catch (err) {
|
||||
await next.patchFile(aboutPage, aboutContent)
|
||||
|
||||
|
@ -885,7 +885,7 @@ describe.each([[''], ['/docs']])(
|
|||
)
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatchInlineSnapshot(
|
||||
`"Failed to compile"`
|
||||
)
|
||||
|
@ -921,7 +921,7 @@ describe.each([[''], ['/docs']])(
|
|||
() => getBrowserBodyText(browser),
|
||||
/This is the about page/
|
||||
)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} catch (err) {
|
||||
await next.patchFile(aboutPage, aboutContent)
|
||||
|
||||
|
@ -950,7 +950,7 @@ describe.each([[''], ['/docs']])(
|
|||
browser = await webdriver(next.url, basePath + '/hmr')
|
||||
await browser.elementByCss('#error-in-gip-link').click()
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatchInlineSnapshot(`
|
||||
" 1 of 1 unhandled error
|
||||
Unhandled Runtime Error
|
||||
|
@ -994,7 +994,7 @@ describe.each([[''], ['/docs']])(
|
|||
try {
|
||||
browser = await webdriver(next.url, basePath + '/hmr/error-in-gip')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatchInlineSnapshot(`
|
||||
" 1 of 1 unhandled error
|
||||
Server Error
|
||||
|
@ -1146,7 +1146,7 @@ describe.each([[''], ['/docs']])(
|
|||
pageName,
|
||||
`import hello from 'non-existent'\n` + originalContent
|
||||
)
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
await waitFor(3000)
|
||||
await next.patchFile(pageName, originalContent)
|
||||
await check(
|
||||
|
|
|
@ -192,7 +192,7 @@ describe.each([
|
|||
() => browser.elementByCss('body').text(),
|
||||
/navigator/
|
||||
)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} finally {
|
||||
if (browser) {
|
||||
await browser.close()
|
||||
|
@ -211,7 +211,7 @@ describe.each([
|
|||
() => browser.elementByCss('body').text(),
|
||||
/esm.mjs/
|
||||
)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} finally {
|
||||
if (browser) {
|
||||
await browser.close()
|
||||
|
|
|
@ -42,7 +42,7 @@ describe.skip('Project Directory Renaming', () => {
|
|||
await check(async () => {
|
||||
return (await browser.eval('window.beforeNav')) === 1 ? 'pending' : 'done'
|
||||
}, 'done')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
try {
|
||||
// should still HMR correctly
|
||||
|
|
|
@ -83,7 +83,7 @@ describe('jsconfig-path-reloading', () => {
|
|||
)}`
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toContain('"@lib/second-data"')
|
||||
|
||||
await next.patchFile(
|
||||
|
@ -104,7 +104,7 @@ describe('jsconfig-path-reloading', () => {
|
|||
)
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
const html2 = await browser.eval('document.documentElement.innerHTML')
|
||||
expect(html2).toContain('first button')
|
||||
|
@ -159,7 +159,7 @@ describe('jsconfig-path-reloading', () => {
|
|||
indexContent.replace('@mybutton', '@myotherbutton')
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
const html2 = await browser.eval('document.documentElement.innerHTML')
|
||||
|
|
|
@ -43,9 +43,9 @@ createNextDescribe(
|
|||
|
||||
it('renders the error correctly and recovers', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
await next.patchFile('middleware.js', `export default function () {}`)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
})
|
||||
})
|
||||
|
||||
|
@ -80,7 +80,7 @@ createNextDescribe(
|
|||
|
||||
it('does not render the error', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(await browser.elementByCss('#page-title')).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
@ -117,10 +117,10 @@ createNextDescribe(
|
|||
|
||||
it('renders the error correctly and recovers', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toContain(`eval('test')`)
|
||||
await next.patchFile('middleware.js', `export default function () {}`)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
})
|
||||
})
|
||||
|
||||
|
@ -155,12 +155,12 @@ createNextDescribe(
|
|||
|
||||
it('renders the error correctly and recovers', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toContain(
|
||||
`throw new Error('booooom!')`
|
||||
)
|
||||
await next.patchFile('middleware.js', `export default function () {}`)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
})
|
||||
})
|
||||
|
||||
|
@ -195,7 +195,7 @@ createNextDescribe(
|
|||
|
||||
it('does not render the error', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(await browser.elementByCss('#page-title')).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
@ -233,7 +233,7 @@ createNextDescribe(
|
|||
|
||||
it('does not render the error', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(await browser.elementByCss('#page-title')).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
@ -259,14 +259,14 @@ createNextDescribe(
|
|||
|
||||
it('renders the error correctly and recovers', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(
|
||||
await browser
|
||||
.elementByCss('#nextjs__container_build_error_label')
|
||||
.text()
|
||||
).toEqual('Failed to compile')
|
||||
await next.patchFile('middleware.js', `export default function () {}`)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
expect(await browser.elementByCss('#page-title')).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
@ -292,11 +292,11 @@ createNextDescribe(
|
|||
|
||||
it('renders the error correctly and recovers', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
await next.patchFile('middleware.js', `export default function () }`)
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
await next.patchFile('middleware.js', `export default function () {}`)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(await browser.elementByCss('#page-title')).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
|
|
@ -14,6 +14,10 @@ describe('build-errors', () => {
|
|||
})
|
||||
afterAll(() => next.destroy())
|
||||
|
||||
// TODO: The error overlay is not closed when restoring the working code.
|
||||
;(process.env.TURBOPACK ? describe : describe.skip)(
|
||||
'Skipped in webpack',
|
||||
() => {
|
||||
it('should show a next/font error when input is wrong', async () => {
|
||||
const browser = await webdriver(next.url, '/')
|
||||
const content = await next.readFile('app/page.js')
|
||||
|
@ -31,7 +35,7 @@ export default function Page() {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBeTrue()
|
||||
expect(await hasRedbox(browser)).toBeTrue()
|
||||
expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
|
||||
"app/page.js
|
||||
\`next/font\` error:
|
||||
|
@ -39,7 +43,7 @@ export default function Page() {
|
|||
`)
|
||||
|
||||
await next.patchFile('app/page.js', content)
|
||||
expect(await hasRedbox(browser, false)).toBeFalse()
|
||||
expect(await hasRedbox(browser)).toBeFalse()
|
||||
})
|
||||
|
||||
it("should show a module not found error if local font file can' be resolved", async () => {
|
||||
|
@ -59,7 +63,7 @@ export default function Page() {
|
|||
`
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBeTrue()
|
||||
expect(await hasRedbox(browser)).toBeTrue()
|
||||
const sourceLines = (await getRedboxSource(browser)).split('\n')
|
||||
|
||||
// Should display the file name correctly
|
||||
|
@ -70,6 +74,8 @@ export default function Page() {
|
|||
)
|
||||
|
||||
await next.patchFile('app/page.js', content)
|
||||
expect(await hasRedbox(browser, false)).toBeFalse()
|
||||
expect(await hasRedbox(browser)).toBeFalse()
|
||||
})
|
||||
}
|
||||
)
|
||||
})
|
||||
|
|
|
@ -18,7 +18,7 @@ describe('font-loader-in-document-error', () => {
|
|||
|
||||
test('next/font inside _document', async () => {
|
||||
const browser = await webdriver(next.url, '/')
|
||||
expect(await hasRedbox(browser, true)).toBeTrue()
|
||||
expect(await hasRedbox(browser)).toBeTrue()
|
||||
expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
|
||||
"pages/_document.js
|
||||
\`next/font\` error:
|
||||
|
|
|
@ -55,7 +55,7 @@ createNextDescribe(
|
|||
|
||||
it('should have proper error when no children are provided', async () => {
|
||||
const browser = await webdriver(next.appPort, '/link-no-child')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'No children were passed to <Link> with `href` of `/about` but one child is required'
|
||||
)
|
||||
|
@ -63,7 +63,7 @@ createNextDescribe(
|
|||
|
||||
it('should not throw error when one number type child is provided', async () => {
|
||||
const browser = await webdriver(next.appPort, '/link-number-child')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
if (browser) await browser.close()
|
||||
})
|
||||
|
||||
|
@ -281,7 +281,7 @@ createNextDescribe(
|
|||
try {
|
||||
browser = await webdriver(next.appPort, '/nav')
|
||||
await browser.elementByCss('#empty-props').click()
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(
|
||||
/should resolve to an object\. But found "null" instead\./
|
||||
)
|
||||
|
@ -1381,7 +1381,7 @@ createNextDescribe(
|
|||
let browser
|
||||
try {
|
||||
browser = await webdriver(next.appPort, '/error-inside-browser-page')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxSource(browser)
|
||||
expect(text).toMatch(/An Expected error occurred/)
|
||||
expect(text).toMatch(
|
||||
|
@ -1401,7 +1401,7 @@ createNextDescribe(
|
|||
next.appPort,
|
||||
'/error-in-the-browser-global-scope'
|
||||
)
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxSource(browser)
|
||||
expect(text).toMatch(/An Expected error occurred/)
|
||||
expect(text).toMatch(/error-in-the-browser-global-scope\.js \(2:8\)/)
|
||||
|
@ -1679,7 +1679,7 @@ createNextDescribe(
|
|||
await browser.waitForElementByCss('.nav-about')
|
||||
await browser.back()
|
||||
await waitFor(1000)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} finally {
|
||||
if (browser) {
|
||||
await browser.close()
|
||||
|
@ -1699,7 +1699,7 @@ createNextDescribe(
|
|||
await browser.waitForElementByCss('.nav-about')
|
||||
await browser.back()
|
||||
await waitFor(1000)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} finally {
|
||||
if (browser) {
|
||||
await browser.close()
|
||||
|
@ -1717,7 +1717,7 @@ createNextDescribe(
|
|||
await browser.waitForElementByCss('.nav-about')
|
||||
await browser.back()
|
||||
await waitFor(1000)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
} finally {
|
||||
if (browser) {
|
||||
await browser.close()
|
||||
|
|
|
@ -253,7 +253,7 @@ export default function (next: NextInstance, render, fetch, ctx) {
|
|||
const expectedErrorMessage =
|
||||
'Circular structure in "getInitialProps" result of page "/circular-json-error".'
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxHeader(browser)
|
||||
expect(text).toContain(expectedErrorMessage)
|
||||
})
|
||||
|
@ -267,7 +267,7 @@ export default function (next: NextInstance, render, fetch, ctx) {
|
|||
const expectedErrorMessage =
|
||||
'"InstanceInitialPropsPage.getInitialProps()" is defined as an instance method - visit https://nextjs.org/docs/messages/get-initial-props-as-an-instance-method for more information.'
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxHeader(browser)
|
||||
expect(text).toContain(expectedErrorMessage)
|
||||
})
|
||||
|
@ -277,7 +277,7 @@ export default function (next: NextInstance, render, fetch, ctx) {
|
|||
const expectedErrorMessage =
|
||||
'"EmptyInitialPropsPage.getInitialProps()" should resolve to an object. But found "null" instead.'
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxHeader(browser)
|
||||
expect(text).toContain(expectedErrorMessage)
|
||||
})
|
||||
|
@ -313,14 +313,14 @@ export default function (next: NextInstance, render, fetch, ctx) {
|
|||
|
||||
test('default export is not a React Component', async () => {
|
||||
const browser = await webdriver(ctx.appPort, '/no-default-export')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxHeader(browser)
|
||||
expect(text).toMatch(/The default export is not a React Component/)
|
||||
})
|
||||
|
||||
test('error-inside-page', async () => {
|
||||
const browser = await webdriver(ctx.appPort, '/error-inside-page')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxHeader(browser)
|
||||
expect(text).toMatch(/This is an expected error/)
|
||||
// Sourcemaps are applied by react-error-overlay, so we can't check them on SSR.
|
||||
|
@ -328,7 +328,7 @@ export default function (next: NextInstance, render, fetch, ctx) {
|
|||
|
||||
test('error-in-the-global-scope', async () => {
|
||||
const browser = await webdriver(ctx.appPort, '/error-in-the-global-scope')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxHeader(browser)
|
||||
expect(text).toMatch(/aa is not defined/)
|
||||
// Sourcemaps are applied by react-error-overlay, so we can't check them on SSR.
|
||||
|
@ -428,7 +428,7 @@ export default function (next: NextInstance, render, fetch, ctx) {
|
|||
|
||||
it('should show a valid error when undefined is thrown', async () => {
|
||||
const browser = await webdriver(ctx.appPort, '/throw-undefined')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const text = await getRedboxHeader(browser)
|
||||
|
||||
expect(text).toContain(
|
||||
|
|
|
@ -83,7 +83,7 @@ describe('tsconfig-path-reloading', () => {
|
|||
)}`
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toContain('"@lib/second-data"')
|
||||
|
||||
await next.patchFile(
|
||||
|
@ -104,7 +104,7 @@ describe('tsconfig-path-reloading', () => {
|
|||
)
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
const html2 = await browser.eval('document.documentElement.innerHTML')
|
||||
expect(html2).toContain('first button')
|
||||
|
@ -159,7 +159,7 @@ describe('tsconfig-path-reloading', () => {
|
|||
indexContent.replace('@mybutton', '@myotherbutton')
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
const html2 = await browser.eval('document.documentElement.innerHTML')
|
||||
|
|
|
@ -33,7 +33,7 @@ createNextDescribe(
|
|||
await waitFor(1000)
|
||||
|
||||
// It should not have an error
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
// HMR should still work
|
||||
const code = await next.readFile('app/page-with-loading/page.js')
|
||||
|
|
|
@ -1403,7 +1403,7 @@ createNextDescribe(
|
|||
if (isDev) {
|
||||
// TODO: investigate desired behavior here as it is currently
|
||||
// minimized by default
|
||||
// expect(await hasRedbox(browser, true)).toBe(true)
|
||||
// expect(await hasRedbox(browser)).toBe(true)
|
||||
// expect(await getRedboxHeader(browser)).toMatch(/this is a test/)
|
||||
} else {
|
||||
await browser
|
||||
|
@ -1431,7 +1431,7 @@ createNextDescribe(
|
|||
// Digest of the error message should be stable.
|
||||
).not.toBe('')
|
||||
// TODO-APP: ensure error overlay is shown for errors that happened before/during hydration
|
||||
// expect(await hasRedbox(browser, true)).toBe(true)
|
||||
// expect(await hasRedbox(browser)).toBe(true)
|
||||
// expect(await getRedboxHeader(browser)).toMatch(/this is a test/)
|
||||
} else {
|
||||
await browser
|
||||
|
@ -1454,7 +1454,7 @@ createNextDescribe(
|
|||
await browser.elementByCss('#error-trigger-button').click()
|
||||
|
||||
if (isDev) {
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(/this is a test/)
|
||||
} else {
|
||||
expect(
|
||||
|
@ -1471,7 +1471,7 @@ createNextDescribe(
|
|||
)
|
||||
|
||||
if (isDev) {
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(/custom server error/)
|
||||
} else {
|
||||
expect(
|
||||
|
|
|
@ -13,7 +13,7 @@ createNextDescribe(
|
|||
const browser = await next.browser('/object')
|
||||
|
||||
// Error should show up
|
||||
expect(await hasRedbox(browser, true)).toBeTrue()
|
||||
expect(await hasRedbox(browser)).toBeTrue()
|
||||
expect(await getRedboxDescription(browser)).toMatchInlineSnapshot(
|
||||
`"Error: Dynamic href \`/object/[slug]\` found in <Link> while using the \`/app\` router, this is not supported. Read more: https://nextjs.org/docs/messages/app-dir-dynamic-href"`
|
||||
)
|
||||
|
@ -43,7 +43,7 @@ createNextDescribe(
|
|||
const browser = await next.browser('/string')
|
||||
|
||||
// Error should show up
|
||||
expect(await hasRedbox(browser, true)).toBeTrue()
|
||||
expect(await hasRedbox(browser)).toBeTrue()
|
||||
expect(await getRedboxDescription(browser)).toMatchInlineSnapshot(
|
||||
`"Error: Dynamic href \`/object/[slug]\` found in <Link> while using the \`/app\` router, this is not supported. Read more: https://nextjs.org/docs/messages/app-dir-dynamic-href"`
|
||||
)
|
||||
|
|
|
@ -2,7 +2,7 @@ import { getRedboxHeader, hasRedbox } from 'next-test-utils'
|
|||
import { createNextDescribe } from 'e2e-utils'
|
||||
|
||||
async function testDev(browser, errorRegex) {
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(errorRegex)
|
||||
}
|
||||
|
||||
|
|
|
@ -2,7 +2,7 @@ import { getRedboxHeader, hasRedbox } from 'next-test-utils'
|
|||
import { createNextDescribe } from 'e2e-utils'
|
||||
|
||||
async function testDev(browser, errorRegex) {
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(errorRegex)
|
||||
}
|
||||
|
||||
|
|
|
@ -434,7 +434,7 @@ describe('app dir - next/font', () => {
|
|||
'fonts/index.js',
|
||||
font1Content.replace('./font1.woff2', './does-not-exist.woff2')
|
||||
)
|
||||
expect(await hasRedbox(browser, true)).toBeTrue()
|
||||
expect(await hasRedbox(browser)).toBeTrue()
|
||||
expect(await getRedboxSource(browser)).toInclude(
|
||||
"Can't resolve './does-not-exist.woff2'"
|
||||
)
|
||||
|
|
|
@ -15,7 +15,7 @@ createNextDescribe(
|
|||
|
||||
if (isNextDev) {
|
||||
await check(async () => {
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxDescription(browser)).toMatch(
|
||||
/notFound\(\) is not allowed to use in root layout/
|
||||
)
|
||||
|
@ -43,7 +43,7 @@ createNextDescribe(
|
|||
const browser = await next.browser('/?root-not-found=1')
|
||||
|
||||
if (isNextDev) {
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxDescription(browser)).toBe(
|
||||
'Error: notFound() is not allowed to use in root layout'
|
||||
)
|
||||
|
|
|
@ -16,7 +16,7 @@ createNextDescribe(
|
|||
waitHydration: false,
|
||||
})
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
|
||||
"Please make sure to include the following tags in your root layout: <html>, <body>.
|
||||
|
||||
|
@ -30,7 +30,7 @@ createNextDescribe(
|
|||
})
|
||||
await browser.elementByCss('a').click()
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
|
||||
"Please make sure to include the following tags in your root layout: <html>, <body>.
|
||||
|
||||
|
@ -43,7 +43,7 @@ createNextDescribe(
|
|||
waitHydration: false,
|
||||
})
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
|
||||
"Please make sure to include the following tags in your root layout: <html>, <body>.
|
||||
|
||||
|
|
|
@ -47,7 +47,7 @@ describe('basePath + trailingSlash', () => {
|
|||
expect(await browser.eval('window.location.search')).toBe('?query=true')
|
||||
|
||||
if (dev) {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
}
|
||||
} finally {
|
||||
await browser.close()
|
||||
|
@ -73,7 +73,7 @@ describe('basePath + trailingSlash', () => {
|
|||
expect(await browser.eval('window.location.search')).toBe('?query=true')
|
||||
|
||||
if (dev) {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
}
|
||||
} finally {
|
||||
await browser.close()
|
||||
|
|
|
@ -946,7 +946,7 @@ describe('basePath', () => {
|
|||
expect(await browser.eval('window.location.search')).toBe('?query=true')
|
||||
|
||||
if (isDev) {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
}
|
||||
} finally {
|
||||
await browser.close()
|
||||
|
@ -970,7 +970,7 @@ describe('basePath', () => {
|
|||
expect(await browser.eval('window.location.search')).toBe('?query=true')
|
||||
|
||||
if (isDev) {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
}
|
||||
} finally {
|
||||
await browser.close()
|
||||
|
|
|
@ -1,7 +1,10 @@
|
|||
import Link from 'next/link'
|
||||
import { useRouter } from 'next/router'
|
||||
|
||||
const Page = () => (
|
||||
function Page() {
|
||||
const router = useRouter()
|
||||
const routerObj = router.isReady ? router : { pathname: '', asPath: '' }
|
||||
return (
|
||||
<>
|
||||
<Link href="/other-page" id="other-page-link">
|
||||
<h1>Hello World</h1>
|
||||
|
@ -38,8 +41,8 @@ const Page = () => (
|
|||
Hash Link
|
||||
</Link>
|
||||
<br />
|
||||
<div id="base-path">{useRouter().basePath}</div>
|
||||
<div id="pathname">{useRouter().pathname}</div>
|
||||
<div id="base-path">{router.basePath}</div>
|
||||
<div id="pathname">{routerObj.pathname}</div>
|
||||
<div
|
||||
id="trigger-error"
|
||||
onClick={() => {
|
||||
|
@ -49,7 +52,7 @@ const Page = () => (
|
|||
click me for error
|
||||
</div>
|
||||
<br />
|
||||
<div id="as-path">{useRouter().asPath}</div>
|
||||
<div id="as-path">{routerObj.asPath}</div>
|
||||
<Link href="/slow-route" id="slow-route">
|
||||
<h1>Slow route</h1>
|
||||
</Link>
|
||||
|
@ -64,4 +67,5 @@ const Page = () => (
|
|||
</Link>
|
||||
</>
|
||||
)
|
||||
}
|
||||
export default Page
|
||||
|
|
|
@ -35,7 +35,7 @@ createNextDescribe(
|
|||
|
||||
async function containConflictsError(browser, conflicts) {
|
||||
await check(async () => {
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const redboxSource = await getRedboxSource(browser)
|
||||
expect(redboxSource).toMatch(
|
||||
/Conflicting app and page files? (were|was) found, please remove the conflicting files to continue:/
|
||||
|
@ -53,7 +53,7 @@ createNextDescribe(
|
|||
it('should show error overlay for /another', async () => {
|
||||
await next.start()
|
||||
const browser = await next.browser('/another')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
await containConflictsError(browser, [
|
||||
['pages/index.js', 'app/page.js'],
|
||||
['pages/another.js', 'app/another/page.js'],
|
||||
|
@ -62,7 +62,7 @@ createNextDescribe(
|
|||
|
||||
it('should show error overlay for /', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
await containConflictsError(browser, [
|
||||
['pages/index.js', 'app/page.js'],
|
||||
['pages/another.js', 'app/another/page.js'],
|
||||
|
@ -71,14 +71,14 @@ createNextDescribe(
|
|||
|
||||
it('should support hmr with conflicts', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
|
||||
await next.renameFile('pages/index.js', 'pages/index2.js')
|
||||
await next.renameFile('pages/another.js', 'pages/another2.js')
|
||||
|
||||
// Wait for successful recompilation
|
||||
await browser.loadPage(next.url + '/')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(await browser.elementByCss('p').text()).toContain('index - app')
|
||||
|
||||
await browser.loadPage(next.url + '/another')
|
||||
|
@ -87,12 +87,12 @@ createNextDescribe(
|
|||
|
||||
it('should not show error overlay for non conflict pages under app or pages dir', async () => {
|
||||
const browser = await next.browser('/non-conflict')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(await getRedboxHeader(browser)).toBeUndefined()
|
||||
expect(await browser.elementByCss('p').text()).toBe('non-conflict app')
|
||||
|
||||
await browser.loadPage(next.url + '/non-conflict-pages')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(await getRedboxHeader(browser)).toBeUndefined()
|
||||
expect(await browser.elementByCss('h1').text()).toBe(
|
||||
'non-conflict pages'
|
||||
|
@ -101,11 +101,11 @@ createNextDescribe(
|
|||
|
||||
it('should error again when there is new conflict', async () => {
|
||||
const browser = await next.browser('/')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
// Re-trigger the conflicted errors
|
||||
await next.renameFile('pages/index2.js', 'pages/index.js')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
await containConflictsError(browser, [
|
||||
['pages/index.js', 'app/page.js'],
|
||||
])
|
||||
|
|
|
@ -24,7 +24,7 @@ createNextDescribe(
|
|||
} else if (isNextDev) {
|
||||
expect(next.cliOutput).toContain('src/fetcher.js')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const source = await getRedboxSource(browser)
|
||||
|
||||
expect(source).toContain('async function anotherFetcher(...args)')
|
||||
|
|
|
@ -32,7 +32,7 @@ describe('New Link Behavior with <a> child', () => {
|
|||
|
||||
if ((global as any).isDev) {
|
||||
expect(next.cliOutput).toContain(msg)
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxSource(browser)).toContain(msg)
|
||||
expect(link).not.toBeDefined()
|
||||
} else {
|
||||
|
|
|
@ -1094,7 +1094,7 @@ describe('Prerender', () => {
|
|||
// we need to reload the page to trigger getStaticProps
|
||||
await browser.refresh()
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const errOverlayContent = await getRedboxHeader(browser)
|
||||
|
||||
await next.patchFile(indexPage, origContent)
|
||||
|
@ -1233,7 +1233,7 @@ describe('Prerender', () => {
|
|||
// )
|
||||
|
||||
// FIXME: disable this
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(
|
||||
/Failed to load static props/
|
||||
)
|
||||
|
@ -1249,7 +1249,7 @@ describe('Prerender', () => {
|
|||
// )
|
||||
|
||||
// FIXME: disable this
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(
|
||||
/Failed to load static props/
|
||||
)
|
||||
|
|
|
@ -95,7 +95,7 @@ describe('Type module interop', () => {
|
|||
|
||||
it('should render client-side', async () => {
|
||||
const browser = await webdriver(next.url, '/')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
await browser.close()
|
||||
})
|
||||
|
||||
|
@ -107,7 +107,7 @@ describe('Type module interop', () => {
|
|||
|
||||
it('should render client-side with modules', async () => {
|
||||
const browser = await webdriver(next.url, '/modules')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
await browser.close()
|
||||
})
|
||||
})
|
||||
|
|
|
@ -25,7 +25,7 @@ describe('App assetPrefix config', () => {
|
|||
const browser = await webdriver(appPort, '/')
|
||||
try {
|
||||
await waitFor(2000)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
const title = await browser.elementById('title').text()
|
||||
expect(title).toBe('IndexPage')
|
||||
} finally {
|
||||
|
|
|
@ -158,7 +158,7 @@ export async function runTests({
|
|||
if (isDev) {
|
||||
const url = dynamicPage ? '/another/first' : '/api/json'
|
||||
const browser = await webdriver(port, url)
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(expectedErrMsg)
|
||||
} else {
|
||||
await check(() => result.stderr, /error/i)
|
||||
|
|
|
@ -35,7 +35,7 @@ const appDir = join(__dirname, '../')
|
|||
)
|
||||
|
||||
const browser = await webdriver(appPort, '/')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
if (process.platform === 'win32') {
|
||||
// TODO: add win32 snapshot
|
||||
} else {
|
||||
|
|
|
@ -220,7 +220,7 @@ describe('config-output-export', () => {
|
|||
await killApp(app).catch(() => {})
|
||||
fs.rmSync(blog)
|
||||
}
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'ISR cannot be used with "output: export".'
|
||||
)
|
||||
|
@ -255,7 +255,7 @@ describe('config-output-export', () => {
|
|||
await killApp(app).catch(() => {})
|
||||
fs.rmSync(blog)
|
||||
}
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
})
|
||||
|
||||
it('should work with getStaticProps and without revalidate', async () => {
|
||||
|
@ -283,7 +283,7 @@ describe('config-output-export', () => {
|
|||
await killApp(app).catch(() => {})
|
||||
fs.rmSync(blog)
|
||||
}
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
})
|
||||
|
||||
it('should error with getServerSideProps without fallback', async () => {
|
||||
|
@ -311,7 +311,7 @@ describe('config-output-export', () => {
|
|||
await killApp(app).catch(() => {})
|
||||
fs.rmSync(blog)
|
||||
}
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'getServerSideProps cannot be used with "output: export".'
|
||||
)
|
||||
|
@ -351,19 +351,17 @@ describe('config-output-export', () => {
|
|||
output: 'export',
|
||||
})
|
||||
browser = await webdriver(result.port, '/posts/one')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
browser = await webdriver(result.port, '/posts/two')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
} finally {
|
||||
await killApp(app).catch(() => {})
|
||||
fs.rmSync(posts, { recursive: true, force: true })
|
||||
}
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'getStaticPaths with "fallback: true" cannot be used with "output: export".'
|
||||
)
|
||||
expect(result?.stderr).toContain(
|
||||
'getStaticPaths with "fallback: true" cannot be used with "output: export".'
|
||||
)
|
||||
} finally {
|
||||
await killApp(app).catch(() => {})
|
||||
fs.rmSync(posts, { recursive: true, force: true })
|
||||
}
|
||||
})
|
||||
|
||||
it('should error with getStaticPaths and fallback blocking', async () => {
|
||||
|
@ -397,19 +395,17 @@ describe('config-output-export', () => {
|
|||
output: 'export',
|
||||
})
|
||||
browser = await webdriver(result.port, '/posts/one')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
browser = await webdriver(result.port, '/posts/two')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
} finally {
|
||||
await killApp(app).catch(() => {})
|
||||
fs.rmSync(posts, { recursive: true, force: true })
|
||||
}
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'getStaticPaths with "fallback: blocking" cannot be used with "output: export".'
|
||||
)
|
||||
expect(result?.stderr).toContain(
|
||||
'getStaticPaths with "fallback: blocking" cannot be used with "output: export".'
|
||||
)
|
||||
} finally {
|
||||
await killApp(app).catch(() => {})
|
||||
fs.rmSync(posts, { recursive: true, force: true })
|
||||
}
|
||||
})
|
||||
|
||||
it('should work with getStaticPaths and fallback false', async () => {
|
||||
|
@ -449,7 +445,7 @@ describe('config-output-export', () => {
|
|||
}
|
||||
const h1 = await browser.elementByCss('h1')
|
||||
expect(await h1.text()).toContain('Hello from one')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(result.stderr).toBeEmpty()
|
||||
})
|
||||
})
|
||||
|
|
|
@ -296,7 +296,7 @@ const runTests = (isDev = false) => {
|
|||
expect(await browser.eval('window.beforeNav')).toBe(1)
|
||||
|
||||
if (isDev) {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
}
|
||||
})
|
||||
|
||||
|
|
|
@ -1180,7 +1180,7 @@ function runTests({ dev }) {
|
|||
await browser
|
||||
.elementByCss('#view-post-1-interpolated-incorrectly')
|
||||
.click()
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const header = await getRedboxHeader(browser)
|
||||
expect(header).toContain(
|
||||
'The provided `href` (/[name]?another=value) value is missing query values (name) to be interpolated properly.'
|
||||
|
|
|
@ -49,7 +49,7 @@ const showsError = async (pathname, regex, click = false, isWarn = false) => {
|
|||
return warnLogs.join('\n')
|
||||
}, regex)
|
||||
} else {
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
const errorContent = await getRedboxHeader(browser)
|
||||
expect(errorContent).toMatch(regex)
|
||||
}
|
||||
|
|
|
@ -404,7 +404,7 @@ function runTests(mode) {
|
|||
it('should show missing src error', async () => {
|
||||
const browser = await webdriver(appPort, '/docs/missing-src')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
|
@ -414,7 +414,7 @@ function runTests(mode) {
|
|||
it('should show invalid src error', async () => {
|
||||
const browser = await webdriver(appPort, '/docs/invalid-src')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Invalid src prop (https://google.com/test.png) on `next/image`, hostname "google.com" is not configured under images in your `next.config.js`'
|
||||
)
|
||||
|
@ -426,7 +426,7 @@ function runTests(mode) {
|
|||
'/docs/invalid-src-proto-relative'
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Failed to parse src "//assets.example.com/img.jpg" on `next/image`, protocol-relative URL (//) must be changed to an absolute URL (http:// or https://)'
|
||||
)
|
||||
|
|
|
@ -800,7 +800,7 @@ function runTests(mode) {
|
|||
it('should show missing src error', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-src')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
|
@ -810,7 +810,7 @@ function runTests(mode) {
|
|||
it('should show invalid src error', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-src')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Invalid src prop (https://google.com/test.png) on `next/image`, hostname "google.com" is not configured under images in your `next.config.js`'
|
||||
)
|
||||
|
@ -819,7 +819,7 @@ function runTests(mode) {
|
|||
it('should show invalid src error when protocol-relative', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-src-proto-relative')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Failed to parse src "//assets.example.com/img.jpg" on `next/image`, protocol-relative URL (//) must be changed to an absolute URL (http:// or https://)'
|
||||
)
|
||||
|
@ -828,7 +828,7 @@ function runTests(mode) {
|
|||
it('should show error when string src and placeholder=blur and blurDataURL is missing', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-placeholder-blur')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.png" has "placeholder='blur'" property but is missing the "blurDataURL" property.`
|
||||
)
|
||||
|
@ -837,7 +837,7 @@ function runTests(mode) {
|
|||
it('should show error when not numeric string width or height', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-width-or-height')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" has invalid "width" or "height" property. These should be numeric values.`
|
||||
)
|
||||
|
@ -849,7 +849,7 @@ function runTests(mode) {
|
|||
'/invalid-placeholder-blur-static'
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(
|
||||
/Image with src "(.*)bmp" has "placeholder='blur'" property but is missing the "blurDataURL" property/
|
||||
)
|
||||
|
@ -861,7 +861,7 @@ function runTests(mode) {
|
|||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
}, /Image with src (.*)jpg(.*) may not render properly as a child of a flex container. Consider wrapping the image with a div to configure the width/gm)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
})
|
||||
|
||||
it('should warn when img with layout=fill is inside a container without position relative', async () => {
|
||||
|
@ -886,7 +886,7 @@ function runTests(mode) {
|
|||
expect(warnings).not.toMatch(
|
||||
/Image with src (.*)webp(.*) may not render properly/gm
|
||||
)
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
})
|
||||
|
||||
it('should warn when using a very small image with placeholder=blur', async () => {
|
||||
|
@ -895,7 +895,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)jpg(.*) is smaller than 40x40. Consider removing(.*)/gm
|
||||
)
|
||||
|
@ -907,7 +907,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).not.toMatch(
|
||||
/Expected server HTML to contain a matching/gm
|
||||
)
|
||||
|
@ -932,7 +932,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)wide.png(.*) was detected as the Largest Contentful Paint/gm
|
||||
)
|
||||
|
@ -949,7 +949,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)png(.*) has a "loader" property that does not implement width/gm
|
||||
)
|
||||
|
@ -973,7 +973,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)png(.*) has "sizes" property but it will be ignored/gm
|
||||
)
|
||||
|
@ -994,7 +994,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).not.toMatch(
|
||||
/Image with src (.*) has a "loader" property that does not implement width/gm
|
||||
)
|
||||
|
|
|
@ -753,7 +753,7 @@ function runTests(mode) {
|
|||
'position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;object-fit:cover;object-position:10% 10%;color:transparent'
|
||||
)
|
||||
if (mode === 'dev') {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
|
@ -785,7 +785,7 @@ function runTests(mode) {
|
|||
'color:transparent;width:100%;height:auto'
|
||||
)
|
||||
if (mode === 'dev') {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
|
@ -835,7 +835,7 @@ function runTests(mode) {
|
|||
it('should show missing src error', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-src')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
|
@ -845,7 +845,7 @@ function runTests(mode) {
|
|||
it('should show empty string src error', async () => {
|
||||
const browser = await webdriver(appPort, '/empty-string-src')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
|
@ -855,7 +855,7 @@ function runTests(mode) {
|
|||
it('should show invalid src error', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-src')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Invalid src prop (https://google.com/test.png) on `next/image`, hostname "google.com" is not configured under images in your `next.config.js`'
|
||||
)
|
||||
|
@ -864,7 +864,7 @@ function runTests(mode) {
|
|||
it('should show invalid src error when protocol-relative', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-src-proto-relative')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Failed to parse src "//assets.example.com/img.jpg" on `next/image`, protocol-relative URL (//) must be changed to an absolute URL (http:// or https://)'
|
||||
)
|
||||
|
@ -873,7 +873,7 @@ function runTests(mode) {
|
|||
it('should show error when string src and placeholder=blur and blurDataURL is missing', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-placeholder-blur')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.png" has "placeholder='blur'" property but is missing the "blurDataURL" property.`
|
||||
)
|
||||
|
@ -882,7 +882,7 @@ function runTests(mode) {
|
|||
it('should show error when invalid width prop', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-width')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" has invalid "width" property. Expected a numeric value in pixels but received "100%".`
|
||||
)
|
||||
|
@ -891,7 +891,7 @@ function runTests(mode) {
|
|||
it('should show error when invalid Infinity width prop', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-Infinity-width')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" has invalid "width" property. Expected a numeric value in pixels but received "Infinity".`
|
||||
)
|
||||
|
@ -900,7 +900,7 @@ function runTests(mode) {
|
|||
it('should show error when invalid height prop', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-height')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" has invalid "height" property. Expected a numeric value in pixels but received "50vh".`
|
||||
)
|
||||
|
@ -909,7 +909,7 @@ function runTests(mode) {
|
|||
it('should show missing alt error', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-alt')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
|
@ -919,7 +919,7 @@ function runTests(mode) {
|
|||
it('should show error when missing width prop', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-width')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" is missing required "width" property.`
|
||||
)
|
||||
|
@ -928,7 +928,7 @@ function runTests(mode) {
|
|||
it('should show error when missing height prop', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-height')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" is missing required "height" property.`
|
||||
)
|
||||
|
@ -937,7 +937,7 @@ function runTests(mode) {
|
|||
it('should show error when width prop on fill image', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-fill-width')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/wide.png" has both "width" and "fill" properties.`
|
||||
)
|
||||
|
@ -946,7 +946,7 @@ function runTests(mode) {
|
|||
it('should show error when CSS position changed on fill image', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-fill-position')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/wide.png" has both "fill" and "style.position" properties. Images with "fill" always use position absolute - it cannot be modified.`
|
||||
)
|
||||
|
@ -958,7 +958,7 @@ function runTests(mode) {
|
|||
'/invalid-placeholder-blur-static'
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(
|
||||
/Image with src "(.*)bmp" has "placeholder='blur'" property but is missing the "blurDataURL" property/
|
||||
)
|
||||
|
@ -970,7 +970,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)jpg(.*) is smaller than 40x40. Consider removing(.*)/gm
|
||||
)
|
||||
|
@ -982,7 +982,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).not.toMatch(
|
||||
/Expected server HTML to contain a matching/gm
|
||||
)
|
||||
|
@ -1007,7 +1007,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log('browser'))
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)wide.png(.*) was detected as the Largest Contentful Paint/gm
|
||||
)
|
||||
|
@ -1024,7 +1024,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)png(.*) has a "loader" property that does not implement width/gm
|
||||
)
|
||||
|
@ -1047,7 +1047,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).not.toMatch(
|
||||
/Image with src (.*) has "fill" but is missing "sizes" prop. Please add it to improve page performance/gm
|
||||
)
|
||||
|
@ -1059,7 +1059,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).not.toMatch(
|
||||
/Image with src (.*) has a "loader" property that does not implement width/gm
|
||||
)
|
||||
|
|
|
@ -130,7 +130,7 @@ function runTests(mode) {
|
|||
it('should show missing src error', async () => {
|
||||
const browser = await webdriver(appPort, '/docs/missing-src')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log('browser'))
|
||||
|
@ -142,7 +142,7 @@ function runTests(mode) {
|
|||
it('should show invalid src error', async () => {
|
||||
const browser = await webdriver(appPort, '/docs/invalid-src')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Invalid src prop (https://google.com/test.png) on `next/image`, hostname "google.com" is not configured under images in your `next.config.js`'
|
||||
)
|
||||
|
@ -154,7 +154,7 @@ function runTests(mode) {
|
|||
'/docs/invalid-src-proto-relative'
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Failed to parse src "//assets.example.com/img.jpg" on `next/image`, protocol-relative URL (//) must be changed to an absolute URL (http:// or https://)'
|
||||
)
|
||||
|
|
|
@ -754,7 +754,7 @@ function runTests(mode) {
|
|||
'position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;object-fit:cover;object-position:10% 10%;color:transparent'
|
||||
)
|
||||
if (mode === 'dev') {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
|
@ -786,7 +786,7 @@ function runTests(mode) {
|
|||
'color:transparent;width:100%;height:auto'
|
||||
)
|
||||
if (mode === 'dev') {
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
|
@ -836,7 +836,7 @@ function runTests(mode) {
|
|||
it('should show missing src error', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-src')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
|
@ -846,7 +846,7 @@ function runTests(mode) {
|
|||
it('should show empty string src error', async () => {
|
||||
const browser = await webdriver(appPort, '/empty-string-src')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
|
@ -856,7 +856,7 @@ function runTests(mode) {
|
|||
it('should show invalid src error', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-src')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Invalid src prop (https://google.com/test.png) on `next/image`, hostname "google.com" is not configured under images in your `next.config.js`'
|
||||
)
|
||||
|
@ -865,7 +865,7 @@ function runTests(mode) {
|
|||
it('should show invalid src error when protocol-relative', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-src-proto-relative')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
'Failed to parse src "//assets.example.com/img.jpg" on `next/image`, protocol-relative URL (//) must be changed to an absolute URL (http:// or https://)'
|
||||
)
|
||||
|
@ -874,7 +874,7 @@ function runTests(mode) {
|
|||
it('should show error when string src and placeholder=blur and blurDataURL is missing', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-placeholder-blur')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.png" has "placeholder='blur'" property but is missing the "blurDataURL" property.`
|
||||
)
|
||||
|
@ -883,7 +883,7 @@ function runTests(mode) {
|
|||
it('should show error when invalid width prop', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-width')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" has invalid "width" property. Expected a numeric value in pixels but received "100%".`
|
||||
)
|
||||
|
@ -892,7 +892,7 @@ function runTests(mode) {
|
|||
it('should show error when invalid Infinity width prop', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-Infinity-width')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" has invalid "width" property. Expected a numeric value in pixels but received "Infinity".`
|
||||
)
|
||||
|
@ -901,7 +901,7 @@ function runTests(mode) {
|
|||
it('should show error when invalid height prop', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-height')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" has invalid "height" property. Expected a numeric value in pixels but received "50vh".`
|
||||
)
|
||||
|
@ -910,7 +910,7 @@ function runTests(mode) {
|
|||
it('should show missing alt error', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-alt')
|
||||
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
|
||||
await check(async () => {
|
||||
return (await browser.log()).map((log) => log.message).join('\n')
|
||||
|
@ -920,7 +920,7 @@ function runTests(mode) {
|
|||
it('should show error when missing width prop', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-width')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" is missing required "width" property.`
|
||||
)
|
||||
|
@ -929,7 +929,7 @@ function runTests(mode) {
|
|||
it('should show error when missing height prop', async () => {
|
||||
const browser = await webdriver(appPort, '/missing-height')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/test.jpg" is missing required "height" property.`
|
||||
)
|
||||
|
@ -938,7 +938,7 @@ function runTests(mode) {
|
|||
it('should show error when width prop on fill image', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-fill-width')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/wide.png" has both "width" and "fill" properties.`
|
||||
)
|
||||
|
@ -947,7 +947,7 @@ function runTests(mode) {
|
|||
it('should show error when CSS position changed on fill image', async () => {
|
||||
const browser = await webdriver(appPort, '/invalid-fill-position')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(
|
||||
`Image with src "/wide.png" has both "fill" and "style.position" properties. Images with "fill" always use position absolute - it cannot be modified.`
|
||||
)
|
||||
|
@ -959,7 +959,7 @@ function runTests(mode) {
|
|||
'/invalid-placeholder-blur-static'
|
||||
)
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(
|
||||
/Image with src "(.*)bmp" has "placeholder='blur'" property but is missing the "blurDataURL" property/
|
||||
)
|
||||
|
@ -971,7 +971,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)jpg(.*) is smaller than 40x40. Consider removing(.*)/gm
|
||||
)
|
||||
|
@ -983,7 +983,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).not.toMatch(
|
||||
/Expected server HTML to contain a matching/gm
|
||||
)
|
||||
|
@ -1008,7 +1008,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log('browser'))
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)wide.png(.*) was detected as the Largest Contentful Paint/gm
|
||||
)
|
||||
|
@ -1025,7 +1025,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).toMatch(
|
||||
/Image with src (.*)png(.*) has a "loader" property that does not implement width/gm
|
||||
)
|
||||
|
@ -1048,7 +1048,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).not.toMatch(
|
||||
/Image with src (.*) has "fill" but is missing "sizes" prop. Please add it to improve page performance/gm
|
||||
)
|
||||
|
@ -1060,7 +1060,7 @@ function runTests(mode) {
|
|||
const warnings = (await browser.log())
|
||||
.map((log) => log.message)
|
||||
.join('\n')
|
||||
expect(await hasRedbox(browser, false)).toBe(false)
|
||||
expect(await hasRedbox(browser)).toBe(false)
|
||||
expect(warnings).not.toMatch(
|
||||
/Image with src (.*) has a "loader" property that does not implement width/gm
|
||||
)
|
||||
|
|
|
@ -33,7 +33,7 @@ describe('next/image with output export config', () => {
|
|||
const browser = await webdriver(appPort, '/')
|
||||
const msg =
|
||||
"Image Optimization using the default loader is not compatible with `{ output: 'export' }`."
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toContain(msg)
|
||||
expect(stderr).toContain(msg)
|
||||
})
|
||||
|
|
|
@ -24,7 +24,7 @@ function runTests({ isDev }) {
|
|||
it('should show error', async () => {
|
||||
if (isDev) {
|
||||
const browser = await webdriver(appPort, '/')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toBe('Failed to compile')
|
||||
expect(await getRedboxSource(browser)).toBe(`./pages/index.js:3\n${msg}`)
|
||||
expect(stripAnsi(stderr)).toContain(msg)
|
||||
|
|
|
@ -33,21 +33,18 @@ describe('no duplicate compile error output', () => {
|
|||
|
||||
try {
|
||||
// Wait for compile error:
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
|
||||
await browser.refresh()
|
||||
|
||||
// Wait for compile error to re-appear:
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
} finally {
|
||||
f.restore()
|
||||
}
|
||||
|
||||
// Wait for compile error to disappear:
|
||||
await check(
|
||||
() => hasRedbox(browser, false).then((r) => (r ? 'yes' : 'no')),
|
||||
/no/
|
||||
)
|
||||
await check(() => hasRedbox(browser).then((r) => (r ? 'yes' : 'no')), /no/)
|
||||
await browser.waitForElementByCss('#a')
|
||||
|
||||
function getRegexCount(str, regex) {
|
||||
|
|
|
@ -60,11 +60,11 @@ describe('server-side dev errors', () => {
|
|||
: err
|
||||
}, 'success')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
|
||||
expect(await getRedboxSource(browser)).toContain('missingVar')
|
||||
await fs.writeFile(gspPage, content)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
} finally {
|
||||
await fs.writeFile(gspPage, content)
|
||||
}
|
||||
|
@ -92,11 +92,11 @@ describe('server-side dev errors', () => {
|
|||
: err
|
||||
}, 'success')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
|
||||
expect(await getRedboxSource(browser)).toContain('missingVar')
|
||||
await fs.writeFile(gsspPage, content)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
} finally {
|
||||
await fs.writeFile(gsspPage, content)
|
||||
}
|
||||
|
@ -124,11 +124,11 @@ describe('server-side dev errors', () => {
|
|||
: err
|
||||
}, 'success')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
|
||||
expect(await getRedboxSource(browser)).toContain('missingVar')
|
||||
await fs.writeFile(dynamicGsspPage, content)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
} finally {
|
||||
await fs.writeFile(dynamicGsspPage, content)
|
||||
}
|
||||
|
@ -156,11 +156,11 @@ describe('server-side dev errors', () => {
|
|||
: err
|
||||
}, 'success')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
|
||||
expect(await getRedboxSource(browser)).toContain('missingVar')
|
||||
await fs.writeFile(apiPage, content)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
} finally {
|
||||
await fs.writeFile(apiPage, content)
|
||||
}
|
||||
|
@ -188,11 +188,11 @@ describe('server-side dev errors', () => {
|
|||
: err
|
||||
}, 'success')
|
||||
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
|
||||
expect(await getRedboxSource(browser)).toContain('missingVar')
|
||||
await fs.writeFile(dynamicApiPage, content)
|
||||
await hasRedbox(browser, false)
|
||||
await hasRedbox(browser)
|
||||
} finally {
|
||||
await fs.writeFile(dynamicApiPage, content)
|
||||
}
|
||||
|
|
|
@ -98,7 +98,7 @@ describe('withRouter SSR', () => {
|
|||
|
||||
it('should show an error when trying to use router methods during SSR', async () => {
|
||||
const browser = await webdriver(port, '/router-method-ssr')
|
||||
expect(await hasRedbox(browser, true)).toBe(true)
|
||||
expect(await hasRedbox(browser)).toBe(true)
|
||||
expect(await getRedboxHeader(browser)).toMatch(
|
||||
`No router instance found. you should only use "next/router" inside the client side of your app. https://`
|
||||
)
|
||||
|
|
|
@ -106,8 +106,8 @@ export async function sandbox(
|
|||
)
|
||||
}
|
||||
},
|
||||
async hasRedbox(expected = false) {
|
||||
return hasRedbox(browser, expected)
|
||||
async hasRedbox() {
|
||||
return hasRedbox(browser)
|
||||
},
|
||||
async hasErrorToast() {
|
||||
return browser.eval(() => {
|
||||
|
|
|
@ -729,8 +729,8 @@ export async function retry<T>(
|
|||
}
|
||||
}
|
||||
|
||||
export async function hasRedbox(browser: BrowserInterface, expected = true) {
|
||||
for (let i = 0; i < 30; i++) {
|
||||
export async function hasRedbox(browser: BrowserInterface): Promise<boolean> {
|
||||
await waitFor(5000)
|
||||
const result = await evaluate(browser, () => {
|
||||
return Boolean(
|
||||
[].slice
|
||||
|
@ -742,14 +742,8 @@ export async function hasRedbox(browser: BrowserInterface, expected = true) {
|
|||
)
|
||||
)
|
||||
})
|
||||
|
||||
if (result === expected) {
|
||||
return result
|
||||
}
|
||||
await waitFor(1000)
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
export async function getRedboxHeader(browser: BrowserInterface) {
|
||||
return retry(
|
||||
|
|
|
@ -916,8 +916,8 @@
|
|||
},
|
||||
"test/development/acceptance-app/ReactRefreshLogBox-scss.test.ts": {
|
||||
"passed": [],
|
||||
"failed": ["ReactRefreshLogBox app scss syntax errors"],
|
||||
"pending": [],
|
||||
"failed": [],
|
||||
"pending": ["ReactRefreshLogBox app scss syntax errors"],
|
||||
"flakey": [],
|
||||
"runtimeError": false
|
||||
},
|
||||
|
@ -930,7 +930,6 @@
|
|||
"ReactRefreshLogBox app turbo Should not show __webpack_exports__ when exporting anonymous arrow function",
|
||||
"ReactRefreshLogBox app turbo Unhandled errors and rejections opens up in the minimized state",
|
||||
"ReactRefreshLogBox app turbo boundaries",
|
||||
"ReactRefreshLogBox app turbo client component can recover from error thrown in the module",
|
||||
"ReactRefreshLogBox app turbo logbox: anchors links in error messages",
|
||||
"ReactRefreshLogBox app turbo module init error not shown",
|
||||
"ReactRefreshLogBox app turbo server component can recover from error thrown in the module",
|
||||
|
@ -939,6 +938,7 @@
|
|||
],
|
||||
"failed": [
|
||||
"ReactRefreshLogBox app turbo Call stack count is correct for server error",
|
||||
"ReactRefreshLogBox app turbo client component can recover from error thrown in the module",
|
||||
"ReactRefreshLogBox app turbo conversion to class component (1)",
|
||||
"ReactRefreshLogBox app turbo css syntax errors"
|
||||
],
|
||||
|
@ -1033,7 +1033,7 @@
|
|||
"test/development/acceptance-app/app-hmr-changes.test.ts": {
|
||||
"passed": [],
|
||||
"failed": [
|
||||
"Error overlay - RSC build errors should handle successive HMR changes with errors correctly"
|
||||
"Error overlay - RSC build errors Skipped in webpack should handle successive HMR changes with errors correctly"
|
||||
],
|
||||
"pending": [],
|
||||
"flakey": [],
|
||||
|
@ -1084,8 +1084,7 @@
|
|||
"passed": [
|
||||
"Error recovery app turbo can recover from a syntax error without losing state",
|
||||
"Error recovery app turbo client component can recover from a component error",
|
||||
"Error recovery app turbo render error not shown right after syntax error",
|
||||
"Error recovery app turbo stuck error"
|
||||
"Error recovery app turbo render error not shown right after syntax error"
|
||||
],
|
||||
"failed": [
|
||||
"Error recovery app turbo can recover from a event handler error",
|
||||
|
@ -1093,6 +1092,7 @@
|
|||
"Error recovery app turbo displays build error on initial page load",
|
||||
"Error recovery app turbo server component can recover from a component error",
|
||||
"Error recovery app turbo server component can recover from syntax error",
|
||||
"Error recovery app turbo stuck error",
|
||||
"Error recovery app turbo syntax > runtime error"
|
||||
],
|
||||
"pending": [
|
||||
|
@ -1104,7 +1104,6 @@
|
|||
"Error recovery app default render error not shown right after syntax error",
|
||||
"Error recovery app default server component can recover from a component error",
|
||||
"Error recovery app default server component can recover from syntax error",
|
||||
"Error recovery app default stuck error",
|
||||
"Error recovery app default syntax > runtime error"
|
||||
],
|
||||
"flakey": [],
|
||||
|
@ -1378,13 +1377,13 @@
|
|||
},
|
||||
"test/development/acceptance/error-recovery.test.ts": {
|
||||
"passed": [
|
||||
"ReactRefreshLogBox turbo logbox: can recover from a syntax error without losing state",
|
||||
"ReactRefreshLogBox turbo stuck error"
|
||||
"ReactRefreshLogBox turbo logbox: can recover from a syntax error without losing state"
|
||||
],
|
||||
"failed": [
|
||||
"ReactRefreshLogBox turbo logbox: can recover from a component error",
|
||||
"ReactRefreshLogBox turbo logbox: can recover from a event handler error",
|
||||
"ReactRefreshLogBox turbo render error not shown right after syntax error",
|
||||
"ReactRefreshLogBox turbo stuck error",
|
||||
"ReactRefreshLogBox turbo syntax > runtime error"
|
||||
],
|
||||
"pending": [
|
||||
|
@ -1392,7 +1391,6 @@
|
|||
"ReactRefreshLogBox default logbox: can recover from a event handler error",
|
||||
"ReactRefreshLogBox default logbox: can recover from a syntax error without losing state",
|
||||
"ReactRefreshLogBox default render error not shown right after syntax error",
|
||||
"ReactRefreshLogBox default stuck error",
|
||||
"ReactRefreshLogBox default syntax > runtime error"
|
||||
],
|
||||
"flakey": [],
|
||||
|
@ -1554,15 +1552,16 @@
|
|||
"GS(S)P Server-Side Change Reloading should not reload page when client-side is changed too GSSP",
|
||||
"GS(S)P Server-Side Change Reloading should refresh data when server import is updated",
|
||||
"GS(S)P Server-Side Change Reloading should show indicator when re-fetching data",
|
||||
"GS(S)P Server-Side Change Reloading should update on props error in getStaticProps",
|
||||
"GS(S)P Server-Side Change Reloading should update on thrown error in getStaticProps",
|
||||
"GS(S)P Server-Side Change Reloading should update page when getServerSideProps is changed only",
|
||||
"GS(S)P Server-Side Change Reloading should update page when getStaticPaths is changed only",
|
||||
"GS(S)P Server-Side Change Reloading should update page when getStaticProps is changed only",
|
||||
"GS(S)P Server-Side Change Reloading should update page when getStaticProps is changed only for /another/index",
|
||||
"GS(S)P Server-Side Change Reloading should update page when getStaticProps is changed only for /index"
|
||||
],
|
||||
"failed": [],
|
||||
"failed": [
|
||||
"GS(S)P Server-Side Change Reloading should update on props error in getStaticProps",
|
||||
"GS(S)P Server-Side Change Reloading should update on thrown error in getStaticProps"
|
||||
],
|
||||
"pending": [],
|
||||
"flakey": [],
|
||||
"runtimeError": false
|
||||
|
@ -1955,8 +1954,8 @@
|
|||
"test/development/next-font/build-errors.test.ts": {
|
||||
"passed": [],
|
||||
"failed": [
|
||||
"build-errors should show a module not found error if local font file can' be resolved",
|
||||
"build-errors should show a next/font error when input is wrong"
|
||||
"build-errors Skipped in webpack should show a module not found error if local font file can' be resolved",
|
||||
"build-errors Skipped in webpack should show a next/font error when input is wrong"
|
||||
],
|
||||
"pending": [],
|
||||
"flakey": [],
|
||||
|
|
Loading…
Reference in a new issue