CODEWITHSUNDEEP
reactjsenzyme
Bertrand P
Bertrand P

Reputation: 889

Enzyme, How to access a component passed in props

What I am trying to test in MyComponent is the value of checked props of the Switch component which is a props of FormControlLabel component:

class MyComponent extends Component {

 (...)

 render() {
  return (
   <FormControlLabel
    name={`formControl`}
    control={
      <Switch
        name={`switch`}
        data
        checked={this.state.isChecked}
        onClick={this.handleChange}
        value={checked}
        />
    }
    />
  );
 }
}

I can access the FormControlLabel component like this: 

const wrapper = shallow(<MyComponent />);

wrapper.find('[name="formControl"]');

I tried to access the Switch component like this but it's not working:

wrapper.find('[name="switch"]');

How can I access the checked props of Switch component ?

API Version Adapter

Upvotes: 10

Views: 5342

Answers (2)

Up209d
Up209d

Reputation: 4752

const controlComponent = shallow(wrapper.find(FormControlLabel).props().control);
expect(controlComponent.props().checked).toBeTruthy();

Upvotes: 1

Bertrand P
Bertrand P

Reputation: 889

Well, I just found a solution:

expect(wrapper.find('[name="formControl"]').prop('control').props.checked).toEqual(true);

Upvotes: 12

Related Questions