Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Testing recompose's HOC with enzyme

How can I test (with jest+enzyme) the following code that uses recompose for creating a HoC:

import {compose, withState, withHandlers} from 'recompose'

const addCounting = compose(
  withState('counter', 'setCounter', 0),
  withHandlers({
    increment: ({ setCounter }) => () => setCounter(n => n + 1),
    decrement: ({ setCounter }) => () =>  setCounter(n => n - 1),
    reset: ({ setCounter }) => () => setCounter(0)
  })
)

When performing shallow render, I have access to counter and setCounter properties, like so:

import {shallow} from 'enzyme'

const WithCounting = addCounting(EmptyComponent)
const wrapper = shallow(<WithCounting />)

wrapper.props().setCounter(1)
expect(wrapper.props().counter).toEqual(1)

The big question is, how can I access the handlers (increment, decrement and reset) and call them? They do not appear in the wrapper.props()

like image 210
dotintegral Avatar asked Jul 26 '17 12:07

dotintegral


1 Answers

So you can access the props by finding the instance first:

const EmptyComponent = () => null;
const WithCounting = addCounting(props => <EmptyComponent {...props} />);
const wrapper = mount(<WithCounting />);

wrapper.find(EmptyComponent).props().setCounter(1);
expect(wrapper.find(EmptyComponent).props().counter).toEqual(1);
like image 115
wuct Avatar answered Oct 01 '22 22:10

wuct