reactjs - 用 Jest 和 enzyme 在 React 中测试表单

标签 reactjs unit-testing 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>
  );
}

测试:

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

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

最佳答案

您并不是唯一一个对此感到迷失的人。 This thread on Enzyme's issues page有很多建议的方法来解决这个问题。

关于reactjs - 用 Jest 和 enzyme 在 React 中测试表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47316691/

相关文章:

reactjs - 在 React 中使用 Jest 模拟 Axios - 模拟函数未被调用

react-native - 无法让 Jest expo 应用程序与 react-navigation 一起使用

reactjs - Enzyme/Jest onSubmit 不调用提交函数

javascript - 如何使用 react 动态导入组件?/动态导入

javascript - 生成合成事件的搜索栏

javascript - 尽管已初始化,mapStateToProps 在 Redux 中始终返回未定义

javascript - 配置一个从单元测试中的延迟返回 promise 的 stub 工厂?

perl - 用于测试 Perl 脚本/模块异常和死亡的单元测试

java - 使用模拟对象时测试粒度

javascript - 没有 enzyme 如何测试 child 成分法?