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', '')) await session.patch(pagePath, break2) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await session.patch(pagePath, break1) await session.patch(pagePath, originalPage) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() } expect( diff --git a/test/development/acceptance-app/dynamic-error.test.ts b/test/development/acceptance-app/dynamic-error.test.ts index 26e3c15ea9302..beccee29e6ca9 100644 --- a/test/development/acceptance-app/dynamic-error.test.ts +++ b/test/development/acceptance-app/dynamic-error.test.ts @@ -30,7 +30,7 @@ describe('dynamic = "error" in devmode', () => { ` ) - await session.hasRedbox() + await session.assertHasRedbox() console.log(await session.getRedboxDescription()) expect(await session.getRedboxDescription()).toMatchInlineSnapshot( `"Error: Route /server 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"` diff --git a/test/development/acceptance-app/editor-links.test.ts b/test/development/acceptance-app/editor-links.test.ts index 7fc71e8a2ebaa..7cb3172f352a5 100644 --- a/test/development/acceptance-app/editor-links.test.ts +++ b/test/development/acceptance-app/editor-links.test.ts @@ -65,7 +65,7 @@ describe('Error overlay - editor links', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await clickSourceFile(browser) await check(() => editorRequestsCount, /1/) @@ -110,7 +110,7 @@ describe('Error overlay - editor links', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await clickImportTraceFiles(browser) await check(() => editorRequestsCount, /4/) @@ -153,7 +153,7 @@ describe('Error overlay - editor links', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await clickImportTraceFiles(browser) await check(() => editorRequestsCount, /3/) diff --git a/test/development/acceptance-app/error-message-url.test.ts b/test/development/acceptance-app/error-message-url.test.ts index dcc8e0cddbfec..0ca82afd69f58 100644 --- a/test/development/acceptance-app/error-message-url.test.ts +++ b/test/development/acceptance-app/error-message-url.test.ts @@ -19,7 +19,7 @@ describe('Error overlay - error message urls', () => { content + '\nexport function getServerSideProps() {}' ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const link = await browser.elementByCss('[data-nextjs-terminal] a') const text = await link.text() diff --git a/test/development/acceptance-app/error-recovery.test.ts b/test/development/acceptance-app/error-recovery.test.ts index 3dd54b90e9646..596065e363f2c 100644 --- a/test/development/acceptance-app/error-recovery.test.ts +++ b/test/development/acceptance-app/error-recovery.test.ts @@ -39,7 +39,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { await session.patch('index.js', `export default () =>
{ ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await check( () => session.evaluate(() => document.querySelector('p').textContent), @@ -89,7 +89,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { return

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 ''" ) // Test that runtime error does not take over: await new Promise((resolve) => setTimeout(resolve, 2000)) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( "Expected '}', got ''" ) @@ -368,7 +368,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { ) // We get an error because Foo didn't import React. Fair. - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( "return React.createElement('h1', null, 'Foo');" ) @@ -385,7 +385,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { ) // Expected: this fixes the problem - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -428,7 +428,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { export default ClassDefault; ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // Now change the code to introduce a runtime error without fixing the syntax error: await session.patch( @@ -446,7 +446,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { export default ClassDefault; ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // Now fix the syntax error: await session.patch( @@ -464,7 +464,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { export default ClassDefault; ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await check(async () => { const source = await session.getRedboxSource() @@ -484,7 +484,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { new Map([['app/page.js', '{{{']]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await check(() => session.getRedboxSource(true), /Failed to compile/) await cleanup() diff --git a/test/development/acceptance-app/hydration-error.test.ts b/test/development/acceptance-app/hydration-error.test.ts index a04c38ed5e0e6..96ec8a8f6d13f 100644 --- a/test/development/acceptance-app/hydration-error.test.ts +++ b/test/development/acceptance-app/hydration-error.test.ts @@ -83,7 +83,7 @@ describe('Error overlay for hydration errors', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect(await browser.elementByCss('.child').text()).toBe('Value') @@ -336,7 +336,7 @@ describe('Error overlay for hydration errors', () => { ) await session.waitForAndOpenRuntimeError() - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await getRedboxTotalErrorCount(browser)).toBe(1) @@ -396,7 +396,7 @@ describe('Error overlay for hydration errors', () => { ) await session.waitForAndOpenRuntimeError() - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await getRedboxTotalErrorCount(browser)).toBe(1) @@ -451,7 +451,7 @@ describe('Error overlay for hydration errors', () => { ) await session.waitForAndOpenRuntimeError() - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const description = await session.getRedboxDescription() expect(description).toContain( @@ -523,7 +523,7 @@ describe('Error overlay for hydration errors', () => { ) await session.waitForAndOpenRuntimeError() - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await cleanup() }) @@ -569,7 +569,7 @@ describe('Error overlay for hydration errors', () => { ) await session.waitForAndOpenRuntimeError() - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() const pseudoHtml = await session.getRedboxComponentStack() if (isTurbopack) { diff --git a/test/development/acceptance-app/invalid-imports.test.ts b/test/development/acceptance-app/invalid-imports.test.ts index 656ed0684b313..02163df3026f0 100644 --- a/test/development/acceptance-app/invalid-imports.test.ts +++ b/test/development/acceptance-app/invalid-imports.test.ts @@ -63,7 +63,7 @@ describe('Error Overlay invalid imports', () => { const withoutUseClient = content.replace("'use client'", '') await session.patch(pageFile, withoutUseClient) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() if (process.env.TURBOPACK) { expect(await session.getRedboxSource()).toMatchInlineSnapshot(` "./app @@ -147,7 +147,7 @@ describe('Error Overlay invalid imports', () => { const withoutUseClient = content.replace("'use client'", '') await session.patch(pageFile, withoutUseClient) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() if (process.env.TURBOPACK) { expect(await session.getRedboxSource()).toMatchInlineSnapshot(` "./node_modules/client-only-package @@ -229,7 +229,7 @@ describe('Error Overlay invalid imports', () => { const content = await next.readFile(file) await session.patch(file, "'use client'\n" + content) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() if (process.env.TURBOPACK) { expect(await session.getRedboxSource()).toMatchInlineSnapshot(` "./node_modules/server-only-package diff --git a/test/development/acceptance-app/rsc-build-errors.test.ts b/test/development/acceptance-app/rsc-build-errors.test.ts index 239328c6b984c..3fb1c25c30dae 100644 --- a/test/development/acceptance-app/rsc-build-errors.test.ts +++ b/test/development/acceptance-app/rsc-build-errors.test.ts @@ -25,7 +25,7 @@ describe('Error overlay - RSC build errors', () => { ) await session.patch(pageFile, uncomment) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( '"getServerSideProps" is not supported in app/' ) @@ -49,14 +49,14 @@ describe('Error overlay - RSC build errors', () => { 'export const metadata' ) await session.patch(pageFile, uncomment) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() 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()).toBe(false) + await session.assertNoRedbox() // Add `generateMetadata` error uncomment = content.replace( @@ -64,14 +64,14 @@ describe('Error overlay - RSC build errors', () => { 'export async function generateMetadata' ) await session.patch(pageFile, uncomment) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( 'You are attempting to export "generateMetadata" from a component marked with "use client", which is disallowed.' ) // Fix the error again to test error overlay works with hmr rebuild await session.patch(pageFile, content) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -91,7 +91,7 @@ describe('Error overlay - RSC build errors', () => { ) await session.patch(pageFile, uncomment) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( '"metadata" and "generateMetadata" cannot be exported at the same time, please keep one of them.' ) @@ -116,7 +116,7 @@ describe('Error overlay - RSC build errors', () => { await session.patch(pageFile, uncomment) await next.patchFile(pageFile, content) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( '"getStaticProps" is not supported in app/' ) @@ -136,7 +136,7 @@ describe('Error overlay - RSC build errors', () => { 'export const a = 123' ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toInclude( 'The default export is not a React Component in page: "/server-with-errors/page-export"' ) @@ -151,7 +151,7 @@ describe('Error overlay - RSC build errors', () => { '/server-with-errors/page-export-initial-error' ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toInclude( 'The default export is not a React Component in page: "/server-with-errors/page-export-initial-error"' ) @@ -171,7 +171,7 @@ describe('Error overlay - RSC build errors', () => { const uncomment = content.replace("// 'use client'", "'use client'") await next.patchFile(pageFile, uncomment) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( 'directive must be placed before other expressions' ) @@ -194,7 +194,7 @@ describe('Error overlay - RSC build errors', () => { ) await session.patch(pageFile, uncomment) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( `You’re importing a class component. It only works in a Client Component` ) @@ -218,7 +218,7 @@ describe('Error overlay - RSC build errors', () => { ) await next.patchFile(file, uncomment) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() if (isTurbopack) { // TODO: fix the issue ordering. // turbopack emits the resolve issue first instead of the transform issue. @@ -268,7 +268,7 @@ describe('Error overlay - RSC build errors', () => { `/server-with-errors/react-apis/${api.toLowerCase()}` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( // `Component` has a custom error message api === 'Component' @@ -294,7 +294,7 @@ describe('Error overlay - RSC build errors', () => { `/server-with-errors/react-dom-apis/${api.toLowerCase()}` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( `You're importing a component that needs \`${api}\`. This React hook only works in a client component. To fix, mark the file (or its parent) with the \`"use client"\` directive.` ) @@ -320,7 +320,7 @@ describe('Error overlay - RSC build errors', () => { await session.patch(file, uncomment) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() 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.` ) @@ -342,7 +342,7 @@ describe('Error overlay - RSC build errors', () => { content.replace('() =>

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 () =>
{ /Count: 1/ ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() 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()).toBe(true) + await session.assertHasRedbox() if (isTurbopack) { expect(await session.getRedboxSource()).toMatchInlineSnapshot(` "index.js (7:11) @ @@ -148,7 +148,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.querySelector('p').textContent) @@ -158,7 +158,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { await session.evaluate(() => document.querySelector('p').textContent) ).toBe('Count: 2') - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -204,7 +204,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( 'export default function Child()' ) @@ -219,7 +219,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ) expect(didNotReload).toBe(true) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect( await session.evaluate(() => document.querySelector('p').textContent) ).toBe('Hello') @@ -265,7 +265,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { export default ClassDefault; ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // Now change the code to introduce a runtime error without fixing the syntax error: await session.patch( @@ -283,7 +283,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { export default ClassDefault; ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() // Now fix the syntax error: await session.patch( @@ -301,7 +301,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { export default ClassDefault; ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await check(async () => { const source = await session.getRedboxSource() @@ -358,7 +358,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ) // We get an error because Foo didn't import React. Fair. - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource()).toInclude( "return React.createElement('h1', null, 'Foo');" ) @@ -375,7 +375,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ) // Expected: this fixes the problem - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() await cleanup() }) @@ -412,7 +412,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ) await new Promise((resolve) => setTimeout(resolve, 1000)) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() if (process.platform === 'win32') { expect(await session.getRedboxSource()).toMatchSnapshot() } else { @@ -433,7 +433,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ) await new Promise((resolve) => setTimeout(resolve, 1000)) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() let redboxSource = next.normalizeTestDirContent( await session.getRedboxSource() ) @@ -474,7 +474,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()).toBe(true) + await session.assertHasRedbox() redboxSource = next.normalizeTestDirContent(await session.getRedboxSource()) if (isTurbopack) { // TODO: Remove this branching once import traces are implemented in Turbopack diff --git a/test/development/acceptance/hydration-error.test.ts b/test/development/acceptance/hydration-error.test.ts index 1541390c22de4..47590983fd1e6 100644 --- a/test/development/acceptance/hydration-error.test.ts +++ b/test/development/acceptance/hydration-error.test.ts @@ -30,7 +30,7 @@ describe('Error overlay for hydration errors', () => { ]) ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toMatchInlineSnapshot(` "Hydration failed because the server rendered HTML didn't match the client. As a result this tree will be regenerated on the client. This can happen if a SSR-ed Client Component used @@ -59,7 +59,7 @@ describe('Error overlay for hydration errors', () => { ` ) - expect(await session.hasRedbox()).toBe(false) + await session.assertNoRedbox() expect(await browser.elementByCss('.child').text()).toBe('Value') diff --git a/test/development/acceptance/server-component-compiler-errors-in-pages.test.ts b/test/development/acceptance/server-component-compiler-errors-in-pages.test.ts index af432f3ed78f3..e567412b167f5 100644 --- a/test/development/acceptance/server-component-compiler-errors-in-pages.test.ts +++ b/test/development/acceptance/server-component-compiler-errors-in-pages.test.ts @@ -44,7 +44,7 @@ describe('Error Overlay for server components compiler errors in pages', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await check( () => session.getRedboxSource(), /That only works in a Server Component/ @@ -103,7 +103,7 @@ describe('Error Overlay for server components compiler errors in pages', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await check( () => session.getRedboxSource(), /That only works in a Server Component/ @@ -161,7 +161,7 @@ describe('Error Overlay for server components compiler errors in pages', () => { ` ) - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() await check( () => session.getRedboxSource(), /That only works in a Server Component/ diff --git a/test/development/app-dir/basic/basic.test.ts b/test/development/app-dir/basic/basic.test.ts index 3d5396371c6b6..33af70a1b028a 100644 --- a/test/development/app-dir/basic/basic.test.ts +++ b/test/development/app-dir/basic/basic.test.ts @@ -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()).toBe(false) + await session.assertNoRedbox() 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()).toBe(false) + await session.assertNoRedbox() await waitFor(1000) } diff --git a/test/development/app-dir/dynamic-error-trace/index.test.ts b/test/development/app-dir/dynamic-error-trace/index.test.ts index 6ec0d6191a2a7..eeb2d38e30103 100644 --- a/test/development/app-dir/dynamic-error-trace/index.test.ts +++ b/test/development/app-dir/dynamic-error-trace/index.test.ts @@ -1,7 +1,7 @@ import { nextTestSetup } from 'e2e-utils' import { + assertHasRedbox, getRedboxCallStack, - hasRedbox, shouldRunTurboDevTest, expandCallStack, getRedboxSource, @@ -29,7 +29,7 @@ describe('app dir - dynamic error trace', () => { it('should show the error trace', async () => { const browser = await next.browser('/') - await hasRedbox(browser) + assertHasRedbox(browser) await expandCallStack(browser) const callStack = await getRedboxCallStack(browser) diff --git a/test/development/app-dir/edge-errors-hmr/index.test.ts b/test/development/app-dir/edge-errors-hmr/index.test.ts index 37ef617addc1e..b5bb4f930e6ae 100644 --- a/test/development/app-dir/edge-errors-hmr/index.test.ts +++ b/test/development/app-dir/edge-errors-hmr/index.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { hasRedbox } from 'next-test-utils' +import { assertHasRedbox } from 'next-test-utils' describe('develop - app-dir - edge errros hmr', () => { const { next } = nextTestSetup({ @@ -14,11 +14,11 @@ describe('develop - app-dir - edge errros hmr', () => { return content.replace('{/* < */}', '<') // uncomment }) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await next.patchFile('app/comp.server.js', clientComponentSource) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) }) it('should recover from build errors when client component error', async () => { @@ -29,10 +29,10 @@ describe('develop - app-dir - edge errros hmr', () => { return content.replace('{/* < */}', '<') // uncomment }) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await next.patchFile('app/comp.client.js', clientComponentSource) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) }) }) diff --git a/test/development/app-dir/hmr-deleted-page/hmr-deleted-page.test.ts b/test/development/app-dir/hmr-deleted-page/hmr-deleted-page.test.ts index 62c37409c03a0..f6cbda6de6630 100644 --- a/test/development/app-dir/hmr-deleted-page/hmr-deleted-page.test.ts +++ b/test/development/app-dir/hmr-deleted-page/hmr-deleted-page.test.ts @@ -1,7 +1,7 @@ import { join } from 'path' import { nextTestSetup, FileRef } from 'e2e-utils' -import { hasRedbox } from 'next-test-utils' +import { assertHasRedbox, assertNoRedbox } from 'next-test-utils' import { waitForHydration } from 'development-sandbox' describe('hmr-deleted-page', () => { @@ -19,12 +19,12 @@ describe('hmr-deleted-page', () => { await next.deleteFile('app/page/style.css') await waitForHydration(browser) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await next.deleteFile('app/page') await waitForHydration(browser) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(await browser.elementByCss('h1').text()).toBe('404') }) }) diff --git a/test/development/app-dir/hmr-move-file/hmr-move-file.test.ts b/test/development/app-dir/hmr-move-file/hmr-move-file.test.ts index 8e0c038b354f7..d426994c41f49 100644 --- a/test/development/app-dir/hmr-move-file/hmr-move-file.test.ts +++ b/test/development/app-dir/hmr-move-file/hmr-move-file.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { hasRedbox } from 'next-test-utils' +import { assertNoRedbox } from 'next-test-utils' describe('HMR Move File', () => { const { next } = nextTestSetup({ @@ -17,7 +17,7 @@ describe('HMR Move File', () => { content.replace('./button', './button2') ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(await browser.elementByCss('#hello-world-button').text()).toBe( 'hello world' diff --git a/test/development/app-dir/missing-required-html-tags/index.test.ts b/test/development/app-dir/missing-required-html-tags/index.test.ts index a2ef8ce70245d..453fb7e2b3c58 100644 --- a/test/development/app-dir/missing-required-html-tags/index.test.ts +++ b/test/development/app-dir/missing-required-html-tags/index.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { getRedboxDescription, hasRedbox, retry } from 'next-test-utils' +import { assertHasRedbox, getRedboxDescription, retry } from 'next-test-utils' describe('app-dir - missing required html tags', () => { const { next } = nextTestSetup({ files: __dirname }) @@ -7,7 +7,7 @@ describe('app-dir - missing required html tags', () => { it('should show error overlay', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatchInlineSnapshot(` "The following tags are missing in the Root Layout: , . Read more at https://nextjs.org/docs/messages/missing-root-layout-tags" @@ -21,7 +21,7 @@ describe('app-dir - missing required html tags', () => { code.replace('return children', 'return {children}') ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatchInlineSnapshot(` "The following tags are missing in the Root Layout: . Read more at https://nextjs.org/docs/messages/missing-root-layout-tags" @@ -34,7 +34,7 @@ describe('app-dir - missing required html tags', () => { ) ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(await browser.elementByCss('p').text()).toBe('hello world') // Reintroduce the bug, but only missing html tag @@ -46,7 +46,7 @@ describe('app-dir - missing required html tags', () => { ) await retry(async () => { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) }) // Fix the issue again @@ -58,7 +58,7 @@ describe('app-dir - missing required html tags', () => { ) await retry(async () => { - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) }) }) }) diff --git a/test/development/basic/barrel-optimization/barrel-optimization-mui.test.ts b/test/development/basic/barrel-optimization/barrel-optimization-mui.test.ts index c6ba2ab60eba7..2305bba210b93 100644 --- a/test/development/basic/barrel-optimization/barrel-optimization-mui.test.ts +++ b/test/development/basic/barrel-optimization/barrel-optimization-mui.test.ts @@ -1,6 +1,6 @@ import { join } from 'path' import { nextTestSetup } from 'e2e-utils' -import { hasRedbox } from 'next-test-utils' +import { assertNoRedbox } from 'next-test-utils' // Skipped in Turbopack, will be added later. ;(process.env.TURBOPACK ? describe.skip : describe)( @@ -32,7 +32,7 @@ import { hasRedbox } from 'next-test-utils' expect(await $('#typography').text()).toContain('typography') const browser = await next.browser('/mui') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) const modules = [...logs.matchAll(/\((\d+) modules\)/g)] expect(modules.length).toBeGreaterThanOrEqual(1) diff --git a/test/development/basic/barrel-optimization/barrel-optimization-tremor.test.ts b/test/development/basic/barrel-optimization/barrel-optimization-tremor.test.ts index 442bc481fc78e..0df2022820d58 100644 --- a/test/development/basic/barrel-optimization/barrel-optimization-tremor.test.ts +++ b/test/development/basic/barrel-optimization/barrel-optimization-tremor.test.ts @@ -1,6 +1,6 @@ import { join } from 'path' import { nextTestSetup } from 'e2e-utils' -import { hasRedbox } from 'next-test-utils' +import { assertNoRedbox } from 'next-test-utils' describe('optimizePackageImports - mui', () => { const { next } = nextTestSetup({ @@ -20,6 +20,6 @@ describe('optimizePackageImports - mui', () => { it('should work', async () => { // Without barrel optimization, the reproduction breaks. const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) }) }) diff --git a/test/development/basic/gssp-ssr-change-reloading/test/index.test.ts b/test/development/basic/gssp-ssr-change-reloading/test/index.test.ts index 6b0eb00208c40..59fbac9c3094b 100644 --- a/test/development/basic/gssp-ssr-change-reloading/test/index.test.ts +++ b/test/development/basic/gssp-ssr-change-reloading/test/index.test.ts @@ -3,7 +3,12 @@ import { join } from 'path' import webdriver from 'next-webdriver' import { createNext, FileRef } from 'e2e-utils' -import { check, getRedboxHeader, hasRedbox } from 'next-test-utils' +import { + assertHasRedbox, + assertNoRedbox, + check, + getRedboxHeader, +} from 'next-test-utils' import { NextInstance } from 'e2e-utils' const installCheckVisible = (browser) => { @@ -271,13 +276,13 @@ describe('GS(S)P Server-Side Change Reloading', () => { try { await next.patchFile(page, originalContent.replace('props:', 'propss:')) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'Additional keys were returned from' ) await next.patchFile(page, originalContent) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } finally { await next.patchFile(page, originalContent) } @@ -301,11 +306,11 @@ describe('GS(S)P Server-Side Change Reloading', () => { 'throw new Error("custom oops"); const count' ) ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain('custom oops') await next.patchFile(page, originalContent) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } finally { await next.patchFile(page, originalContent) } diff --git a/test/development/basic/hmr.test.ts b/test/development/basic/hmr.test.ts index 2bf502bb4e501..46776c0be016c 100644 --- a/test/development/basic/hmr.test.ts +++ b/test/development/basic/hmr.test.ts @@ -2,12 +2,13 @@ import { join } from 'path' import cheerio from 'cheerio' import webdriver from 'next-webdriver' import { + assertHasRedbox, + assertNoRedbox, check, getBrowserBodyText, getRedboxHeader, getRedboxDescription, getRedboxSource, - hasRedbox, renderViaHTTP, retry, waitFor, @@ -498,7 +499,7 @@ describe.each([[''], ['/docs']])( await next.patchFile(aboutPage, aboutContent.replace('
', 'div')) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const source = next.normalizeTestDirContent( await getRedboxSource(browser) ) @@ -608,7 +609,7 @@ describe.each([[''], ['/docs']])( browser = await webdriver(next.url, basePath + '/hmr/contact') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toMatch(/Unexpected eof/) await next.patchFile(aboutPage, aboutContent) @@ -651,7 +652,7 @@ describe.each([[''], ['/docs']])( aboutContent.replace('export', 'aa=20;\nexport') ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch(/aa is not defined/) await next.patchFile(aboutPage, aboutContent) @@ -687,7 +688,7 @@ describe.each([[''], ['/docs']])( ) ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toMatch(/an-expected-error/) await next.patchFile(aboutPage, aboutContent) @@ -732,7 +733,7 @@ describe.each([[''], ['/docs']])( ) ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatchInlineSnapshot( `"Error: The default export is not a React Component in page: "/hmr/about5""` ) @@ -780,7 +781,7 @@ describe.each([[''], ['/docs']])( ) ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) // 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.` @@ -830,7 +831,7 @@ describe.each([[''], ['/docs']])( ) ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatchInlineSnapshot( `"Error: The default export is not a React Component in page: "/hmr/about7""` ) @@ -841,7 +842,7 @@ describe.each([[''], ['/docs']])( () => getBrowserBodyText(browser), /This is the about page/ ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } catch (err) { await next.patchFile(aboutPage, aboutContent) @@ -880,7 +881,7 @@ describe.each([[''], ['/docs']])( ) ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch('Failed to compile') if (process.env.TURBOPACK) { @@ -913,7 +914,7 @@ describe.each([[''], ['/docs']])( () => getBrowserBodyText(browser), /This is the about page/ ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } catch (err) { await next.patchFile(aboutPage, aboutContent) @@ -952,7 +953,7 @@ describe.each([[''], ['/docs']])( ) ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch('Failed to compile') let redboxSource = await getRedboxSource(browser) @@ -999,7 +1000,7 @@ describe.each([[''], ['/docs']])( () => getBrowserBodyText(browser), /This is the about page/ ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } catch (err) { await next.patchFile(aboutPage, aboutContent) @@ -1024,7 +1025,7 @@ describe.each([[''], ['/docs']])( browser = await webdriver(next.url, basePath + '/hmr') await browser.elementByCss('#error-in-gip-link').click() - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatchInlineSnapshot( `"Error: an-expected-error-in-gip"` ) @@ -1065,7 +1066,7 @@ describe.each([[''], ['/docs']])( try { browser = await webdriver(next.url, basePath + '/hmr/error-in-gip') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatchInlineSnapshot( `"Error: an-expected-error-in-gip"` ) @@ -1212,7 +1213,7 @@ describe.each([[''], ['/docs']])( pageName, `import hello from 'non-existent'\n` + originalContent ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await waitFor(3000) await next.patchFile(pageName, originalContent) await check( diff --git a/test/development/basic/next-dynamic/next-dynamic.test.ts b/test/development/basic/next-dynamic/next-dynamic.test.ts index 5e10a9a7a4d86..3b93975d4cc2d 100644 --- a/test/development/basic/next-dynamic/next-dynamic.test.ts +++ b/test/development/basic/next-dynamic/next-dynamic.test.ts @@ -2,7 +2,7 @@ import { join } from 'path' import cheerio from 'cheerio' import webdriver from 'next-webdriver' import { createNext, FileRef } from 'e2e-utils' -import { renderViaHTTP, check, hasRedbox } from 'next-test-utils' +import { assertNoRedbox, renderViaHTTP, check } from 'next-test-utils' import { NextInstance } from 'e2e-utils' const customDocumentGipContent = `\ @@ -166,7 +166,7 @@ describe('next/dynamic', () => { try { browser = await webdriver(next.url, basePath + '/dynamic/no-ssr') await check(() => browser.elementByCss('body').text(), /navigator/) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } finally { if (browser) { await browser.close() @@ -179,7 +179,7 @@ describe('next/dynamic', () => { try { browser = await webdriver(next.url, basePath + '/dynamic/no-ssr-esm') await check(() => browser.elementByCss('body').text(), /esm.mjs/) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } finally { if (browser) { await browser.close() diff --git a/test/development/basic/project-directory-rename.test.ts b/test/development/basic/project-directory-rename.test.ts index 788e203165a5c..69f77a2b2e381 100644 --- a/test/development/basic/project-directory-rename.test.ts +++ b/test/development/basic/project-directory-rename.test.ts @@ -1,6 +1,6 @@ import fs from 'fs-extra' import webdriver from 'next-webdriver' -import { check, findPort, hasRedbox } from 'next-test-utils' +import { assertNoRedbox, check, findPort } from 'next-test-utils' import { NextInstance } from 'e2e-utils' import { createNext } from 'e2e-utils' import stripAnsi from 'strip-ansi' @@ -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)).toBe(false) + await assertNoRedbox(browser) try { // should still HMR correctly diff --git a/test/development/jsconfig-path-reloading/index.test.ts b/test/development/jsconfig-path-reloading/index.test.ts index 70a39854be71a..68d3194026d49 100644 --- a/test/development/jsconfig-path-reloading/index.test.ts +++ b/test/development/jsconfig-path-reloading/index.test.ts @@ -1,8 +1,9 @@ import { createNext, FileRef } from 'e2e-utils' import { NextInstance } from 'e2e-utils' import { + assertHasRedbox, + assertNoRedbox, check, - hasRedbox, renderViaHTTP, getRedboxSource, } from 'next-test-utils' @@ -83,7 +84,7 @@ describe('jsconfig-path-reloading', () => { )}` ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain('"@lib/second-data"') await next.patchFile( @@ -104,7 +105,7 @@ describe('jsconfig-path-reloading', () => { ) ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) const html2 = await browser.eval('document.documentElement.innerHTML') expect(html2).toContain('first button') @@ -159,7 +160,7 @@ describe('jsconfig-path-reloading', () => { indexContent.replace('@mybutton', '@myotherbutton') ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { const html2 = await browser.eval('document.documentElement.innerHTML') diff --git a/test/development/middleware-errors/index.test.ts b/test/development/middleware-errors/index.test.ts index ae37479743dd6..fa74e35223973 100644 --- a/test/development/middleware-errors/index.test.ts +++ b/test/development/middleware-errors/index.test.ts @@ -1,4 +1,9 @@ -import { check, getRedboxSource, hasRedbox } from 'next-test-utils' +import { + assertHasRedbox, + assertNoRedbox, + check, + getRedboxSource, +} from 'next-test-utils' import stripAnsi from 'strip-ansi' import { nextTestSetup } from 'e2e-utils' @@ -48,9 +53,9 @@ describe('middleware - development errors', () => { it('renders the error correctly and recovers', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await next.patchFile('middleware.js', `export default function () {}`) - await hasRedbox(browser) + await assertHasRedbox(browser) }) }) @@ -85,7 +90,7 @@ describe('middleware - development errors', () => { it('does not render the error', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(await browser.elementByCss('#page-title')).toBeTruthy() }) }) @@ -122,10 +127,10 @@ describe('middleware - development errors', () => { it('renders the error correctly and recovers', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain(`eval('test')`) await next.patchFile('middleware.js', `export default function () {}`) - await hasRedbox(browser) + await assertHasRedbox(browser) }) }) @@ -160,13 +165,13 @@ describe('middleware - development errors', () => { it('renders the error correctly and recovers', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const source = await getRedboxSource(browser) expect(source).toContain(`throw new Error('booooom!')`) expect(source).toContain('middleware.js') expect(source).not.toContain('//middleware.js') await next.patchFile('middleware.js', `export default function () {}`) - await hasRedbox(browser) + await assertHasRedbox(browser) }) }) @@ -201,7 +206,7 @@ describe('middleware - development errors', () => { it('does not render the error', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(await browser.elementByCss('#page-title')).toBeTruthy() }) }) @@ -239,7 +244,7 @@ describe('middleware - development errors', () => { it('does not render the error', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(await browser.elementByCss('#page-title')).toBeTruthy() }) }) @@ -265,12 +270,12 @@ describe('middleware - development errors', () => { it('renders the error correctly and recovers', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect( await browser.elementByCss('#nextjs__container_errors_desc').text() ).toEqual('Failed to compile') await next.patchFile('middleware.js', `export default function () {}`) - await hasRedbox(browser) + await assertHasRedbox(browser) expect(await browser.elementByCss('#page-title')).toBeTruthy() }) }) @@ -295,11 +300,11 @@ describe('middleware - development errors', () => { it('renders the error correctly and recovers', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await next.patchFile('middleware.js', `export default function () }`) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await next.patchFile('middleware.js', `export default function () {}`) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(await browser.elementByCss('#page-title')).toBeTruthy() }) }) diff --git a/test/development/next-font/build-errors.test.ts b/test/development/next-font/build-errors.test.ts index aa9f45c939e2f..875d0aa416028 100644 --- a/test/development/next-font/build-errors.test.ts +++ b/test/development/next-font/build-errors.test.ts @@ -2,7 +2,11 @@ import { createNext, FileRef } from 'e2e-utils' import { NextInstance } from 'e2e-utils' import { join } from 'path' import webdriver from 'next-webdriver' -import { getRedboxSource, hasRedbox } from 'next-test-utils' +import { + assertHasRedbox, + assertNoRedbox, + getRedboxSource, +} from 'next-test-utils' // TODO: The error overlay is not closed when restoring the working code. describe.skip('next/font build-errors', () => { @@ -32,7 +36,7 @@ export default function Page() { ` ) - expect(await hasRedbox(browser)).toBeTrue() + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toMatchInlineSnapshot(` "app/page.js \`next/font\` error: @@ -40,7 +44,7 @@ export default function Page() { `) await next.patchFile('app/page.js', content) - expect(await hasRedbox(browser)).toBeFalse() + await assertNoRedbox(browser) }) it("should show a module not found error if local font file can' be resolved", async () => { @@ -60,7 +64,7 @@ export default function Page() { ` ) - expect(await hasRedbox(browser)).toBeTrue() + await assertHasRedbox(browser) const sourceLines = (await getRedboxSource(browser)).split('\n') // Should display the file name correctly @@ -71,6 +75,6 @@ export default function Page() { ) await next.patchFile('app/page.js', content) - expect(await hasRedbox(browser)).toBeFalse() + await assertNoRedbox(browser) }) }) diff --git a/test/development/next-font/font-loader-in-document-error.test.ts b/test/development/next-font/font-loader-in-document-error.test.ts index c40ea3c2bf3b5..54f507ccf7045 100644 --- a/test/development/next-font/font-loader-in-document-error.test.ts +++ b/test/development/next-font/font-loader-in-document-error.test.ts @@ -1,6 +1,6 @@ import { createNext, FileRef } from 'e2e-utils' import { NextInstance } from 'e2e-utils' -import { getRedboxSource, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, getRedboxSource } from 'next-test-utils' import webdriver from 'next-webdriver' import { join } from 'path' @@ -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)).toBeTrue() + await assertHasRedbox(browser) if (process.env.TURBOPACK) { // TODO: Turbopack doesn't include pages/ expect(await getRedboxSource(browser)).toMatchInlineSnapshot(` diff --git a/test/development/pages-dir/client-navigation/index.test.ts b/test/development/pages-dir/client-navigation/index.test.ts index 52736fe4da733..80b50b9195f41 100644 --- a/test/development/pages-dir/client-navigation/index.test.ts +++ b/test/development/pages-dir/client-navigation/index.test.ts @@ -1,9 +1,10 @@ /* eslint-env jest */ import { + assertHasRedbox, + assertNoRedbox, fetchViaHTTP, getRedboxSource, - hasRedbox, getRedboxHeader, waitFor, check, @@ -55,7 +56,7 @@ describe('Client Navigation', () => { it('should have proper error when no children are provided', async () => { const browser = await webdriver(next.appPort, '/link-no-child') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'No children were passed to with `href` of `/about` but one child is required' ) @@ -63,7 +64,7 @@ describe('Client Navigation', () => { 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)).toBe(false) + await assertNoRedbox(browser) if (browser) await browser.close() }) @@ -279,7 +280,7 @@ describe('Client Navigation', () => { try { browser = await webdriver(next.appPort, '/nav') await browser.elementByCss('#empty-props').click() - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( /should resolve to an object\. But found "null" instead\./ ) @@ -1377,7 +1378,7 @@ describe('Client Navigation', () => { let browser try { browser = await webdriver(next.appPort, '/error-inside-browser-page') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const text = await getRedboxSource(browser) expect(text).toMatch(/An Expected error occurred/) expect(text).toMatch(/pages[\\/]error-inside-browser-page\.js \(5:13\)/) @@ -1395,7 +1396,7 @@ describe('Client Navigation', () => { next.appPort, '/error-in-the-browser-global-scope' ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const text = await getRedboxSource(browser) expect(text).toMatch(/An Expected error occurred/) expect(text).toMatch(/error-in-the-browser-global-scope\.js \(2:9\)/) @@ -1478,7 +1479,7 @@ describe('Client Navigation', () => { await browser.waitForElementByCss('.nav-about') await browser.back() await waitFor(1000) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } finally { if (browser) { await browser.close() @@ -1498,7 +1499,7 @@ describe('Client Navigation', () => { await browser.waitForElementByCss('.nav-about') await browser.back() await waitFor(1000) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } finally { if (browser) { await browser.close() @@ -1516,7 +1517,7 @@ describe('Client Navigation', () => { await browser.waitForElementByCss('.nav-about') await browser.back() await waitFor(1000) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } finally { if (browser) { await browser.close() diff --git a/test/development/pages-dir/client-navigation/rendering.test.ts b/test/development/pages-dir/client-navigation/rendering.test.ts index eea26d161712d..8e407a877e121 100644 --- a/test/development/pages-dir/client-navigation/rendering.test.ts +++ b/test/development/pages-dir/client-navigation/rendering.test.ts @@ -3,9 +3,9 @@ import cheerio from 'cheerio' import { nextTestSetup } from 'e2e-utils' import { + assertHasRedbox, fetchViaHTTP, getRedboxHeader, - hasRedbox, renderViaHTTP, } from 'next-test-utils' import webdriver from 'next-webdriver' @@ -133,7 +133,7 @@ describe('Client Navigation rendering', () => { const expectedErrorMessage = 'Circular structure in "getInitialProps" result of page "/circular-json-error".' - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const text = await getRedboxHeader(browser) expect(text).toContain(expectedErrorMessage) }) @@ -147,7 +147,7 @@ describe('Client Navigation rendering', () => { 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)).toBe(true) + await assertHasRedbox(browser) const text = await getRedboxHeader(browser) expect(text).toContain(expectedErrorMessage) }) @@ -157,7 +157,7 @@ describe('Client Navigation rendering', () => { const expectedErrorMessage = '"EmptyInitialPropsPage.getInitialProps()" should resolve to an object. But found "null" instead.' - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const text = await getRedboxHeader(browser) expect(text).toContain(expectedErrorMessage) }) @@ -193,14 +193,14 @@ describe('Client Navigation rendering', () => { test('default export is not a React Component', async () => { const browser = await webdriver(next.appPort, '/no-default-export') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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(next.appPort, '/error-inside-page') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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. @@ -211,7 +211,7 @@ describe('Client Navigation rendering', () => { next.appPort, '/error-in-the-global-scope' ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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. @@ -311,7 +311,7 @@ describe('Client Navigation rendering', () => { it('should show a valid error when undefined is thrown', async () => { const browser = await webdriver(next.appPort, '/throw-undefined') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const text = await getRedboxHeader(browser) expect(text).toContain( diff --git a/test/development/repeated-dev-edits/repeated-dev-edits.test.ts b/test/development/repeated-dev-edits/repeated-dev-edits.test.ts index bd602b59f8c3c..adc64bcab1bf5 100644 --- a/test/development/repeated-dev-edits/repeated-dev-edits.test.ts +++ b/test/development/repeated-dev-edits/repeated-dev-edits.test.ts @@ -1,6 +1,6 @@ import { nextTestSetup } from 'e2e-utils' import fs from 'fs-extra' -import { hasRedbox } from 'next-test-utils' +import { assertNoRedbox } from 'next-test-utils' import path from 'path' describe('repeated-dev-edits', () => { @@ -25,7 +25,7 @@ describe('repeated-dev-edits', () => { expect(await browser.elementByCss('p').text()).toBe('version-2') // Verify no hydration mismatch: - expect(await hasRedbox(browser)).toBeFalse() + await assertNoRedbox(browser) await next.patchFile( pagePath, @@ -35,11 +35,11 @@ describe('repeated-dev-edits', () => { expect(await browser.elementByCss('p').text()).toBe('version-3') // Verify no hydration mismatch: - expect(await hasRedbox(browser)).toBeFalse() + await assertNoRedbox(browser) await browser.refresh() // Verify no hydration mismatch: - expect(await hasRedbox(browser)).toBeFalse() + await assertNoRedbox(browser) }) }) diff --git a/test/development/tsconfig-path-reloading/index.test.ts b/test/development/tsconfig-path-reloading/index.test.ts index dab32fabe3f38..3a2adcb3ccaf5 100644 --- a/test/development/tsconfig-path-reloading/index.test.ts +++ b/test/development/tsconfig-path-reloading/index.test.ts @@ -1,8 +1,9 @@ import { createNext, FileRef } from 'e2e-utils' import { NextInstance } from 'e2e-utils' import { + assertHasRedbox, + assertNoRedbox, check, - hasRedbox, renderViaHTTP, getRedboxSource, } from 'next-test-utils' @@ -83,7 +84,7 @@ describe('tsconfig-path-reloading', () => { )}` ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain("'@lib/second-data'") await next.patchFile( @@ -104,7 +105,7 @@ describe('tsconfig-path-reloading', () => { ) ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) const html2 = await browser.eval('document.documentElement.innerHTML') expect(html2).toContain('first button') @@ -159,7 +160,7 @@ describe('tsconfig-path-reloading', () => { indexContent.replace('@mybutton', '@myotherbutton') ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { const html2 = await browser.eval('document.documentElement.innerHTML') diff --git a/test/e2e/app-dir/actions/app-action.test.ts b/test/e2e/app-dir/actions/app-action.test.ts index ba46424189d6b..fec271dcbf380 100644 --- a/test/e2e/app-dir/actions/app-action.test.ts +++ b/test/e2e/app-dir/actions/app-action.test.ts @@ -1,11 +1,11 @@ /* eslint-disable jest/no-standalone-expect */ import { nextTestSetup } from 'e2e-utils' import { + assertHasRedbox, check, retry, waitFor, getRedboxSource, - hasRedbox, } from 'next-test-utils' import type { Request, Response, Route } from 'playwright' import fs from 'fs-extra' @@ -705,7 +705,7 @@ describe('app-dir action handling', () => { origContent + '\n\nexport const foo = 1' ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain( 'Only async functions are allowed to be exported in a "use server" file.' ) diff --git a/test/e2e/app-dir/app-compilation/index.test.ts b/test/e2e/app-dir/app-compilation/index.test.ts index e1ff36fd17d8c..6a5a9129d29ca 100644 --- a/test/e2e/app-dir/app-compilation/index.test.ts +++ b/test/e2e/app-dir/app-compilation/index.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { check, hasRedbox, waitFor } from 'next-test-utils' +import { assertNoRedbox, check, waitFor } from 'next-test-utils' describe('app dir', () => { const { next, isNextDev, isNextStart, skipped } = nextTestSetup({ @@ -36,7 +36,7 @@ describe('app dir', () => { await waitFor(1000) // It should not have an error - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) // HMR should still work const code = await next.readFile('app/page-with-loading/page.js') diff --git a/test/e2e/app-dir/app-external/app-external.test.ts b/test/e2e/app-dir/app-external/app-external.test.ts index 61a398d84bad5..bd127b2f4de7b 100644 --- a/test/e2e/app-dir/app-external/app-external.test.ts +++ b/test/e2e/app-dir/app-external/app-external.test.ts @@ -1,5 +1,10 @@ import { nextTestSetup } from 'e2e-utils' -import { check, hasRedbox, retry, shouldRunTurboDevTest } from 'next-test-utils' +import { + assertNoRedbox, + check, + retry, + shouldRunTurboDevTest, +} from 'next-test-utils' async function resolveStreamResponse(response: any, onData?: any) { let result = '' @@ -250,7 +255,7 @@ describe('app dir - external dependency', () => { expect($('#transpile-cjs-lib').text()).toBe('transpile-cjs-lib') const browser = await next.browser('/cjs/client') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) }) it('should export client module references in esm', async () => { diff --git a/test/e2e/app-dir/dynamic-data/dynamic-data.test.ts b/test/e2e/app-dir/dynamic-data/dynamic-data.test.ts index 0eef0fc638efa..587fb5dc04f36 100644 --- a/test/e2e/app-dir/dynamic-data/dynamic-data.test.ts +++ b/test/e2e/app-dir/dynamic-data/dynamic-data.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { getRedboxHeader, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, getRedboxHeader } from 'next-test-utils' process.env.__TEST_SENTINEL = 'build' @@ -198,7 +198,7 @@ describe('dynamic-data with dynamic = "error"', () => { it('displays redbox when `dynamic = "error"` and dynamic data is read in dev', async () => { let browser = await next.browser('/cookies?foo=foosearch') try { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( 'Error: Route /cookies with `dynamic = "error"` couldn\'t be rendered statically because it used `cookies`' ) @@ -208,7 +208,7 @@ describe('dynamic-data with dynamic = "error"', () => { browser = await next.browser('/headers?foo=foosearch') try { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( 'Error: Route /headers with `dynamic = "error"` couldn\'t be rendered statically because it used `headers`' ) @@ -218,7 +218,7 @@ describe('dynamic-data with dynamic = "error"', () => { browser = await next.browser('/search?foo=foosearch') try { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( 'Error: Route /search with `dynamic = "error"` couldn\'t be rendered statically because it used `searchParams`' ) @@ -276,7 +276,7 @@ describe('dynamic-data inside cache scope', () => { it('displays redbox when accessing dynamic data inside a cache scope', async () => { let browser = await next.browser('/cookies') try { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( 'Error: Route /cookies used "cookies" inside a function cached with "unstable_cache(...)".' ) @@ -286,7 +286,7 @@ describe('dynamic-data inside cache scope', () => { browser = await next.browser('/headers') try { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( 'Error: Route /headers used "headers" inside a function cached with "unstable_cache(...)".' ) diff --git a/test/e2e/app-dir/dynamic-href/dynamic-href.test.ts b/test/e2e/app-dir/dynamic-href/dynamic-href.test.ts index e64e9716f5221..3bed1ca336d72 100644 --- a/test/e2e/app-dir/dynamic-href/dynamic-href.test.ts +++ b/test/e2e/app-dir/dynamic-href/dynamic-href.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { getRedboxDescription, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, getRedboxDescription } from 'next-test-utils' describe('dynamic-href', () => { const { @@ -20,7 +20,7 @@ describe('dynamic-href', () => { const browser = await next.browser('/object') // Error should show up - expect(await hasRedbox(browser)).toBeTrue() + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatchInlineSnapshot( `"Error: Dynamic href \`/object/[slug]\` found in while using the \`/app\` router, this is not supported. Read more: https://nextjs.org/docs/messages/app-dir-dynamic-href"` ) @@ -48,7 +48,7 @@ describe('dynamic-href', () => { const browser = await next.browser('/string') // Error should show up - expect(await hasRedbox(browser)).toBeTrue() + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatchInlineSnapshot( `"Error: Dynamic href \`/object/[slug]\` found in while using the \`/app\` router, this is not supported. Read more: https://nextjs.org/docs/messages/app-dir-dynamic-href"` ) diff --git a/test/e2e/app-dir/errors/index.test.ts b/test/e2e/app-dir/errors/index.test.ts index f23f148b314a5..d750e7c5ace79 100644 --- a/test/e2e/app-dir/errors/index.test.ts +++ b/test/e2e/app-dir/errors/index.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { getRedboxHeader, hasRedbox, retry } from 'next-test-utils' +import { assertHasRedbox, getRedboxHeader, retry } from 'next-test-utils' describe('app-dir - errors', () => { const { next, isNextDev, isNextStart, skipped } = nextTestSetup({ @@ -19,7 +19,7 @@ describe('app-dir - errors', () => { if (isNextDev) { // TODO: investigate desired behavior here as it is currently // minimized by default - // expect(await hasRedbox(browser)).toBe(true) + // await assertHasRedbox(browser) // expect(await getRedboxHeader(browser)).toMatch(/this is a test/) } else { await browser @@ -47,7 +47,7 @@ describe('app-dir - errors', () => { // 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)).toBe(true) + // await assertHasRedbox(browser) // expect(await getRedboxHeader(browser)).toMatch(/this is a test/) } else { await browser @@ -68,7 +68,7 @@ describe('app-dir - errors', () => { await browser.elementByCss('#error-trigger-button').click() if (isNextDev) { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch(/this is a test/) } else { expect( @@ -83,7 +83,7 @@ describe('app-dir - errors', () => { const browser = await next.browser('/global-error-boundary/server') if (isNextDev) { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch(/custom server error/) } else { expect( diff --git a/test/e2e/app-dir/global-error/basic/index.test.ts b/test/e2e/app-dir/global-error/basic/index.test.ts index f485cee2c178b..aabc0e282916d 100644 --- a/test/e2e/app-dir/global-error/basic/index.test.ts +++ b/test/e2e/app-dir/global-error/basic/index.test.ts @@ -1,8 +1,8 @@ -import { getRedboxHeader, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, getRedboxHeader } from 'next-test-utils' import { nextTestSetup } from 'e2e-utils' async function testDev(browser, errorRegex) { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch(errorRegex) } diff --git a/test/e2e/app-dir/global-error/layout-error/index.test.ts b/test/e2e/app-dir/global-error/layout-error/index.test.ts index c8908ed955489..e042b84e8bced 100644 --- a/test/e2e/app-dir/global-error/layout-error/index.test.ts +++ b/test/e2e/app-dir/global-error/layout-error/index.test.ts @@ -1,8 +1,8 @@ -import { getRedboxHeader, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, getRedboxHeader } from 'next-test-utils' import { nextTestSetup } from 'e2e-utils' async function testDev(browser, errorRegex) { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch(errorRegex) } diff --git a/test/e2e/app-dir/loader-file-named-export-custom-loader-error/loader-file-named-export-custom-loader-error.test.ts b/test/e2e/app-dir/loader-file-named-export-custom-loader-error/loader-file-named-export-custom-loader-error.test.ts index 82e077b1a111b..7c72ff6a0217e 100644 --- a/test/e2e/app-dir/loader-file-named-export-custom-loader-error/loader-file-named-export-custom-loader-error.test.ts +++ b/test/e2e/app-dir/loader-file-named-export-custom-loader-error/loader-file-named-export-custom-loader-error.test.ts @@ -1,11 +1,11 @@ import { nextTestSetup } from 'e2e-utils' -import { getRedboxHeader, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, getRedboxHeader } from 'next-test-utils' const errorMessage = 'images.loaderFile detected but the file is missing default export.\nRead more: https://nextjs.org/docs/messages/invalid-images-config' async function testDev(browser, errorRegex) { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch(errorRegex) } diff --git a/test/e2e/app-dir/next-after-app/index.test.ts b/test/e2e/app-dir/next-after-app/index.test.ts index 827d028de1f20..5fffaefec451c 100644 --- a/test/e2e/app-dir/next-after-app/index.test.ts +++ b/test/e2e/app-dir/next-after-app/index.test.ts @@ -339,7 +339,7 @@ describe.each(runtimes)('unstable_after() in %s runtime', (runtimeValue) => { ) try { - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxDescription()).toContain( `Route /static with \`dynamic = "${dynamicValue}"\` couldn't be rendered statically because it used \`unstable_after\`` ) @@ -365,7 +365,7 @@ describe.each(runtimes)('unstable_after() in %s runtime', (runtimeValue) => { '/invalid-in-client' ) try { - expect(await session.hasRedbox()).toBe(true) + await session.assertHasRedbox() expect(await session.getRedboxSource(true)).toMatch( /You're importing a component that needs "?unstable_after"?\. That only works in a Server Component but one of its parents is marked with "use client", so it's a Client Component\./ ) diff --git a/test/e2e/app-dir/next-after-pages/index.test.ts b/test/e2e/app-dir/next-after-pages/index.test.ts index 0f54a6dbac945..ac7b5100b089b 100644 --- a/test/e2e/app-dir/next-after-pages/index.test.ts +++ b/test/e2e/app-dir/next-after-pages/index.test.ts @@ -1,6 +1,6 @@ /* eslint-env jest */ import { nextTestSetup, isNextDev } from 'e2e-utils' -import { getRedboxSource, hasRedbox, retry } from 'next-test-utils' +import { assertHasRedbox, getRedboxSource, retry } from 'next-test-utils' import * as fs from 'fs' import * as path from 'path' import * as os from 'os' @@ -69,7 +69,7 @@ _describe('unstable_after() - pages', () => { ])('$title', async ({ path }) => { const browser = await next.browser(path) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toMatch( /You're importing a component that needs "?unstable_after"?\. That only works in a Server Component which is not supported in the pages\/ directory\./ ) diff --git a/test/e2e/app-dir/next-font/next-font.test.ts b/test/e2e/app-dir/next-font/next-font.test.ts index 3a86f5387ef35..fac8d092df6a3 100644 --- a/test/e2e/app-dir/next-font/next-font.test.ts +++ b/test/e2e/app-dir/next-font/next-font.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup, FileRef } from 'e2e-utils' -import { getRedboxSource, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, getRedboxSource } from 'next-test-utils' import { join } from 'path' import cheerio from 'cheerio' @@ -456,7 +456,7 @@ describe('app dir - next/font', () => { './does-not-exist.woff2' ) ) - expect(await hasRedbox(browser)).toBeTrue() + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toInclude( "Can't resolve './does-not-exist.woff2'" ) diff --git a/test/e2e/app-dir/not-found-default/index.test.ts b/test/e2e/app-dir/not-found-default/index.test.ts index 4038aaff8c9a6..f590da3803306 100644 --- a/test/e2e/app-dir/not-found-default/index.test.ts +++ b/test/e2e/app-dir/not-found-default/index.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { check, getRedboxDescription, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, check, getRedboxDescription } from 'next-test-utils' describe('app dir - not found with default 404 page', () => { const { next, isNextDev, skipped } = nextTestSetup({ @@ -18,7 +18,7 @@ describe('app dir - not found with default 404 page', () => { if (isNextDev) { await check(async () => { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toMatch( /notFound\(\) is not allowed to use in root layout/ ) @@ -45,7 +45,7 @@ describe('app dir - not found with default 404 page', () => { const browser = await next.browser('/?root-not-found=1') if (isNextDev) { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toBe( 'Error: notFound() is not allowed to use in root layout' ) diff --git a/test/e2e/app-dir/root-layout/root-layout.test.ts b/test/e2e/app-dir/root-layout/root-layout.test.ts index 70dbb4422169b..d2d4d866c8e40 100644 --- a/test/e2e/app-dir/root-layout/root-layout.test.ts +++ b/test/e2e/app-dir/root-layout/root-layout.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { check, getRedboxSource, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, check, getRedboxSource } from 'next-test-utils' describe('app-dir root layout', () => { const { @@ -23,7 +23,7 @@ describe('app-dir root layout', () => { waitHydration: false, }) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toMatchInlineSnapshot(` "Please make sure to include the following tags in your root layout: , . @@ -37,7 +37,7 @@ describe('app-dir root layout', () => { }) await browser.elementByCss('a').click() - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toMatchInlineSnapshot(` "Please make sure to include the following tags in your root layout: , . @@ -50,7 +50,7 @@ describe('app-dir root layout', () => { waitHydration: false, }) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toMatchInlineSnapshot(` "Please make sure to include the following tags in your root layout: , . diff --git a/test/e2e/basepath-trailing-slash.test.ts b/test/e2e/basepath-trailing-slash.test.ts index cce44c887ea6a..caa0e19808507 100644 --- a/test/e2e/basepath-trailing-slash.test.ts +++ b/test/e2e/basepath-trailing-slash.test.ts @@ -2,7 +2,7 @@ import { join } from 'path' import webdriver from 'next-webdriver' import { createNext, FileRef } from 'e2e-utils' import { NextInstance } from 'e2e-utils' -import { hasRedbox } from 'next-test-utils' +import { assertNoRedbox } from 'next-test-utils' describe('basePath + trailingSlash', () => { let next: NextInstance @@ -47,7 +47,7 @@ describe('basePath + trailingSlash', () => { expect(await browser.eval('window.location.search')).toBe('?query=true') if (dev) { - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } } 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)).toBe(false) + await assertNoRedbox(browser) } } finally { await browser.close() diff --git a/test/e2e/basepath.test.ts b/test/e2e/basepath.test.ts index 2ff884dd381c0..dcc10e105a6e9 100644 --- a/test/e2e/basepath.test.ts +++ b/test/e2e/basepath.test.ts @@ -6,9 +6,9 @@ import webdriver from 'next-webdriver' import { createNext, FileRef } from 'e2e-utils' import { NextInstance } from 'e2e-utils' import { + assertNoRedbox, check, fetchViaHTTP, - hasRedbox, renderViaHTTP, waitFor, } from 'next-test-utils' @@ -946,7 +946,7 @@ describe('basePath', () => { expect(await browser.eval('window.location.search')).toBe('?query=true') if (isDev) { - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } } 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)).toBe(false) + await assertNoRedbox(browser) } } finally { await browser.close() diff --git a/test/e2e/conflicting-app-page-error/index.test.ts b/test/e2e/conflicting-app-page-error/index.test.ts index e8a675ae890b5..d81443e91cd9f 100644 --- a/test/e2e/conflicting-app-page-error/index.test.ts +++ b/test/e2e/conflicting-app-page-error/index.test.ts @@ -1,6 +1,7 @@ import { + assertHasRedbox, + assertNoRedbox, getRedboxHeader, - hasRedbox, getRedboxSource, retry, getRedboxDescription, @@ -48,7 +49,7 @@ describe('Conflict between app file and pages file', () => { async function containConflictsError(browser, conflicts) { await retry(async () => { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) if (process.env.TURBOPACK) { expect(await getRedboxDescription(browser)).toContain( 'App Router and Pages Router both match path:' @@ -69,7 +70,7 @@ describe('Conflict between app file and pages file', () => { it('should show error overlay for /another', async () => { await next.start() const browser = await next.browser('/another') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await containConflictsError(browser, [ ['pages/index.js', 'app/page.js'], ['pages/another.js', 'app/another/page.js'], @@ -78,7 +79,7 @@ describe('Conflict between app file and pages file', () => { it('should show error overlay for /', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await containConflictsError(browser, [ ['pages/index.js', 'app/page.js'], ['pages/another.js', 'app/another/page.js'], @@ -87,14 +88,14 @@ describe('Conflict between app file and pages file', () => { it('should support hmr with conflicts', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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)).toBe(false) + await assertNoRedbox(browser) expect(await browser.elementByCss('p').text()).toContain('index - app') await browser.loadPage(next.url + '/another') @@ -103,23 +104,23 @@ describe('Conflict between app file and pages file', () => { 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)).toBe(false) + await assertNoRedbox(browser) 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)).toBe(false) + await assertNoRedbox(browser) expect(await getRedboxHeader(browser)).toBeUndefined() expect(await browser.elementByCss('h1').text()).toBe('non-conflict pages') }) it('should error again when there is new conflict', async () => { const browser = await next.browser('/') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) // Re-trigger the conflicted errors await next.renameFile('pages/index2.js', 'pages/index.js') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) await containConflictsError(browser, [['pages/index.js', 'app/page.js']]) }) } diff --git a/test/e2e/fetch-failures-have-good-stack-traces-in-edge-runtime/fetch-failures-have-good-stack-traces-in-edge-runtime.test.ts b/test/e2e/fetch-failures-have-good-stack-traces-in-edge-runtime/fetch-failures-have-good-stack-traces-in-edge-runtime.test.ts index 8381bc8ce5aa9..d6b0510391053 100644 --- a/test/e2e/fetch-failures-have-good-stack-traces-in-edge-runtime/fetch-failures-have-good-stack-traces-in-edge-runtime.test.ts +++ b/test/e2e/fetch-failures-have-good-stack-traces-in-edge-runtime/fetch-failures-have-good-stack-traces-in-edge-runtime.test.ts @@ -1,7 +1,7 @@ import { nextTestSetup } from 'e2e-utils' import webdriver from 'next-webdriver' import { - hasRedbox, + assertHasRedbox, getRedboxSource, getRedboxDescription, check, @@ -27,7 +27,7 @@ describe('fetch failures have good stack traces in edge runtime', () => { } else if (isNextDev) { expect(next.cliOutput).toContain('src/fetcher.js') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const source = await getRedboxSource(browser) expect(source).toContain('async function anotherFetcher(...args)') diff --git a/test/e2e/module-layer/module-layer.test.ts b/test/e2e/module-layer/module-layer.test.ts index 8dca3ba952e52..982fe2cdc7249 100644 --- a/test/e2e/module-layer/module-layer.test.ts +++ b/test/e2e/module-layer/module-layer.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { getRedboxSource, hasRedbox, retry } from 'next-test-utils' +import { assertHasRedbox, getRedboxSource, retry } from 'next-test-utils' describe('module layer', () => { const { next, isNextStart, isNextDev } = nextTestSetup({ @@ -115,7 +115,7 @@ describe('module layer', () => { ) await retry(async () => { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const source = await getRedboxSource(browser) expect(source).toContain( `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"` diff --git a/test/e2e/new-link-behavior/child-a-tag-error.test.ts b/test/e2e/new-link-behavior/child-a-tag-error.test.ts index a508089c99c0b..f9f42043e54ae 100644 --- a/test/e2e/new-link-behavior/child-a-tag-error.test.ts +++ b/test/e2e/new-link-behavior/child-a-tag-error.test.ts @@ -1,5 +1,5 @@ import { createNext, FileRef, isNextDev } from 'e2e-utils' -import { getRedboxDescription, hasRedbox } from 'next-test-utils' +import { assertHasRedbox, getRedboxDescription } from 'next-test-utils' import { NextInstance } from 'e2e-utils' import webdriver from 'next-webdriver' import path from 'path' @@ -30,7 +30,7 @@ describe('New Link Behavior with child', () => { if (isNextDev) { expect(next.cliOutput).toContain(msg) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxDescription(browser)).toContain(msg) expect(link.length).toBe(0) } else { diff --git a/test/e2e/prerender.test.ts b/test/e2e/prerender.test.ts index 14cf6f7cfc605..ad407cc59ae79 100644 --- a/test/e2e/prerender.test.ts +++ b/test/e2e/prerender.test.ts @@ -6,11 +6,11 @@ import escapeRegex from 'escape-string-regexp' import { createNext, FileRef } from 'e2e-utils' import { NextInstance } from 'e2e-utils' import { + assertHasRedbox, check, fetchViaHTTP, getBrowserBodyText, getRedboxHeader, - hasRedbox, normalizeRegEx, renderViaHTTP, retry, @@ -1099,7 +1099,7 @@ describe('Prerender', () => { // we need to reload the page to trigger getStaticProps await browser.refresh() - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const errOverlayContent = await getRedboxHeader(browser) const errorMsg = /oops from getStaticProps/ expect(next.cliOutput).toMatch(errorMsg) @@ -1239,7 +1239,7 @@ describe('Prerender', () => { // ) // FIXME: disable this - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( /Failed to load static props/ ) @@ -1255,7 +1255,7 @@ describe('Prerender', () => { // ) // FIXME: disable this - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( /Failed to load static props/ ) diff --git a/test/e2e/type-module-interop/index.test.ts b/test/e2e/type-module-interop/index.test.ts index 682d1ddcadc5f..1b79198d92d27 100644 --- a/test/e2e/type-module-interop/index.test.ts +++ b/test/e2e/type-module-interop/index.test.ts @@ -1,6 +1,6 @@ import { createNext } from 'e2e-utils' import { NextInstance } from 'e2e-utils' -import { hasRedbox, renderViaHTTP } from 'next-test-utils' +import { assertNoRedbox, renderViaHTTP } from 'next-test-utils' import webdriver from 'next-webdriver' import cheerio from 'cheerio' @@ -95,7 +95,7 @@ describe('Type module interop', () => { it('should render client-side', async () => { const browser = await webdriver(next.url, '/') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) 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)).toBe(false) + await assertNoRedbox(browser) await browser.close() }) }) diff --git a/test/integration/app-config-asset-prefix/test/index.test.js b/test/integration/app-config-asset-prefix/test/index.test.js index c4c667c12f7ab..8030f06f40ac6 100644 --- a/test/integration/app-config-asset-prefix/test/index.test.js +++ b/test/integration/app-config-asset-prefix/test/index.test.js @@ -1,10 +1,10 @@ /* eslint-env jest */ import { join } from 'path' import { + assertNoRedbox, killApp, findPort, launchApp, - hasRedbox, waitFor, } from 'next-test-utils' import webdriver from 'next-webdriver' @@ -25,7 +25,7 @@ describe('App assetPrefix config', () => { const browser = await webdriver(appPort, '/') try { await waitFor(2000) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) const title = await browser.elementById('title').text() expect(title).toBe('IndexPage') } finally { diff --git a/test/integration/app-dir-export/test/utils.ts b/test/integration/app-dir-export/test/utils.ts index d9f7cdb21ab0b..39e90b0879b85 100644 --- a/test/integration/app-dir-export/test/utils.ts +++ b/test/integration/app-dir-export/test/utils.ts @@ -154,7 +154,7 @@ export async function runTests({ if (isDev) { const url = dynamicPage ? '/another/first' : '/api/json' const browser = await webdriver(port, url) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const header = await getRedboxHeader(browser) const source = await getRedboxSource(browser) expect(`${header}\n${source}`).toContain(expectedErrMsg) diff --git a/test/integration/config-devtool-dev/test/index.test.js b/test/integration/config-devtool-dev/test/index.test.js index e1f77a359e299..31dd14e09016e 100644 --- a/test/integration/config-devtool-dev/test/index.test.js +++ b/test/integration/config-devtool-dev/test/index.test.js @@ -1,10 +1,10 @@ /* eslint-env jest */ import { + assertHasRedbox, check, findPort, getRedboxSource, - hasRedbox, killApp, launchApp, } from 'next-test-utils' @@ -35,7 +35,7 @@ const appDir = join(__dirname, '../') ) const browser = await webdriver(appPort, '/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) if (process.platform === 'win32') { // TODO: add win32 snapshot } else { diff --git a/test/integration/config-output-export/test/index.test.ts b/test/integration/config-output-export/test/index.test.ts index 4f2836a04a795..38575c1b70b11 100644 --- a/test/integration/config-output-export/test/index.test.ts +++ b/test/integration/config-output-export/test/index.test.ts @@ -1,10 +1,11 @@ /* eslint-env jest */ import { + assertHasRedbox, + assertNoRedbox, fetchViaHTTP, File, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, } from 'next-test-utils' @@ -220,7 +221,7 @@ describe('config-output-export', () => { await killApp(app).catch(() => {}) fs.rmSync(blog) } - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'ISR cannot be used with "output: export".' ) @@ -255,7 +256,7 @@ describe('config-output-export', () => { await killApp(app).catch(() => {}) fs.rmSync(blog) } - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) }) it('should work with getStaticProps and without revalidate', async () => { @@ -283,7 +284,7 @@ describe('config-output-export', () => { await killApp(app).catch(() => {}) fs.rmSync(blog) } - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) }) it('should error with getServerSideProps without fallback', async () => { @@ -311,7 +312,7 @@ describe('config-output-export', () => { await killApp(app).catch(() => {}) fs.rmSync(blog) } - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'getServerSideProps cannot be used with "output: export".' ) @@ -351,7 +352,7 @@ describe('config-output-export', () => { output: 'export', }) browser = await webdriver(result.port, '/posts/one') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'getStaticPaths with "fallback: true" cannot be used with "output: export".' ) @@ -395,7 +396,7 @@ describe('config-output-export', () => { output: 'export', }) browser = await webdriver(result.port, '/posts/one') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'getStaticPaths with "fallback: blocking" cannot be used with "output: export".' ) @@ -445,7 +446,7 @@ describe('config-output-export', () => { } const h1 = await browser.elementByCss('h1') expect(await h1.text()).toContain('Hello from one') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(result.stderr).toBeEmpty() }) }) diff --git a/test/integration/custom-routes/test/index.test.js b/test/integration/custom-routes/test/index.test.js index 5c630efa4570e..05af754cdb593 100644 --- a/test/integration/custom-routes/test/index.test.js +++ b/test/integration/custom-routes/test/index.test.js @@ -10,6 +10,7 @@ import cheerio from 'cheerio' import webdriver from 'next-webdriver' import escapeRegex from 'escape-string-regexp' import { + assertNoRedbox, launchApp, killApp, findPort, @@ -21,7 +22,6 @@ import { getBrowserBodyText, waitFor, normalizeRegEx, - hasRedbox, check, } from 'next-test-utils' @@ -296,7 +296,7 @@ const runTests = (isDev = false) => { expect(await browser.eval('window.beforeNav')).toBe(1) if (isDev) { - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) } }) diff --git a/test/integration/dynamic-routing/test/index.test.js b/test/integration/dynamic-routing/test/index.test.js index f2d460d1026ce..2566ca8b079fd 100644 --- a/test/integration/dynamic-routing/test/index.test.js +++ b/test/integration/dynamic-routing/test/index.test.js @@ -5,6 +5,7 @@ import { join, dirname } from 'path' import fs from 'fs-extra' import url from 'url' import { + assertHasRedbox, renderViaHTTP, fetchViaHTTP, findPort, @@ -15,7 +16,6 @@ import { nextStart, normalizeRegEx, check, - hasRedbox, getRedboxHeader, } from 'next-test-utils' import cheerio from 'cheerio' @@ -1200,7 +1200,7 @@ function runTests({ dev }) { await browser .elementByCss('#view-post-1-interpolated-incorrectly') .click() - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const header = await getRedboxHeader(browser) expect(header).toContain( 'The provided `href` (/[name]?another=value) value is missing query values (name) to be interpolated properly.' diff --git a/test/integration/invalid-href/test/index.test.js b/test/integration/invalid-href/test/index.test.js index 5543ae3ff164e..a8976ab9aeb7a 100644 --- a/test/integration/invalid-href/test/index.test.js +++ b/test/integration/invalid-href/test/index.test.js @@ -1,9 +1,9 @@ /* eslint-env jest */ import { + assertHasRedbox, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, nextBuild, @@ -49,7 +49,7 @@ const showsError = async (pathname, regex, click = false, isWarn = false) => { return warnLogs.join('\n') }, regex) } else { - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) const errorContent = await getRedboxHeader(browser) expect(errorContent).toMatch(regex) } diff --git a/test/integration/next-image-legacy/base-path/test/index.test.ts b/test/integration/next-image-legacy/base-path/test/index.test.ts index d4832a9e58cdd..15d9cee09cf29 100644 --- a/test/integration/next-image-legacy/base-path/test/index.test.ts +++ b/test/integration/next-image-legacy/base-path/test/index.test.ts @@ -1,10 +1,11 @@ /* eslint-env jest */ import { + assertHasRedbox, + assertNoRedbox, check, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, nextBuild, @@ -375,7 +376,7 @@ function runTests(mode) { it('should show missing src error', async () => { const browser = await webdriver(appPort, '/docs/missing-src') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -385,7 +386,7 @@ function runTests(mode) { it('should show invalid src error', async () => { const browser = await webdriver(appPort, '/docs/invalid-src') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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`' ) @@ -397,7 +398,7 @@ function runTests(mode) { '/docs/invalid-src-proto-relative' ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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://)' ) diff --git a/test/integration/next-image-legacy/default/test/index.test.ts b/test/integration/next-image-legacy/default/test/index.test.ts index 7d57817bfbeee..a7578f60c0a9d 100644 --- a/test/integration/next-image-legacy/default/test/index.test.ts +++ b/test/integration/next-image-legacy/default/test/index.test.ts @@ -3,11 +3,12 @@ import cheerio from 'cheerio' import validateHTML from 'html-validator' import { + assertHasRedbox, + assertNoRedbox, check, fetchViaHTTP, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, nextBuild, @@ -813,7 +814,7 @@ function runTests(mode) { it('should show missing src error', async () => { const browser = await webdriver(appPort, '/missing-src') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -823,7 +824,7 @@ function runTests(mode) { it('should show invalid src error', async () => { const browser = await webdriver(appPort, '/invalid-src') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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`' ) @@ -832,7 +833,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)).toBe(true) + await assertHasRedbox(browser) 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://)' ) @@ -841,7 +842,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.png" has "placeholder='blur'" property but is missing the "blurDataURL" property.` ) @@ -850,7 +851,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" has invalid "width" or "height" property. These should be numeric values.` ) @@ -862,7 +863,7 @@ function runTests(mode) { '/invalid-placeholder-blur-static' ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( /Image with src "(.*)bmp" has "placeholder='blur'" property but is missing the "blurDataURL" property/ ) @@ -874,7 +875,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)).toBe(false) + await assertNoRedbox(browser) }) it('should warn when img with layout=fill is inside a container without position relative', async () => { @@ -899,7 +900,7 @@ function runTests(mode) { expect(warnings).not.toMatch( /Image with src (.*)webp(.*) may not render properly/gm ) - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) }) it('should warn when using a very small image with placeholder=blur', async () => { @@ -908,7 +909,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)jpg(.*) is smaller than 40x40. Consider removing(.*)/gm ) @@ -920,7 +921,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).not.toMatch( /Expected server HTML to contain a matching/gm ) @@ -944,7 +945,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)test(.*) was detected as the Largest Contentful Paint/gm ) @@ -959,7 +960,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)png(.*) has a "loader" property that does not implement width/gm ) @@ -983,7 +984,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)png(.*) has "sizes" property but it will be ignored/gm ) @@ -1004,7 +1005,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).not.toMatch( /Image with src (.*) has a "loader" property that does not implement width/gm ) diff --git a/test/integration/next-image-new/app-dir/test/index.test.ts b/test/integration/next-image-new/app-dir/test/index.test.ts index ef458860a54f7..3e77d06eeda30 100644 --- a/test/integration/next-image-new/app-dir/test/index.test.ts +++ b/test/integration/next-image-new/app-dir/test/index.test.ts @@ -3,11 +3,12 @@ import cheerio from 'cheerio' import validateHTML from 'html-validator' import { + assertHasRedbox, + assertNoRedbox, check, fetchViaHTTP, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, nextBuild, @@ -798,7 +799,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)).toBe(false) + await assertNoRedbox(browser) const warnings = (await browser.log()) .map((log) => log.message) .join('\n') @@ -830,7 +831,7 @@ function runTests(mode) { 'color:transparent;width:100%;height:auto' ) if (mode === 'dev') { - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) const warnings = (await browser.log()) .map((log) => log.message) .join('\n') @@ -880,7 +881,7 @@ function runTests(mode) { it('should show missing src error', async () => { const browser = await webdriver(appPort, '/missing-src') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -890,7 +891,7 @@ function runTests(mode) { it('should show empty string src error', async () => { const browser = await webdriver(appPort, '/empty-string-src') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -900,7 +901,7 @@ function runTests(mode) { it('should show invalid src error', async () => { const browser = await webdriver(appPort, '/invalid-src') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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`' ) @@ -909,7 +910,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)).toBe(true) + await assertHasRedbox(browser) 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://)' ) @@ -917,7 +918,7 @@ function runTests(mode) { it('should show invalid src with leading space', async () => { const browser = await webdriver(appPort, '/invalid-src-leading-space') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'Image with src " /test.jpg" cannot start with a space or control character.' ) @@ -925,7 +926,7 @@ function runTests(mode) { it('should show invalid src with trailing space', async () => { const browser = await webdriver(appPort, '/invalid-src-trailing-space') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'Image with src "/test.png " cannot end with a space or control character.' ) @@ -934,7 +935,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.png" has "placeholder='blur'" property but is missing the "blurDataURL" property.` ) @@ -943,7 +944,7 @@ function runTests(mode) { it('should show error when invalid width prop', async () => { const browser = await webdriver(appPort, '/invalid-width') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" has invalid "width" property. Expected a numeric value in pixels but received "100%".` ) @@ -952,7 +953,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" has invalid "width" property. Expected a numeric value in pixels but received "Infinity".` ) @@ -961,7 +962,7 @@ function runTests(mode) { it('should show error when invalid height prop', async () => { const browser = await webdriver(appPort, '/invalid-height') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" has invalid "height" property. Expected a numeric value in pixels but received "50vh".` ) @@ -970,7 +971,7 @@ function runTests(mode) { it('should show missing alt error', async () => { const browser = await webdriver(appPort, '/missing-alt') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -980,7 +981,7 @@ function runTests(mode) { it('should show error when missing width prop', async () => { const browser = await webdriver(appPort, '/missing-width') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" is missing required "width" property.` ) @@ -989,7 +990,7 @@ function runTests(mode) { it('should show error when missing height prop', async () => { const browser = await webdriver(appPort, '/missing-height') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" is missing required "height" property.` ) @@ -998,7 +999,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/wide.png" has both "width" and "fill" properties.` ) @@ -1007,7 +1008,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)).toBe(true) + await assertHasRedbox(browser) 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.` ) @@ -1019,7 +1020,7 @@ function runTests(mode) { '/invalid-placeholder-blur-static' ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( /Image with src "(.*)bmp" has "placeholder='blur'" property but is missing the "blurDataURL" property/ ) @@ -1031,7 +1032,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)jpg(.*) is smaller than 40x40. Consider removing(.*)/gm ) @@ -1043,7 +1044,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).not.toMatch( /Expected server HTML to contain a matching/gm ) @@ -1067,7 +1068,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)test(.*) was detected as the Largest Contentful Paint/gm ) @@ -1082,7 +1083,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)png(.*) has a "loader" property that does not implement width/gm ) @@ -1105,7 +1106,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).not.toMatch( /Image with src (.*) has "fill" but is missing "sizes" prop. Please add it to improve page performance/gm ) @@ -1117,7 +1118,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).not.toMatch( /Image with src (.*) has a "loader" property that does not implement width/gm ) diff --git a/test/integration/next-image-new/base-path/test/index.test.js b/test/integration/next-image-new/base-path/test/index.test.js index ecfb04eb39d27..b99165da979ee 100644 --- a/test/integration/next-image-new/base-path/test/index.test.js +++ b/test/integration/next-image-new/base-path/test/index.test.js @@ -1,10 +1,11 @@ /* eslint-env jest */ import { + assertHasRedbox, + assertNoRedbox, check, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, nextBuild, @@ -130,7 +131,7 @@ function runTests(mode) { it('should show missing src error', async () => { const browser = await webdriver(appPort, '/docs/missing-src') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -140,7 +141,7 @@ function runTests(mode) { it('should show invalid src error', async () => { const browser = await webdriver(appPort, '/docs/invalid-src') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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`' ) @@ -152,7 +153,7 @@ function runTests(mode) { '/docs/invalid-src-proto-relative' ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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://)' ) diff --git a/test/integration/next-image-new/default/test/index.test.ts b/test/integration/next-image-new/default/test/index.test.ts index 044598f895854..a40c97d2cb073 100644 --- a/test/integration/next-image-new/default/test/index.test.ts +++ b/test/integration/next-image-new/default/test/index.test.ts @@ -3,11 +3,12 @@ import cheerio from 'cheerio' import validateHTML from 'html-validator' import { + assertHasRedbox, + assertNoRedbox, check, fetchViaHTTP, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, nextBuild, @@ -799,7 +800,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)).toBe(false) + await assertNoRedbox(browser) const warnings = (await browser.log()) .map((log) => log.message) .join('\n') @@ -831,7 +832,7 @@ function runTests(mode) { 'color:transparent;width:100%;height:auto' ) if (mode === 'dev') { - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) const warnings = (await browser.log()) .map((log) => log.message) .join('\n') @@ -881,7 +882,7 @@ function runTests(mode) { it('should show missing src error', async () => { const browser = await webdriver(appPort, '/missing-src') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -891,7 +892,7 @@ function runTests(mode) { it('should show empty string src error', async () => { const browser = await webdriver(appPort, '/empty-string-src') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -901,7 +902,7 @@ function runTests(mode) { it('should show invalid src error', async () => { const browser = await webdriver(appPort, '/invalid-src') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) 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`' ) @@ -910,7 +911,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)).toBe(true) + await assertHasRedbox(browser) 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://)' ) @@ -918,7 +919,7 @@ function runTests(mode) { it('should show invalid src with leading space', async () => { const browser = await webdriver(appPort, '/invalid-src-leading-space') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'Image with src " /test.jpg" cannot start with a space or control character.' ) @@ -926,7 +927,7 @@ function runTests(mode) { it('should show invalid src with trailing space', async () => { const browser = await webdriver(appPort, '/invalid-src-trailing-space') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( 'Image with src "/test.png " cannot end with a space or control character.' ) @@ -935,7 +936,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.png" has "placeholder='blur'" property but is missing the "blurDataURL" property.` ) @@ -944,7 +945,7 @@ function runTests(mode) { it('should show error when invalid width prop', async () => { const browser = await webdriver(appPort, '/invalid-width') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" has invalid "width" property. Expected a numeric value in pixels but received "100%".` ) @@ -953,7 +954,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" has invalid "width" property. Expected a numeric value in pixels but received "Infinity".` ) @@ -962,7 +963,7 @@ function runTests(mode) { it('should show error when invalid height prop', async () => { const browser = await webdriver(appPort, '/invalid-height') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" has invalid "height" property. Expected a numeric value in pixels but received "50vh".` ) @@ -971,7 +972,7 @@ function runTests(mode) { it('should show missing alt error', async () => { const browser = await webdriver(appPort, '/missing-alt') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) await check(async () => { return (await browser.log()).map((log) => log.message).join('\n') @@ -981,7 +982,7 @@ function runTests(mode) { it('should show error when missing width prop', async () => { const browser = await webdriver(appPort, '/missing-width') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" is missing required "width" property.` ) @@ -990,7 +991,7 @@ function runTests(mode) { it('should show error when missing height prop', async () => { const browser = await webdriver(appPort, '/missing-height') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/test.jpg" is missing required "height" property.` ) @@ -999,7 +1000,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain( `Image with src "/wide.png" has both "width" and "fill" properties.` ) @@ -1008,7 +1009,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)).toBe(true) + await assertHasRedbox(browser) 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.` ) @@ -1020,7 +1021,7 @@ function runTests(mode) { '/invalid-placeholder-blur-static' ) - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( /Image with src "(.*)bmp" has "placeholder='blur'" property but is missing the "blurDataURL" property/ ) @@ -1032,7 +1033,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)jpg(.*) is smaller than 40x40. Consider removing(.*)/gm ) @@ -1044,7 +1045,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).not.toMatch( /Expected server HTML to contain a matching/gm ) @@ -1068,7 +1069,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)test(.*) was detected as the Largest Contentful Paint/gm ) @@ -1083,7 +1084,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).toMatch( /Image with src (.*)png(.*) has a "loader" property that does not implement width/gm ) @@ -1106,7 +1107,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).not.toMatch( /Image with src (.*) has "fill" but is missing "sizes" prop. Please add it to improve page performance/gm ) @@ -1118,7 +1119,7 @@ function runTests(mode) { const warnings = (await browser.log()) .map((log) => log.message) .join('\n') - expect(await hasRedbox(browser)).toBe(false) + await assertNoRedbox(browser) expect(warnings).not.toMatch( /Image with src (.*) has a "loader" property that does not implement width/gm ) diff --git a/test/integration/next-image-new/export-config/test/index.test.ts b/test/integration/next-image-new/export-config/test/index.test.ts index 2b7a067a92e2d..50601d9e6710f 100644 --- a/test/integration/next-image-new/export-config/test/index.test.ts +++ b/test/integration/next-image-new/export-config/test/index.test.ts @@ -2,9 +2,9 @@ import { join } from 'path' import { + assertHasRedbox, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, } from 'next-test-utils' @@ -35,7 +35,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toContain(msg) expect(stderr).toContain(msg) }) diff --git a/test/integration/next-image-new/invalid-image-import/test/index.test.ts b/test/integration/next-image-new/invalid-image-import/test/index.test.ts index ed2a33f98f5a7..d6b7dfd7a696e 100644 --- a/test/integration/next-image-new/invalid-image-import/test/index.test.ts +++ b/test/integration/next-image-new/invalid-image-import/test/index.test.ts @@ -2,10 +2,10 @@ import { join } from 'path' import { + assertHasRedbox, findPort, getRedboxHeader, getRedboxSource, - hasRedbox, killApp, launchApp, nextBuild, @@ -22,7 +22,7 @@ function runTests({ isDev }) { it('should show error', async () => { if (isDev) { const browser = await webdriver(appPort, '/') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch('Failed to compile') const source = await getRedboxSource(browser) if (process.env.TURBOPACK) { diff --git a/test/integration/server-side-dev-errors/test/index.test.js b/test/integration/server-side-dev-errors/test/index.test.js index 4ea36e815a692..fde780fe1728c 100644 --- a/test/integration/server-side-dev-errors/test/index.test.js +++ b/test/integration/server-side-dev-errors/test/index.test.js @@ -4,11 +4,11 @@ import fs from 'fs-extra' import { join } from 'path' import webdriver from 'next-webdriver' import { + assertHasRedbox, killApp, findPort, launchApp, check, - hasRedbox, getRedboxSource, } from 'next-test-utils' import stripAnsi from 'strip-ansi' @@ -60,11 +60,11 @@ describe('server-side dev errors', () => { : err }, 'success') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain('missingVar') await fs.writeFile(gspPage, content) - await hasRedbox(browser) + await assertHasRedbox(browser) } finally { await fs.writeFile(gspPage, content) } @@ -92,11 +92,11 @@ describe('server-side dev errors', () => { : err }, 'success') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain('missingVar') await fs.writeFile(gsspPage, content) - await hasRedbox(browser) + await assertHasRedbox(browser) } finally { await fs.writeFile(gsspPage, content) } @@ -124,11 +124,11 @@ describe('server-side dev errors', () => { : err }, 'success') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain('missingVar') await fs.writeFile(dynamicGsspPage, content) - await hasRedbox(browser) + await assertHasRedbox(browser) } finally { await fs.writeFile(dynamicGsspPage, content) } @@ -156,11 +156,11 @@ describe('server-side dev errors', () => { : err }, 'success') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain('missingVar') await fs.writeFile(apiPage, content) - await hasRedbox(browser) + await assertHasRedbox(browser) } finally { await fs.writeFile(apiPage, content) } @@ -188,11 +188,11 @@ describe('server-side dev errors', () => { : err }, 'success') - expect(await hasRedbox(browser)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxSource(browser)).toContain('missingVar') await fs.writeFile(dynamicApiPage, content) - await hasRedbox(browser) + await assertHasRedbox(browser) } finally { await fs.writeFile(dynamicApiPage, content) } diff --git a/test/integration/with-router/test/index.test.js b/test/integration/with-router/test/index.test.js index cae14a0aaf53d..46e706d30ae5c 100644 --- a/test/integration/with-router/test/index.test.js +++ b/test/integration/with-router/test/index.test.js @@ -1,9 +1,9 @@ /* eslint-env jest */ import { + assertHasRedbox, findPort, getRedboxHeader, - hasRedbox, killApp, launchApp, nextBuild, @@ -103,7 +103,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)).toBe(true) + await assertHasRedbox(browser) expect(await getRedboxHeader(browser)).toMatch( `No router instance found. you should only use "next/router" inside the client side of your app. https://` ) diff --git a/test/lib/development-sandbox.ts b/test/lib/development-sandbox.ts index d5a301a2588f8..af73eeb79cae5 100644 --- a/test/lib/development-sandbox.ts +++ b/test/lib/development-sandbox.ts @@ -5,7 +5,8 @@ import { getRedboxHeader, getRedboxSource, getVersionCheckerText, - hasRedbox, + assertHasRedbox, + assertNoRedbox, waitFor, waitForAndOpenRuntimeError, getRedboxDescriptionWarning, @@ -112,8 +113,11 @@ export async function sandbox( ) } }, - async hasRedbox() { - return hasRedbox(browser) + async assertHasRedbox() { + return assertHasRedbox(browser) + }, + async assertNoRedbox() { + return assertNoRedbox(browser) }, async waitForAndOpenRuntimeError() { return waitForAndOpenRuntimeError(browser) diff --git a/test/lib/next-test-utils.ts b/test/lib/next-test-utils.ts index 60680f7080e97..efca89281f0ee 100644 --- a/test/lib/next-test-utils.ts +++ b/test/lib/next-test-utils.ts @@ -801,9 +801,36 @@ export async function retry( } } -export async function hasRedbox(browser: BrowserInterface): Promise { +export async function assertHasRedbox(browser: BrowserInterface) { + try { + await retry( + async () => { + const hasRedbox = await evaluate(browser, () => { + return Boolean( + [].slice + .call(document.querySelectorAll('nextjs-portal')) + .find((p) => + p.shadowRoot.querySelector( + '#nextjs__container_errors_label, #nextjs__container_errors_label' + ) + ) + ) + }) + expect(hasRedbox).toBe(true) + }, + 2000, + 200 + ) + } catch (errorCause) { + const error = new Error('Expected Redbox but found none') + Error.captureStackTrace(error, assertHasRedbox) + throw error + } +} + +export async function assertNoRedbox(browser: BrowserInterface) { await waitFor(5000) - const result = await evaluate(browser, () => { + const hasRedbox = await evaluate(browser, () => { return Boolean( [].slice .call(document.querySelectorAll('nextjs-portal')) @@ -814,7 +841,12 @@ export async function hasRedbox(browser: BrowserInterface): Promise { ) ) }) - return result + + if (hasRedbox) { + const error = new Error('Expected no Redbox but found one') + Error.captureStackTrace(error, assertHasRedbox) + throw error + } } export async function hasErrorToast(