create-react-app测试“未定义反应”

Question

I am using react-scripts@2.1.8 with typescript@3.3.3 with jest@.23.6.0 and running my tests, they fail with "React is not defined".

 FAIL  src/components/Button/test.tsx
  ● <Button> › renders text correctly

    ReferenceError: React is not defined

       6 |     it('renders text correctly', () => {
       7 |         const text = 'hello there i am a test'
    >  8 |         const { getByText } = customRender(<Button>{text}</Button>)
         |                                            ^
       9 |         expect(getByText(/hello there i am a test/)).toBeTruthy()
      10 |     })
      11 |     it('matches the snapshot', () => {

      at Object.it (src/components/Button/test.tsx:8:44)

  ● <Button> › matches the snapshot

    ReferenceError: React is not defined

      10 |     })
      11 |     it('matches the snapshot', () => {
    > 12 |         const { container } = customRender(<Button />)
         |                                            ^
      13 |         expect(container.firstChild).toMatchSnapshot()
      14 |     })
      15 | })

      at Object.it (src/components/Button/test.tsx:12:44)

Button.test.tsx:

import React from 'react'
import Button from '.'
import { customRender } from '../../test-utils'

describe('<Button>', () => {
    it('renders text correctly', () => {
        const text = 'hello there i am a test'
        const { getByText } = customRender(<Button>{text}</Button>)
        expect(getByText(/hello there i am a test/)).toBeTruthy()
    })
    it('matches the snapshot', () => {
        const { container } = customRender(<Button />)
        expect(container.firstChild).toMatchSnapshot()
    })
})

Also playing with React import, like moving it from line 1 to line 3 seems to sometimes make the tests pass. Which is very strange.

Answer 1

正如本期中讨论和解释的， 这是jsx编译指示和情感10的问题 。