How to test the internal functions defined for dormant components in reaction with an enzyme

Question

I use an enzyme to test my reactive components. I have a stateless component that has an internal function. How can I call and check this internal function?

Here is my component:

const Btn = (props) => { const types = ['link', 'plainLink', 'primary', 'secondary', 'danger', 'info']; const handleClick = (event) => { event.preventDefault(); props.onClick(event); }; return ( <button onClick={handleClick} className={classes}> <span>{props.children}</span> </button> ); }; 

I tried the following, but I get an error: TypeError: undefined is not a constructor

 const btnComp = shallow(<Btn />); btnComp.instance().handleClick(); 

Answer 1

I usually test this functionality by setting sinon.spy for the event:

 const click = sinon.spy(); const btnComp = shallow(<Btn onClick={click} />); btnComp.find('button').simulate('click'); expect(click.called).to.equal(true); 

Now you know that the internal function did indeed raise the props.onClick event, which is the most important bit of its operation.