Skip to content
This repository has been archived by the owner on Jun 22, 2023. It is now read-only.

commercetools/jest-enzyme-matchers

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

22 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

@commercetools/jest-enzyme-matchers

Enzyme specific jest matchers

Installation

  1. Add package

npm install @commercetools/jest-enzyme-matchers --save-dev

  1. Add testFrameworkScriptFile

Set up a setupTestFrameworkScriptFile. Create that file and add it to the jest configuration.

  1. Add matchers to Jest

In that testFrameworkScriptFile file, import the matchers and add them to jest

import * as enzymeMatchers from '@commercetools/jest-enzyme-matchers'

expect.extend(enzymeMatchers)

// more expect.extend calls for your own matcheres
// expect.extend({ /* ... */ })

Usage

toRender(selector)

Passes when at least one element matching the selector is found in the wrapper.

import Icon from 'somewhere'

describe('Component', () => {
  const wrapper = shallow(<Component />)
  it('should render an Icon', () => {
    expect(wrapper).toRender(Icon)
  })
  it('should render a Button', () => {
    expect(wrapper).toRender('Button')
  })
})

toRenderElementTimes(selector, times)

Passes when the number of elements matching the selector found in the wrapper matches times exactly.

import Icon from 'somewhere'

describe('Component', () => {
  const wrapper = shallow(<Component />)
  it('should render one Icon', () => {
    expect(wrapper).toRenderElementTimes(Icon, 1)
  })
  it('should render two Buttons', () => {
    expect(wrapper).toRenderElementTimes('Button', 2)
  })
})

toContainClass(className)

Passes when the className is present on the wrapper passed to expect.

describe('Component', () => {
  const wrapper = shallow(<Component />)
  it('should add the class name', () => {
    expect(wrapper).toContainClass('foo')
  })
  it('should not add the class name', () => {
    expect(wrapper).not.toContainClass('bar')
  })
})