用玩笑和酶在 React 中测试表单

use*_*436 5 unit-testing reactjs jestjs enzyme

我完全迷失了尝试测试用 React 制作的简单表单,我如何知道提交按钮是否正常工作?经过一番研究后,我认为这样做的方法是创建一个模拟函数,然后检查它是否被调用,但我很确定我做的完全错误。

onObjSubmit(event){
event.preventDefault()
..... (fetch something)
}

render(){
  return (
    <form id="myForm" onSubmit={event => this.onObjSubmit(event)}>
     <input type="text" id="name" /><br />
     <input type="text" id="last_name" /><br />
     <input type="submit" value="submit">
    </form>
  );
}
Run Code Online (Sandbox Code Playgroud)

和测试:

it('Test', () => {
  const wrapper = shallow(<TestComp />);
  const fn = jest.fn();
  wrapper.instance().onObjSubmit = fn;
  wrapper.update();
  wrapper.find('#myForm').simulate('submit');
  expect(fn).toBeCalled();
});
Run Code Online (Sandbox Code Playgroud)

有人可以指出我正确的方向吗?

小智 1

您不是唯一一个对此感到失落的人。Enzyme 问题页面上的该主题提供了许多解决此问题的建议方法。