Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove hardcoded timeouts in Redbox test helpers #73000

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 3 additions & 9 deletions test/development/acceptance-app/ReactRefreshLogBox.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1049,19 +1049,16 @@ 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"
| ^

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'

Expand All @@ -1070,7 +1067,6 @@ describe.each(['default', 'turbo'])('ReactRefreshLogBox app %s', () => {
Import trace for requested module:
./app/styles1.css
`)
})
}
})

Expand Down Expand Up @@ -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 |
Expand All @@ -1134,7 +1129,6 @@ export default function Home() {
| ^
5 | }"
`)
})
})

test('Should show error location for server actions in server component', async () => {
Expand Down
9 changes: 4 additions & 5 deletions test/development/acceptance-app/error-recovery.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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');"
Expand All @@ -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/
)
})
})
4 changes: 1 addition & 3 deletions test/development/acceptance-app/hydration-error.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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 <table>. Make sure you don't have any extra whitespace between tags on each line of your source code.
Expand Down
12 changes: 7 additions & 5 deletions test/development/acceptance-app/rsc-build-errors.test.ts
Original file line number Diff line number Diff line change
@@ -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'
Expand Down Expand Up @@ -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) {
Expand All @@ -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()))
Expand Down Expand Up @@ -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()))
Expand Down
5 changes: 1 addition & 4 deletions test/development/acceptance/error-recovery.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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');"
Expand Down
Original file line number Diff line number Diff line change
@@ -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'

Expand Down Expand Up @@ -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/
)

Expand Down Expand Up @@ -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/
)

Expand Down Expand Up @@ -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/
)

Expand Down
3 changes: 2 additions & 1 deletion test/development/sass-error/index.test.ts
Original file line number Diff line number Diff line change
@@ -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({
Expand All @@ -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
Expand Down
11 changes: 5 additions & 6 deletions test/e2e/app-dir/revalidatetag-rsc/revalidatetag-rsc.test.ts
Original file line number Diff line number Diff line change
@@ -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({
Expand Down Expand Up @@ -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(
Expand Down
5 changes: 3 additions & 2 deletions test/e2e/getserversideprops/test/index.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
normalizeRegEx,
renderViaHTTP,
waitFor,
assertHasRedbox,
} from 'next-test-utils'
import { join } from 'path'
import webdriver from 'next-webdriver'
Expand Down Expand Up @@ -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`/
)
})
Expand Down
29 changes: 8 additions & 21 deletions test/lib/next-test-utils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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<T>(
fn: () => T | Promise<T>,
duration: number = 3000,
Expand Down Expand Up @@ -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'))
Expand All @@ -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'))
Expand Down Expand Up @@ -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]'))
Expand All @@ -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) =>
Expand All @@ -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]'))
Expand All @@ -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]'))
Expand All @@ -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]'))
Expand All @@ -966,7 +953,7 @@ export function getRedboxDescriptionWarning(browser: BrowserInterface) {
export function getRedboxErrorLink(
browser: BrowserInterface
): Promise<string | undefined> {
return evaluate(browser, () => {
return browser.eval(() => {
const portal = [].slice
.call(document.querySelectorAll('nextjs-portal'))
.find((p) => p.shadowRoot.querySelector('[data-nextjs-dialog-header]'))
Expand Down
Loading