next.js/test/development/acceptance/component-stack.test.ts at zt/sync-react · correasebastian/next.js · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
/* eslint-env jest */
import { createNextDescribe } from 'e2e-utils'
import { getRedboxComponentStack, hasRedbox } from 'next-test-utils'
import path from 'path'

createNextDescribe(
  'Component Stack in error overlay',
  {
    files: path.join(__dirname, 'fixtures', 'component-stack'),
  },
  ({ next }) => {
    it('should show a component stack on hydration error', async () => {
      const browser = await next.browser('/')

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

      if (process.env.TURBOPACK) {
        expect(await getRedboxComponentStack(browser)).toMatchInlineSnapshot(`
          "...
            <App>
              <Mismatch>
                <main>
                  <Component>
                    <div>
                      <p>
                        "server"
                        "client""
        `)
      } else {
        expect(await getRedboxComponentStack(browser)).toMatchInlineSnapshot(`
          "<Mismatch>
            <main>
              <Component>
                <div>
                  <p>
                    "server"
                    "client""
        `)
      }
    })
  }
)