How to test the function of a component present inside prop of other component?

0
votes

I have used List component of material-ui. Inside this component I have a prop subheader which contains a checkbox. I want to test the onClick function for checkbox.

            <List
                component="nav"
                subheader={<span style={{ display: 'inline-flex', width: '100%' }}>
                    < ListSubheader style={{ top: 'inherit', width: '80%', fontSize: '30px', fontWeight: 'bold' }}>
                        {HEADING.industries}
                    </ListSubheader >
                    <Checkbox
                        color="default"
                        checked={this.state.checkedSelectAll}
                        onClick={handleSelectAll}
                    />
                    <Typography className="selectAllText">
                        Select All
                    </Typography>
                </span>}
            >

I wrote :

it('should call handleSelectAll', () => {

    wrapper = shallow(<IndustryGroupModal {...props} />);

    wrapper.find(Checkbox).simulate('click');

});

It is giving this error:

Method “simulate” is meant to be run on 1 node. 0 found instead.
1
reactjstypescriptunit-testingjestjsenzyme

1 Answers

0
votes

Try this, I think it should be enough:

it('should call handleSelectAll', () => {

    wrapper = shallow(<IndustryGroupModal {...props} />);


    wrapper.prop("subheader").props.children[1].props.onClick()

});

I hope this solves your problem, Have a good day!