enzyme testing tutorial code example

Example 1: enzyme testing

npm i --save-dev enzyme enzyme-adapter-react-16

Example 2: enzyme test method

const wrapper = shallow(<Button />); 
wrapper.instance().handleClick()

Example 3: enzyme at example

// dom.js

import React from 'react'

const DomTest = () => (
  <div>
    <div className='parentSatu'>
      <p className='childSatu'>hello wordl satu</p>
    </div>
    <div className='parentDua'>
      <p className='childDua'>hello wordl dua</p>
    </div>
    <div className='parentTiga'>
      <p className='childTiga'>hello wordl tiga</p>
    </div>

    <div className='domGroup'>
      <p className='domSatu satu'>DOM Satu</p>
      <p className='domDua'>DOM Dua</p>
      <p className='domTiga'>DOM Tiga</p>
    </div>

    <h1 className='header'>
      <span className='sub-header'>Hello World</span>
    </h1>
  </div>
)

export default DomTest

// dom.test.js

test('find element in DomTest Component by index using at', () => {
    expect(wrapper.find('.domGroup').children().at(0).text()).toStrictEqual('DOM Satu')
    expect(wrapper.find('.domGroup').children().at(1).text()).toStrictEqual('DOM Dua')
    expect(wrapper.find('.domGroup').children().at(2).text()).toStrictEqual('DOM Tiga')
  })

Tags:

Misc Example