diff --git a/test/development/acceptance-app/ReactRefreshLogBox.test.ts b/test/development/acceptance-app/ReactRefreshLogBox.test.ts index 05a2470a74588..d20bcf30f5a8e 100644 --- a/test/development/acceptance-app/ReactRefreshLogBox.test.ts +++ b/test/development/acceptance-app/ReactRefreshLogBox.test.ts @@ -1049,8 +1049,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { // Wait for patch to apply and new error to show. await session.assertHasRedbox() if (isTurbopack) { - await retry(async () => { - expect(await session.getRedboxSource()).toEqual(outdent` + expect(await session.getRedboxSource()).toEqual(outdent` ./app/styles2.css:1:2 Module not found: Can't resolve './boom.css' > 1 | @import "./boom.css" @@ -1058,10 +1057,8 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { https://nextjs.org/docs/messages/module-not-found `) - }) } else { - await retry(async () => { - expect(await session.getRedboxSource()).toEqual(outdent` + expect(await session.getRedboxSource()).toEqual(outdent` ./app/styles2.css Module not found: Can't resolve './boom.css' @@ -1070,7 +1067,6 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => { Import trace for requested module: ./app/styles1.css `) - }) } }) @@ -1124,8 +1120,7 @@ export default function Home() { // Wait for patch to apply and new error to show. await session.assertHasRedbox() - await retry(async () => { - expect(await session.getRedboxSource()).toMatchInlineSnapshot(` + expect(await session.getRedboxSource()).toMatchInlineSnapshot(` "app/actions.ts (4:9) @ serverAction 2 | @@ -1134,7 +1129,6 @@ export default function Home() { | ^ 5 | }" `) - }) }) test('Should show error location for server actions in server component', async () => { diff --git a/test/development/acceptance-app/error-recovery.test.ts b/test/development/acceptance-app/error-recovery.test.ts index 25832eae978e9..bd6f1cc4bada1 100644 --- a/test/development/acceptance-app/error-recovery.test.ts +++ b/test/development/acceptance-app/error-recovery.test.ts @@ -456,10 +456,7 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { ) await session.assertHasRedbox() - await check(async () => { - const source = await session.getRedboxSource() - return source?.includes('render() {') ? 'success' : source - }, 'success') + await expect(session.getRedboxSource()).resolves.toInclude('render() {') expect(await session.getRedboxSource()).toInclude( "throw new Error('nooo');" @@ -473,6 +470,8 @@ describe.each(['default', 'turbo'])('Error recovery app %s', () => { ) const { session } = sandbox await session.assertHasRedbox() - await check(() => session.getRedboxSource(true), /Failed to compile/) + await expect(session.getRedboxSource(true)).resolves.toMatch( + /Failed to compile/ + ) }) }) diff --git a/test/development/acceptance-app/hydration-error.test.ts b/test/development/acceptance-app/hydration-error.test.ts index d4162ce6be17e..58950320d9de9 100644 --- a/test/development/acceptance-app/hydration-error.test.ts +++ b/test/development/acceptance-app/hydration-error.test.ts @@ -430,9 +430,7 @@ describe('Error overlay for hydration errors in App router', () => { await session.waitForAndOpenRuntimeError() await session.assertHasRedbox() - await retry(async () => { - expect(await getRedboxTotalErrorCount(browser)).toBe(1) - }) + expect(await getRedboxTotalErrorCount(browser)).toBe(1) expect(await session.getRedboxDescription()).toMatchInlineSnapshot(` "In HTML, whitespace text nodes cannot be a child of . Make sure you don't have any extra whitespace between tags on each line of your source code. diff --git a/test/development/acceptance-app/rsc-build-errors.test.ts b/test/development/acceptance-app/rsc-build-errors.test.ts index 89ad44505f673..7392cf00db565 100644 --- a/test/development/acceptance-app/rsc-build-errors.test.ts +++ b/test/development/acceptance-app/rsc-build-errors.test.ts @@ -1,5 +1,4 @@ import { FileRef, nextTestSetup } from 'e2e-utils' -import { check } from 'next-test-utils' import path from 'path' import { createSandbox } from 'development-sandbox' import { outdent } from 'outdent' @@ -307,8 +306,7 @@ describe('Error overlay - RSC build errors', () => { ) await session.assertHasRedbox() - await check( - () => session.getRedboxSource(), + await expect(session.getRedboxSource()).resolves.toMatch( /must be a Client \n| Component/ ) if (process.env.TURBOPACK) { @@ -323,7 +321,9 @@ describe('Error overlay - RSC build errors', () => { Learn more: https://nextjs.org/docs/app/api-reference/directives/use-client" `) } else { - await check(() => session.getRedboxSource(), /Add the "use client"/) + await expect(session.getRedboxSource()).resolves.toMatch( + /Add the "use client"/ + ) // TODO: investigate flakey snapshot due to spacing below // expect(next.normalizeTestDirContent(await session.getRedboxSource())) @@ -356,7 +356,9 @@ describe('Error overlay - RSC build errors', () => { await session.patch('app/server-with-errors/error-file/error.js', '') await session.assertHasRedbox() - await check(() => session.getRedboxSource(), /Add the "use client"/) + await expect(session.getRedboxSource()).resolves.toMatch( + /Add the "use client"/ + ) // TODO: investigate flakey snapshot due to spacing below // expect(next.normalizeTestDirContent(await session.getRedboxSource())) diff --git a/test/development/acceptance/error-recovery.test.ts b/test/development/acceptance/error-recovery.test.ts index 5a743e2368a03..8abb6269d5775 100644 --- a/test/development/acceptance/error-recovery.test.ts +++ b/test/development/acceptance/error-recovery.test.ts @@ -301,10 +301,7 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox %s', () => { ) await session.assertHasRedbox() - await check(async () => { - const source = await session.getRedboxSource() - return source?.includes('render() {') ? 'success' : source - }, 'success') + await expect(session.getRedboxSource()).resolves.toInclude('render() {') expect(await session.getRedboxSource()).toInclude( "throw new Error('nooo');" 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 0a93c7de641ef..d397f966a09d1 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 @@ -1,6 +1,5 @@ /* eslint-env jest */ import { nextTestSetup } from 'e2e-utils' -import { check } from 'next-test-utils' import { createSandbox } from 'development-sandbox' import { outdent } from 'outdent' @@ -46,8 +45,7 @@ describe('Error Overlay for server components compiler errors in pages', () => { ) await session.assertHasRedbox() - await check( - () => session.getRedboxSource(), + await expect(session.getRedboxSource()).resolves.toMatch( /That only works in a Server Component/ ) @@ -103,8 +101,7 @@ describe('Error Overlay for server components compiler errors in pages', () => { ) await session.assertHasRedbox() - await check( - () => session.getRedboxSource(), + await expect(session.getRedboxSource()).resolves.toMatch( /That only works in a Server Component/ ) @@ -162,8 +159,7 @@ describe('Error Overlay for server components compiler errors in pages', () => { ) await session.assertHasRedbox() - await check( - () => session.getRedboxSource(), + await expect(session.getRedboxSource()).resolves.toMatch( /That only works in a Server Component/ ) diff --git a/test/development/sass-error/index.test.ts b/test/development/sass-error/index.test.ts index f1d55a54413af..44d4a87aaf222 100644 --- a/test/development/sass-error/index.test.ts +++ b/test/development/sass-error/index.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { getRedboxSource } from 'next-test-utils' +import { assertHasRedbox, getRedboxSource } from 'next-test-utils' describe('app dir - css', () => { const { next, skipped } = nextTestSetup({ @@ -21,6 +21,7 @@ describe('app dir - css', () => { it('should use original source points for sass errors', async () => { const browser = await next.browser('/sass-error') + await assertHasRedbox(browser) const source = await getRedboxSource(browser) // css-loader does not report an error for this case diff --git a/test/e2e/app-dir/revalidatetag-rsc/revalidatetag-rsc.test.ts b/test/e2e/app-dir/revalidatetag-rsc/revalidatetag-rsc.test.ts index 77dd09e6810d2..77039b17a124a 100644 --- a/test/e2e/app-dir/revalidatetag-rsc/revalidatetag-rsc.test.ts +++ b/test/e2e/app-dir/revalidatetag-rsc/revalidatetag-rsc.test.ts @@ -1,5 +1,5 @@ import { nextTestSetup } from 'e2e-utils' -import { getRedboxHeader, retry } from 'next-test-utils' +import { assertHasRedbox, getRedboxHeader, retry } from 'next-test-utils' describe('expireTag-rsc', () => { const { next, isNextDev, isNextDeploy } = nextTestSetup({ @@ -28,11 +28,10 @@ describe('expireTag-rsc', () => { await browser.elementByCss('#revalidate-via-page').click() if (isNextDev) { - await retry(async () => { - expect(await getRedboxHeader(browser)).toContain( - 'Route /revalidate_via_page used "expireTag data"' - ) - }) + await assertHasRedbox(browser) + await expect(getRedboxHeader(browser)).resolves.toContain( + 'Route /revalidate_via_page used "expireTag data"' + ) } else { await retry(async () => { expect( diff --git a/test/e2e/getserversideprops/test/index.test.ts b/test/e2e/getserversideprops/test/index.test.ts index 374bc4b2b1e2d..09c8450bd3b07 100644 --- a/test/e2e/getserversideprops/test/index.test.ts +++ b/test/e2e/getserversideprops/test/index.test.ts @@ -12,6 +12,7 @@ import { normalizeRegEx, renderViaHTTP, waitFor, + assertHasRedbox, } from 'next-test-utils' import { join } from 'path' import webdriver from 'next-webdriver' @@ -758,8 +759,8 @@ const runTests = (isDev = false, isDeploy = false) => { const browser = await webdriver(next.url, '/') await browser.elementByCss('#non-json').click() - await check( - () => getRedboxHeader(browser), + await assertHasRedbox(browser) + await expect(getRedboxHeader(browser)).resolves.toMatch( /Error serializing `.time` returned from `getServerSideProps`/ ) }) diff --git a/test/lib/next-test-utils.ts b/test/lib/next-test-utils.ts index 38df233f4cb1a..0caa377957d8a 100644 --- a/test/lib/next-test-utils.ts +++ b/test/lib/next-test-utils.ts @@ -776,19 +776,6 @@ export class File { } } -export async function evaluate( - browser: BrowserInterface, - input: string | Function -) { - if (typeof input === 'function') { - const result = await browser.eval(input) - await new Promise((resolve) => setTimeout(resolve, 30)) - return result - } else { - throw new Error(`You must pass a function to be evaluated in the browser.`) - } -} - export async function retry( fn: () => T | Promise, duration: number = 3000, @@ -825,7 +812,7 @@ export async function assertHasRedbox(browser: BrowserInterface) { try { await retry( async () => { - const hasRedbox = await evaluate(browser, () => { + const hasRedbox = await browser.eval(() => { return Boolean( [].slice .call(document.querySelectorAll('nextjs-portal')) @@ -850,7 +837,7 @@ export async function assertHasRedbox(browser: BrowserInterface) { export async function assertNoRedbox(browser: BrowserInterface) { await waitFor(5000) - const hasRedbox = await evaluate(browser, () => { + const hasRedbox = await browser.eval(() => { return Boolean( [].slice .call(document.querySelectorAll('nextjs-portal')) @@ -897,7 +884,7 @@ export async function waitForAndOpenRuntimeError(browser: BrowserInterface) { } export function getRedboxHeader(browser: BrowserInterface) { - return evaluate(browser, () => { + return browser.eval(() => { const portal = [].slice .call(document.querySelectorAll('nextjs-portal')) .find((p) => p.shadowRoot.querySelector('[data-nextjs-dialog-header]')) @@ -912,7 +899,7 @@ export async function getRedboxTotalErrorCount(browser: BrowserInterface) { } export function getRedboxSource(browser: BrowserInterface) { - return evaluate(browser, () => { + return browser.eval(() => { const portal = [].slice .call(document.querySelectorAll('nextjs-portal')) .find((p) => @@ -927,7 +914,7 @@ export function getRedboxSource(browser: BrowserInterface) { } export function getRedboxTitle(browser: BrowserInterface) { - return evaluate(browser, () => { + return browser.eval(() => { const portal = [].slice .call(document.querySelectorAll('nextjs-portal')) .find((p) => p.shadowRoot.querySelector('[data-nextjs-dialog-header]')) @@ -939,7 +926,7 @@ export function getRedboxTitle(browser: BrowserInterface) { } export function getRedboxDescription(browser: BrowserInterface) { - return evaluate(browser, () => { + return browser.eval(() => { const portal = [].slice .call(document.querySelectorAll('nextjs-portal')) .find((p) => p.shadowRoot.querySelector('[data-nextjs-dialog-header]')) @@ -951,7 +938,7 @@ export function getRedboxDescription(browser: BrowserInterface) { } export function getRedboxDescriptionWarning(browser: BrowserInterface) { - return evaluate(browser, () => { + return browser.eval(() => { const portal = [].slice .call(document.querySelectorAll('nextjs-portal')) .find((p) => p.shadowRoot.querySelector('[data-nextjs-dialog-header]')) @@ -966,7 +953,7 @@ export function getRedboxDescriptionWarning(browser: BrowserInterface) { export function getRedboxErrorLink( browser: BrowserInterface ): Promise { - return evaluate(browser, () => { + return browser.eval(() => { const portal = [].slice .call(document.querySelectorAll('nextjs-portal')) .find((p) => p.shadowRoot.querySelector('[data-nextjs-dialog-header]'))