[Unit Test] mock componentby@peterchang_82818
31,877 reads

[Unit Test] mock component

Read on Terminal Reader

Too Long; Didn't Read

featured image - [Unit Test] mock component
react to story with heart

image

jest enzyme test unit component

How do you mock a react component with Jest?

We got a component which is included another external components **InstallCom** and **UserCom** ():

import { InstallCom } from 'installComponent'import UserCom from 'userComponent'

export class ShareCom extends Component {render() {return (<div><InstallCom para1='title1'/><UserCom para2='title2' /></div>)}}

Unit Test

In unit test, what we care about is the functionality of <ShareCom />, but not other dependent components **InstallCom** and **UserCom**, for mock purpose , jest is a good helper.

import {ShareCom} from '../somewhere/ShareCom'

jest.mock('../somewhere/UserCom', () => ()=> <div id="mockUserCom">mockUserCom</div>)

jest.mock('installComponent', () => ({InstallCom: 'mockInstallCom'}))

describe('ShareCom', () => {it('should return correct component', () => {const wrapper = mount(<ShareComsomething={something}/>)

  expect(wrapper.find('mockInstallCom').length).toEqual(1)  
  expect(wrapper.find('#mockUserCom').length).toEqual(1)  

})})

Reference:

— Git:

RELATED STORIES

L O A D I N G
. . . comments & more!
Hackernoon hq - po box 2206, edwards, colorado 81632, usa