EnzymeとJestを使ったReact componentのユニットテストの雛形 #React

下記変更を加えれば各componentについてのユニットテストができる。

describeのnameを書き換える
テスト内容に応じてitを追加・変更する

EnzymeのAPIはこちらを参照: API Reference - Enzyme


import React from 'react'
import Enzyme, { shallow } from 'enzyme'
import Adapter from 'enzyme-adapter-react-16'

Enzyme.configure({ adapter: new Adapter() })

describe('HogeComponent', () => {
  it('has a input', () => {
    const wrapper = shallow(<HogeComponent />)

    // inputタグがHogeComponent内に1個存在することをテストする
    expect(wrapper.find('input').length).toBe(1)
  })
})