vendredi 31 juillet 2020

Jest/Enzyme ReactJS Testing Form Control Option

Trying to write unit tests for a form I have in a component. I have this at the moment which works fine for any 'text input' parts of the form however for dropdown selects it doesn't work...

it('should set the gender on change event', () => {
    wrapper.find('#gender').simulate('change', {
        target: {
            value: 'female',
        },
    });
    expect(wrapper.find('#gender').props().value).toEqual(
        'female',
    );
});

It just says that it expected 'Female' but got nothing.

This is what I am trying to test -

<Form.Group as={Row} controlId="gender">
    <Form.Label column sm="2"> Gender </Form.Label>
        <Col sm="10">
            <Form.Control defaultValue="" as="select" value={gender} required onChange={event => setGender(event.currentTarget.value)}>
                <option value="" disabled>Choose...</option>
                {data.gender.map(opt => <option key={opt}>{opt}</option>)}
            </Form.Control>
        </Col>
</Form.Group>

I have been googling and trying a number of things but can't get it to work! Any help would be appreciated

Aucun commentaire:

Enregistrer un commentaire