测试输入组件无效。输入值显示为“未定义”

时间:2020-08-19 16:25:50

标签: reactjs typescript jestjs enzyme

我对测试输入有疑问。不知道为什么最后一行expect(input.prop('value')).toEqual(fakeValue)显示“未定义”。有想法吗?

Input.tsx

<Wrapper>
    <InputContainer>
        {icon ? <Icon src={icon} /> : null}
        <Label htmlFor={name}>
            <InputField
                type={type}
                name={name}
                placeholder={placeholder}
                onChange={onChangeHandler}
            />
        </Label>
    </InputContainer>
</Wrapper>

Input.test.tsx

describe('InputField', () => {

    let component: ReactWrapper;
    let setup: InputProps;
    const onChangeHandler: () => void = jest.fn();

    beforeEach(() => {
        setup = {
            name: 'name',
            type: 'text',
            placeholder: 'placeholder',
            icon: icon,
            onChange: onChangeHandler
        }

        component = mount(<Input {...setup} />)
    })

    it('onChange work correctly', () => {
        const fakeValue = 'fake value';
        const input = component.find('input');

        input.simulate('change', {target: {value: fakeValue}});
        expect(setup.onChange).toHaveBeenCalledTimes(1);
        expect(input.prop('value')).toEqual(fakeValue)
    });
});

0 个答案:

没有答案