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

test(snapshot): allow snapshot test not invalidate with --turbo #43545

Merged
merged 3 commits into from Jan 13, 2023
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
169 changes: 87 additions & 82 deletions test/development/acceptance-app/ReactRefreshLogBox-builtins.test.ts
Expand Up @@ -2,69 +2,73 @@ import { sandbox } from './helpers'
import { createNext, FileRef } from 'e2e-utils'
import { NextInstance } from 'test/lib/next-modes/base'
import path from 'path'
import { getSnapshotTestDescribe } from 'next-test-utils'

// TODO-APP: Investigate snapshot mismatch
describe('ReactRefreshLogBox app', () => {
let next: NextInstance

beforeAll(async () => {
next = await createNext({
files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
dependencies: {
react: 'latest',
'react-dom': 'latest',
},
skipStart: true,
for (const variant of ['default', 'turbo']) {
getSnapshotTestDescribe(variant)(`ReactRefreshLogBox app ${variant}`, () => {
let next: NextInstance

beforeAll(async () => {
next = await createNext({
files: new FileRef(
path.join(__dirname, 'fixtures', 'default-template')
),
dependencies: {
react: 'latest',
'react-dom': 'latest',
},
skipStart: true,
})
})
})
afterAll(() => next.destroy())

// Module trace is only available with webpack 5
test('Node.js builtins', async () => {
const { session, cleanup } = await sandbox(
next,
new Map([
[
'node_modules/my-package/index.js',
`
afterAll(() => next.destroy())

// Module trace is only available with webpack 5
test('Node.js builtins', async () => {
const { session, cleanup } = await sandbox(
next,
new Map([
[
'node_modules/my-package/index.js',
`
const dns = require('dns')
module.exports = dns
`,
],
[
'node_modules/my-package/package.json',
`
],
[
'node_modules/my-package/package.json',
`
{
"name": "my-package",
"version": "0.0.1"
}
`,
],
])
)
],
])
)

await session.patch(
'index.js',
`
await session.patch(
'index.js',
`
import pkg from 'my-package'

export default function Hello() {
return (pkg ? <h1>Package loaded</h1> : <h1>Package did not load</h1>)
}
`
)
expect(await session.hasRedbox(true)).toBe(true)
expect(await session.getRedboxSource()).toMatchSnapshot()
)
expect(await session.hasRedbox(true)).toBe(true)
expect(await session.getRedboxSource()).toMatchSnapshot()

await cleanup()
})
await cleanup()
})

test('Module not found', async () => {
const { session, cleanup } = await sandbox(next)
test('Module not found', async () => {
const { session, cleanup } = await sandbox(next)

await session.patch(
'index.js',
`import Comp from 'b'
await session.patch(
'index.js',
`import Comp from 'b'
export default function Oops() {
return (
<div>
Expand All @@ -73,22 +77,22 @@ describe('ReactRefreshLogBox app', () => {
)
}
`
)
)

expect(await session.hasRedbox(true)).toBe(true)
expect(await session.hasRedbox(true)).toBe(true)

const source = await session.getRedboxSource()
expect(source).toMatchSnapshot()
const source = await session.getRedboxSource()
expect(source).toMatchSnapshot()

await cleanup()
})
await cleanup()
})

test('Module not found empty import trace', async () => {
const { session, cleanup } = await sandbox(next)
test('Module not found empty import trace', async () => {
const { session, cleanup } = await sandbox(next)

await session.patch(
'app/page.js',
`'use client'
await session.patch(
'app/page.js',
`'use client'
import Comp from 'b'
export default function Oops() {
return (
Expand All @@ -98,49 +102,50 @@ describe('ReactRefreshLogBox app', () => {
)
}
`
)
)

expect(await session.hasRedbox(true)).toBe(true)
expect(await session.hasRedbox(true)).toBe(true)

const source = await session.getRedboxSource()
expect(source).toMatchSnapshot()
const source = await session.getRedboxSource()
expect(source).toMatchSnapshot()

await cleanup()
})
await cleanup()
})

test('Module not found missing global CSS', async () => {
const { session, cleanup } = await sandbox(
next,
new Map([
[
'app/page.js',
`'use client'
test('Module not found missing global CSS', async () => {
const { session, cleanup } = await sandbox(
next,
new Map([
[
'app/page.js',
`'use client'
import './non-existent.css'
export default function Page(props) {
return <p>index page</p>
}
`,
],
])
)
expect(await session.hasRedbox(true)).toBe(true)
],
])
)
expect(await session.hasRedbox(true)).toBe(true)

const source = await session.getRedboxSource()
expect(source).toMatchSnapshot()
const source = await session.getRedboxSource()
expect(source).toMatchSnapshot()

await session.patch(
'app/page.js',
`'use client'
await session.patch(
'app/page.js',
`'use client'
export default function Page(props) {
return <p>index page</p>
}
`
)
expect(await session.hasRedbox(false)).toBe(false)
expect(
await session.evaluate(() => document.documentElement.innerHTML)
).toContain('index page')
)
expect(await session.hasRedbox(false)).toBe(false)
expect(
await session.evaluate(() => document.documentElement.innerHTML)
).toContain('index page')

await cleanup()
await cleanup()
})
})
})
}