检查复选框是否被笑话/酶选中

Question

如何测试是否选中了多个复选框？

render()
    ...
        <React.Fragment>
              <div
                className='foo'>
                <label>
                  <input
                    className='checkbox'
                    name='bar'
                    type='checkbox'
                    checked={this.props.checked}
                    onChange={() => { } }
                  />
                </label>
              </div>
        </React.Fragment>
    ...

我试过

it('checks all checkboxes', () => {
    const component = shallow(
        <Foo
            ... />
    )

    expect(component
        .find('input[type="checkbox"][checked="checked"]'))
        .toHaveLength(content.length);
});

和

component
    .find({ type: 'checkbox' })
    .forEach(node => {
        expect(node
            .props
            .checked)
            .toEqual(true);
    });

或者

component
    .find('input')
    .forEach(node => {
        expect(node
            .props
            .checked)
            .toEqual(true);
    });

和

component
    .find('.checkbox')
    .forEach(node => {
        expect(node
            .props
            .checked)
            .toEqual(true);
    });

最后三个给我，undefined而第一个返回一个巨大的物体（{Symbol(enzyme.__root__): {Symbol(enzyme.__root__): [Circular], Symbol(enzyme.__unrendered__): <Foo....

Answer 1

你只是错过了props一个返回道具的函数（而不是直接访问道具），所以你必须调用它：

component
    .find('input')
    .forEach(node => {
        expect(node
            .props()
            .checked)
            .toEqual(true);
    });

Answer 2

通过jest-dom，您可以使用expect(node).toBeChecked();