rsnext/test/development/acceptance-app/ReactRefreshLogBox-scss.test.ts
Leah c1c3675fc4
refactor tests for readability (#51051)
You'll probably want to disable whitespace in the diff

## Description

This allows for better editor support by using `describe` or functions called `describe` with the same syntax instead of custom names.

Changes:
- `nextTestSetup` can be used instead of `createNextDescribe` keeping the same behaviour but being called inside a `describe` "block" (not applied everywhere)
- `getSnapshotTestDescribe` replaced with a custom `describe.each`
- `sandbox` helper function for `acceptance`/`acceptance-app` merged into a single shared one
- `outdent` to remove the indent from inline files in tests which helps with consistent snapshots
2023-06-21 19:47:21 +00:00

56 lines
1.6 KiB
TypeScript

/* eslint-env jest */
import { sandbox } from 'development-sandbox'
import { FileRef, nextTestSetup } from 'e2e-utils'
import path from 'path'
import { outdent } from 'outdent'
describe('ReactRefreshLogBox app', () => {
const { next } = nextTestSetup({
files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
dependencies: {
sass: 'latest',
react: 'latest',
'react-dom': 'latest',
},
skipStart: true,
})
test('scss syntax errors', async () => {
const { session, cleanup } = await sandbox(next)
await session.write('index.module.scss', `.button { font-size: 5px; }`)
await session.patch(
'index.js',
outdent`
import './index.module.scss';
export default () => {
return (
<div>
<p>lol</p>
</div>
)
}
`
)
expect(await session.hasRedbox(false)).toBe(false)
// Syntax error
await session.patch('index.module.scss', `.button { font-size: :5px; }`)
expect(await session.hasRedbox(true)).toBe(true)
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(false)).toBe(false)
// Not local error
await session.patch('index.module.scss', `button { font-size: 5px; }`)
expect(await session.hasRedbox(true)).toBe(true)
const source2 = await session.getRedboxSource()
expect(source2).toMatchSnapshot()
await cleanup()
})
})