diff --git a/test/development/acceptance-app/ReactRefreshLogBox-builtins.test.ts b/test/development/acceptance-app/ReactRefreshLogBox-builtins.test.ts index df5e10175e180..9bded415c95fa 100644 --- a/test/development/acceptance-app/ReactRefreshLogBox-builtins.test.ts +++ b/test/development/acceptance-app/ReactRefreshLogBox-builtins.test.ts @@ -45,7 +45,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() if (process.env.TURBOPACK) { expect(await session.getRedboxSource()).toMatchInlineSnapshot(` "./node_modules/my-package/index.js:1:13 @@ -92,7 +92,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() if (process.env.TURBOPACK) { @@ -145,7 +145,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() if (process.env.TURBOPACK) { @@ -195,7 +195,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ], ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() if (process.env.TURBOPACK) { @@ -234,7 +234,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.documentElement.innerHTML) ).toContain('index page') diff --git a/test/development/acceptance-app/ReactRefreshLogBox-scss.test.ts b/test/development/acceptance-app/ReactRefreshLogBox-scss.test.ts index 91a6bad61ce60..72458e9391e40 100644 --- a/test/development/acceptance-app/ReactRefreshLogBox-scss.test.ts +++ b/test/development/acceptance-app/ReactRefreshLogBox-scss.test.ts @@ -33,17 +33,17 @@ describe.skip('ReactRefreshLogBox scss app', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() // Syntax error await session.patch('index.module.scss', `.button { font-size: :5px; }`) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() 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()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -69,7 +69,7 @@ describe.skip('ReactRefreshLogBox scss app', () => { // 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()).toBe(true) + await session.assertHasRedbox() const source2 = await session.getRedboxSource() expect(source2).toMatchSnapshot() diff --git a/test/development/acceptance-app/ReactRefreshLogBox.test.ts b/test/development/acceptance-app/ReactRefreshLogBox.test.ts index 35be117db4867..d3b750aa38ab2 100644 --- a/test/development/acceptance-app/ReactRefreshLogBox.test.ts +++ b/test/development/acceptance-app/ReactRefreshLogBox.test.ts @@ -85,7 +85,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() if (process.platform === 'win32') { expect(await session.getRedboxSource()).toMatchSnapshot() } else { @@ -175,7 +175,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // 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. @@ -202,7 +202,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -217,7 +217,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = next.normalizeTestDirContent(await session.getRedboxSource()) if (IS_TURBOPACK) { @@ -292,7 +292,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.querySelector('p').textContent) ).toBe('hello') @@ -309,7 +309,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toMatchSnapshot() await session.patch( @@ -324,7 +324,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.querySelector('p').textContent) ).toBe('hello new') @@ -350,11 +350,11 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() // Syntax error await session.patch('index.module.css', `.button`) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() expect(source).toMatch( IS_TURBOPACK ? './index.module.css:1:9' : './index.module.css:1:1' @@ -369,7 +369,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()).toBe(true) + await session.assertHasRedbox() const source2 = await session.getRedboxSource() expect(source2).toMatchSnapshot() @@ -593,7 +593,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: {"a":1,"b":"x"}"` ) @@ -609,7 +609,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', outdent` @@ -623,7 +623,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toContain( `Error: class Hello {` ) @@ -639,7 +639,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', outdent` @@ -651,7 +651,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: string error"` ) @@ -667,7 +667,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', outdent` @@ -679,7 +679,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toContain( `Error: A null error was thrown` ) @@ -703,7 +703,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toMatchSnapshot() await cleanup() @@ -764,7 +764,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { () => browser.elementByCss('.nextjs-toast-errors').text(), /4 errors/ ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() // Add Component error await session.patch( @@ -776,7 +776,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ) // Render error should "win" and show up in fullscreen - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await cleanup() }) @@ -815,7 +815,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ])('Call stack count is correct for %s error', async (_, fixture) => { const { session, browser, cleanup } = await sandbox(next, fixture) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await expandCallStack(browser) @@ -856,7 +856,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ], ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await expandCallStack(browser) let callStackFrames = await browser.elementsByCss( '[data-nextjs-call-stack-frame]' @@ -884,7 +884,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await expandCallStack(browser) // Should still show the errored line in source code @@ -919,7 +919,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ], ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // Remove error await session.patch( @@ -933,7 +933,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { expect(await browser.waitForElementByCss('#text').text()).toBe( 'Hello world' ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() // Re-add error await session.patch( @@ -946,7 +946,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await cleanup() }) @@ -974,7 +974,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toMatchSnapshot() await cleanup() @@ -1005,7 +1005,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toMatchSnapshot() await cleanup() @@ -1017,12 +1017,12 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { const { session, cleanup } = await sandbox(next, undefined, '/' + type) await next.patchFile('index.js', "throw new Error('module error')") - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await next.patchFile( 'index.js', 'export default function Page() {return
hello world
}' ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) diff --git a/test/development/acceptance-app/ReactRefreshLogBoxMisc.test.ts b/test/development/acceptance-app/ReactRefreshLogBoxMisc.test.ts index c4c9e5ce87d96..7213ff8e8d7ac 100644 --- a/test/development/acceptance-app/ReactRefreshLogBoxMisc.test.ts +++ b/test/development/acceptance-app/ReactRefreshLogBoxMisc.test.ts @@ -30,7 +30,7 @@ describe.skip('ReactRefreshLogBox app', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: Multiple children were passed to with \`href\` of \`/\` but only one child is supported https://nextjs.org/docs/messages/link-multiple-children"` ) @@ -64,7 +64,7 @@ describe.skip('ReactRefreshLogBox app', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: Failed prop type: The prop \`href\` expects a \`string\` or \`object\` in \`\`, but got \`undefined\` instead."` ) @@ -79,7 +79,7 @@ describe.skip('ReactRefreshLogBox app', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -103,7 +103,7 @@ describe.skip('ReactRefreshLogBox app', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -127,7 +127,7 @@ describe.skip('ReactRefreshLogBox app', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -151,7 +151,7 @@ describe.skip('ReactRefreshLogBox app', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -175,7 +175,7 @@ describe.skip('ReactRefreshLogBox app', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchSnapshot() await session.patch( @@ -200,7 +200,7 @@ describe.skip('ReactRefreshLogBox app', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchSnapshot() await cleanup() @@ -227,7 +227,7 @@ describe.skip('ReactRefreshLogBox app', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await cleanup() }) }) diff --git a/test/development/acceptance-app/ReactRefreshModule.test.ts b/test/development/acceptance-app/ReactRefreshModule.test.ts index 6d7994814ea38..d4263757e4449 100644 --- a/test/development/acceptance-app/ReactRefreshModule.test.ts +++ b/test/development/acceptance-app/ReactRefreshModule.test.ts @@ -11,7 +11,7 @@ describe('ReactRefreshModule app', () => { it('should allow any variable names', async () => { const { session, cleanup } = await sandbox(next, new Map([])) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() const variables = [ '_a', @@ -33,7 +33,7 @@ describe('ReactRefreshModule app', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect(next.cliOutput).not.toContain( `'${variable}' has already been declared` ) diff --git a/test/development/acceptance-app/ReactRefreshRegression.test.ts b/test/development/acceptance-app/ReactRefreshRegression.test.ts index 1014c1f8b0453..a0e294b24f99e 100644 --- a/test/development/acceptance-app/ReactRefreshRegression.test.ts +++ b/test/development/acceptance-app/ReactRefreshRegression.test.ts @@ -74,7 +74,7 @@ describe('ReactRefreshRegression app', () => { ) // Verify no hydration mismatch: - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -279,7 +279,7 @@ describe('ReactRefreshRegression app', () => { `export default function () { throw new Error('boom'); }` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() expect(source.split(/\r?\n/g).slice(2).join('\n')).toMatchInlineSnapshot(` @@ -298,7 +298,7 @@ describe('ReactRefreshRegression app', () => { `export default function Page() { throw new Error('boom'); }` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() expect(source.split(/\r?\n/g).slice(2).join('\n')).toMatchInlineSnapshot(` @@ -320,7 +320,7 @@ describe('ReactRefreshRegression app', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() expect(source.split(/\r?\n/g).slice(2).join('\n')).toMatchInlineSnapshot(` @@ -371,7 +371,7 @@ describe('ReactRefreshRegression app', () => { let didNotReload = await session.patch('app/content.mdx', `Hello Foo!`) expect(didNotReload).toBe(true) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate( () => document.querySelector('#content').textContent @@ -380,7 +380,7 @@ describe('ReactRefreshRegression app', () => { didNotReload = await session.patch('app/content.mdx', `Hello Bar!`) expect(didNotReload).toBe(true) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate( () => document.querySelector('#content').textContent diff --git a/test/development/acceptance-app/app-hmr-changes.test.ts b/test/development/acceptance-app/app-hmr-changes.test.ts index c891f56989ed6..8401723a7b392 100644 --- a/test/development/acceptance-app/app-hmr-changes.test.ts +++ b/test/development/acceptance-app/app-hmr-changes.test.ts @@ -51,12 +51,12 @@ describe('Error overlay - RSC build errors', () => { await session.patch(pagePath, break2.replace('break 3', 'Hello world
` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // Fix syntax error await session.patch( @@ -170,7 +170,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect(await session.hasErrorToast()).toBe(false) expect( @@ -181,7 +181,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { await session.evaluate(() => document.querySelector('p').textContent) ).toBe('Count: 2') - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect(await session.hasErrorToast()).toBe(false) await cleanup() @@ -232,7 +232,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( 'export default function Child()' ) @@ -249,7 +249,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()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.querySelector('p').textContent) ).toBe('Hello') @@ -310,14 +310,14 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { ) await new Promise((resolve) => setTimeout(resolve, 1000)) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( "Expected '}', got 'hello dynamic world
', 'undefined') ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() 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.` ) @@ -363,7 +363,7 @@ describe('Error overlay - RSC build errors', () => { 'export default function Error() {}' ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await check( () => session.getRedboxSource(), /must be a Client \n| Component/ @@ -412,7 +412,7 @@ describe('Error overlay - RSC build errors', () => { // Empty file await session.patch('app/server-with-errors/error-file/error.js', '') - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await check(() => session.getRedboxSource(), /must be a Client Component/) // TODO: investigate flakey snapshot due to spacing below @@ -459,10 +459,7 @@ describe('Error overlay - RSC build errors', () => { await session.patch(pagePath, content) - await check( - async () => ((await session.hasRedbox()) ? 'success' : 'fail'), - /success/ - ) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toContain( 'Cannot add property x, object is not extensible' diff --git a/test/development/acceptance-app/rsc-runtime-errors.test.ts b/test/development/acceptance-app/rsc-runtime-errors.test.ts index d11dbf45025a3..fc7a28308d209 100644 --- a/test/development/acceptance-app/rsc-runtime-errors.test.ts +++ b/test/development/acceptance-app/rsc-runtime-errors.test.ts @@ -2,11 +2,11 @@ import path from 'path' import { outdent } from 'outdent' import { FileRef, nextTestSetup } from 'e2e-utils' import { + assertHasRedbox, check, getRedboxDescription, getRedboxSource, getVersionCheckerText, - hasRedbox, retry, } from 'next-test-utils' @@ -29,10 +29,7 @@ describe('Error overlay - RSC runtime errors', () => { const browser = await next.browser('/server') - await check( - async () => ((await hasRedbox(browser)) ? 'success' : 'fail'), - /success/ - ) + assertHasRedbox(browser) const errorDescription = await getRedboxDescription(browser) expect(errorDescription).toContain( @@ -55,10 +52,7 @@ describe('Error overlay - RSC runtime errors', () => { const browser = await next.browser('/client') - await check( - async () => ((await hasRedbox(browser)) ? 'success' : 'fail'), - /success/ - ) + assertHasRedbox(browser) const errorDescription = await getRedboxDescription(browser) expect(errorDescription).toContain( @@ -77,10 +71,7 @@ describe('Error overlay - RSC runtime errors', () => { ) const browser = await next.browser('/server') - await check( - async () => ((await hasRedbox(browser)) ? 'success' : 'fail'), - /success/ - ) + assertHasRedbox(browser) const errorDescription = await getRedboxDescription(browser) @@ -98,10 +89,7 @@ describe('Error overlay - RSC runtime errors', () => { ` ) const browser = await next.browser('/server') - await check( - async () => ((await hasRedbox(browser)) ? 'success' : 'fail'), - /success/ - ) + assertHasRedbox(browser) const source = await getRedboxSource(browser) // Can show the original source code @@ -120,9 +108,7 @@ describe('Error overlay - RSC runtime errors', () => { ) const browser = await next.browser('/server') - await retry(async () => { - expect(await hasRedbox(browser)).toBe(true) - }) + assertHasRedbox(browser) const versionText = await getVersionCheckerText(browser) await expect(versionText).toMatch(/Next.js \([\w.-]+\)/) }) @@ -138,9 +124,7 @@ describe('Error overlay - RSC runtime errors', () => { ) const browser = await next.browser('/server') - await retry(async () => { - expect(await hasRedbox(browser)).toBe(true) - }) + assertHasRedbox(browser) const source = await getRedboxSource(browser) expect(source).toContain('app/server/page.js') expect(source).not.toContain('//app/server/page.js') diff --git a/test/development/acceptance-app/server-components.test.ts b/test/development/acceptance-app/server-components.test.ts index 88d1a1fdea40e..80ce6544e6f29 100644 --- a/test/development/acceptance-app/server-components.test.ts +++ b/test/development/acceptance-app/server-components.test.ts @@ -541,7 +541,7 @@ describe('Error Overlay for server components', () => { ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // In webpack when the message too long it gets truncated with ` | ` with new lines. // So we need to check for the first part of the message. const normalizedSource = await session.getRedboxSource() diff --git a/test/development/acceptance/ReactRefreshLogBox-app-doc.test.ts b/test/development/acceptance/ReactRefreshLogBox-app-doc.test.ts index 133454648a3ff..17e656366be53 100644 --- a/test/development/acceptance/ReactRefreshLogBox-app-doc.test.ts +++ b/test/development/acceptance/ReactRefreshLogBox-app-doc.test.ts @@ -17,7 +17,7 @@ describe.each(['default', 'turbo'])( next, new Map([['pages/_app.js', ``]]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: The default export is not a React Component in page: "/_app""` ) @@ -31,7 +31,7 @@ describe.each(['default', 'turbo'])( export default MyApp ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -40,7 +40,7 @@ describe.each(['default', 'turbo'])( next, new Map([['pages/_document.js', ``]]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: The default export is not a React Component in page: "/_document""` ) @@ -72,7 +72,7 @@ describe.each(['default', 'turbo'])( export default MyDocument ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -91,7 +91,7 @@ describe.each(['default', 'turbo'])( ], ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const content = await session.getRedboxSource() const source = next.normalizeTestDirContent(content) if (process.env.TURBOPACK) { @@ -142,7 +142,7 @@ describe.each(['default', 'turbo'])( export default MyApp ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -179,7 +179,7 @@ describe.each(['default', 'turbo'])( ], ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = next.normalizeTestDirContent( await session.getRedboxSource() ) @@ -244,7 +244,7 @@ describe.each(['default', 'turbo'])( export default MyDocument ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) } diff --git a/test/development/acceptance/ReactRefreshLogBox-builtins.test.ts b/test/development/acceptance/ReactRefreshLogBox-builtins.test.ts index 7dea7a2af3dbe..0d043daeb6849 100644 --- a/test/development/acceptance/ReactRefreshLogBox-builtins.test.ts +++ b/test/development/acceptance/ReactRefreshLogBox-builtins.test.ts @@ -44,7 +44,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() if (process.env.TURBOPACK) { expect(await session.getRedboxSource()).toMatchInlineSnapshot(` "./node_modules/my-package/index.js:1:13 @@ -92,7 +92,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() if (process.env.TURBOPACK) { @@ -145,7 +145,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() if (process.env.TURBOPACK) { @@ -201,7 +201,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ], ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() if (process.env.TURBOPACK) { @@ -238,7 +238,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.documentElement.innerHTML) ).toContain('index page') diff --git a/test/development/acceptance/ReactRefreshLogBox-scss.test.ts b/test/development/acceptance/ReactRefreshLogBox-scss.test.ts index 717dd8ce29505..7ad2d6857e15e 100644 --- a/test/development/acceptance/ReactRefreshLogBox-scss.test.ts +++ b/test/development/acceptance/ReactRefreshLogBox-scss.test.ts @@ -32,11 +32,11 @@ describe.skip('ReactRefreshLogBox scss', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() // Syntax error await session.patch('index.module.scss', `.button { font-size: :5px; }`) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() expect(source).toMatchSnapshot() @@ -64,7 +64,7 @@ describe.skip('ReactRefreshLogBox scss', () => { // 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()).toBe(true) + await session.assertHasRedbox() const source2 = await session.getRedboxSource() expect(source2).toMatchSnapshot() diff --git a/test/development/acceptance/ReactRefreshLogBox.test.ts b/test/development/acceptance/ReactRefreshLogBox.test.ts index 22a49c4565aaa..947bbcceb29e3 100644 --- a/test/development/acceptance/ReactRefreshLogBox.test.ts +++ b/test/development/acceptance/ReactRefreshLogBox.test.ts @@ -35,7 +35,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ) await session.evaluate(() => document.querySelector('a').click()) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toMatchSnapshot() await cleanup() @@ -80,7 +80,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toMatchSnapshot() await cleanup() @@ -141,7 +141,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { `export default function FunctionDefault() { throw new Error('no'); }` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toMatchSnapshot() expect( await session.evaluate(() => document.querySelector('h2').textContent) @@ -165,7 +165,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { }` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // 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. @@ -192,7 +192,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -207,7 +207,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = next.normalizeTestDirContent(await session.getRedboxSource()) if (process.env.TURBOPACK) { expect(source).toMatchInlineSnapshot(` @@ -281,7 +281,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.querySelector('p').textContent) ).toBe('hello') @@ -298,7 +298,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toMatchSnapshot() await session.patch( @@ -313,7 +313,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.querySelector('p').textContent) ).toBe('hello new') @@ -339,11 +339,11 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() // Syntax error await session.patch('index.module.css', `.button`) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const source = await session.getRedboxSource() expect(source).toMatch( process.env.TURBOPACK @@ -365,7 +365,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()).toBe(true) + await session.assertHasRedbox() const source2 = await session.getRedboxSource() expect(source2).toMatchSnapshot() @@ -393,9 +393,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.evaluate(() => document.querySelector('button').click()) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const header = await session.getRedboxDescription() expect(header).toMatchSnapshot() @@ -439,9 +439,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.evaluate(() => document.querySelector('button').click()) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const header2 = await session.getRedboxDescription() expect(header2).toMatchSnapshot() @@ -485,9 +485,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.evaluate(() => document.querySelector('button').click()) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const header3 = await session.getRedboxDescription() expect(header3).toMatchSnapshot() @@ -531,9 +531,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.evaluate(() => document.querySelector('button').click()) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const header4 = await session.getRedboxDescription() expect(header4).toMatchInlineSnapshot( @@ -592,9 +592,9 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.evaluate(() => document.querySelector('button').click()) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const header5 = await session.getRedboxDescription() expect(header5).toMatchInlineSnapshot( @@ -653,7 +653,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: {"a":1,"b":"x"}"` ) @@ -669,7 +669,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', outdent` @@ -683,7 +683,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toContain( `Error: class Hello {` ) @@ -699,7 +699,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', outdent` @@ -711,7 +711,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: string error"` ) @@ -727,7 +727,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', outdent` @@ -739,7 +739,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toContain( `Error: A null error was thrown` ) @@ -765,7 +765,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await expandCallStack(browser) @@ -806,7 +806,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ], ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await expandCallStack(browser) let callStackFrames = await browser.elementsByCss( '[data-nextjs-call-stack-frame]' @@ -836,7 +836,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ], ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await expandCallStack(browser) // Should still show the errored line in source code diff --git a/test/development/acceptance/ReactRefreshLogBoxMisc.test.ts b/test/development/acceptance/ReactRefreshLogBoxMisc.test.ts index db690b7916805..644266db29187 100644 --- a/test/development/acceptance/ReactRefreshLogBoxMisc.test.ts +++ b/test/development/acceptance/ReactRefreshLogBoxMisc.test.ts @@ -30,7 +30,7 @@ describe.skip('ReactRefreshLogBox', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: Multiple children were passed to 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()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: Failed prop type: The prop \`href\` expects a \`string\` or \`object\` in \`\`, but got \`undefined\` instead."` ) @@ -79,7 +79,7 @@ describe.skip('ReactRefreshLogBox', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -103,7 +103,7 @@ describe.skip('ReactRefreshLogBox', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -127,7 +127,7 @@ describe.skip('ReactRefreshLogBox', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -151,7 +151,7 @@ describe.skip('ReactRefreshLogBox', () => { } ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await session.patch( 'index.js', @@ -175,7 +175,7 @@ describe.skip('ReactRefreshLogBox', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchSnapshot() await session.patch( @@ -200,7 +200,7 @@ describe.skip('ReactRefreshLogBox', () => { } ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchSnapshot() await cleanup() @@ -226,7 +226,7 @@ describe.skip('ReactRefreshLogBox', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await cleanup() }) }) diff --git a/test/development/acceptance/ReactRefreshModule.test.ts b/test/development/acceptance/ReactRefreshModule.test.ts index 8dd5a4a3b128a..4fbadb4125afb 100644 --- a/test/development/acceptance/ReactRefreshModule.test.ts +++ b/test/development/acceptance/ReactRefreshModule.test.ts @@ -10,7 +10,7 @@ describe('ReactRefreshModule', () => { it('should allow any variable names', async () => { const { session, cleanup } = await sandbox(next) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() const variables = [ '_a', @@ -29,7 +29,7 @@ describe('ReactRefreshModule', () => { return null }` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect(next.cliOutput).not.toContain( `'${variable}' has already been declared` ) diff --git a/test/development/acceptance/ReactRefreshRegression.test.ts b/test/development/acceptance/ReactRefreshRegression.test.ts index 442538e020139..787dd128108d9 100644 --- a/test/development/acceptance/ReactRefreshRegression.test.ts +++ b/test/development/acceptance/ReactRefreshRegression.test.ts @@ -74,7 +74,7 @@ describe('ReactRefreshRegression', () => { ) // Verify no hydration mismatch: - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -283,7 +283,7 @@ describe('ReactRefreshRegression', () => { ) expect(didNotReload).toBe(false) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() 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()).toBe(false) + await session.assertNoRedbox() 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()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate( () => document.querySelector('#__next').textContent diff --git a/test/development/acceptance/error-recovery.test.ts b/test/development/acceptance/error-recovery.test.ts index 1aaf2cb034d1a..5381d6749f7a8 100644 --- a/test/development/acceptance/error-recovery.test.ts +++ b/test/development/acceptance/error-recovery.test.ts @@ -39,7 +39,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { await session.patch('index.js', `export default () =>