How do I test if several checkboxes are checked or not?
render()
...
<React.Fragment>
<div
className='foo'>
<label>
<input
className='checkbox'
name='bar'
type='checkbox'
checked={this.props.checked}
onChange={() => { } }
/>
</label>
</div>
</React.Fragment>
...
I tried
it('checks all checkboxes', () => {
const component = shallow(
<Foo
... />
)
expect(component
.find('input[type="checkbox"][checked="checked"]'))
.toHaveLength(content.length);
});
and
component
.find({ type: 'checkbox' })
.forEach(node => {
expect(node
.props
.checked)
.toEqual(true);
});
or
component
.find('input')
.forEach(node => {
expect(node
.props
.checked)
.toEqual(true);
});
and
component
.find('.checkbox')
.forEach(node => {
expect(node
.props
.checked)
.toEqual(true);
});
The last three give me undefined
while the first one returns a massive object ({Symbol(enzyme.__root__): {Symbol(enzyme.__root__): [Circular], Symbol(enzyme.__unrendered__): <Foo....
You just miss that props
is a function that returns the props (and not accesses the props directly), so you have to call it:
component
.find('input')
.forEach(node => {
expect(node
.props()
.checked)
.toEqual(true);
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With