Question

因此，我正在尝试测试是否在表单上调用了handle提交功能。达到了下面显示的条件，并阻止了表单的提交。我该如何模拟内部的validate函数以返回空对象{}。这将使我的表单有效，然后根据需要提交。

Validate在form.jsx的Form组件之外定义。我正在将其导出，就像导出const validate = {}

    handleSubmit = event => {
        const {args} = this.state;
        let errors = validate(args);
        const isValid = isEmpty(errors)
        if(!isValid) {
            this.setState({args: args})
            event.preventDefault()
        }
        this.setState({args: args})
    }

我的尝试

    it('should handleSubmit when form is submitted', () => {
        const fakeValidate = { validate: () => true };
        const handleSubmit = jest.fn().mockImplementation((cb) => () => cb({ test: 'test' }));
        const wrapper = shallow(<Form form="test" onSubmit={handleSubmit}/>);
        wrapper.find('form').simulate('submit', fakeValidate);
        expect(handleSubmit).toBeCalledTimes(1);
    });

谢谢！

Answer 1

不可能模拟在使用的同一模块中定义的函数。为了具有可模拟性，应从另一个模块导入并用jest.mock模拟它，或将其用作某个对象的方法并用jest.spyOn模拟。

由于它与类组件一起使用，因此可以将其定义为方法：

validate() {...}

handleSubmit = event => {
    ...
    let errors = this.validate(args);
    ...
}

然后在类中被嘲笑：

jest.spyOn(Form.prototype, 'validate').mockReturnValue(...);

或组件实例：

jest.spyOn(wrapper.instance(), 'validate').mockReturnValue(...);

如果validate可重复使用或与功能组件一起使用，则应将其移至另一个模块。

在函数内部开玩笑

1 个答案: