javascript – 使用Jest监视componentDidMount中的方法调用

我最近想测试一些自定义方法在React组件的componentDidMount方法中有条件地调用.

componentDidMount() {
  if (this.props.initOpen) {
    this.methodName();
  }
}

我正在使用Jest作为我的测试框架,其中包括针对模拟/间谍的jest.fn().我已经读过,通过做类似以下的事情,用Sinon测试这将是相当微不足道的：

sinon.spy(Component.prototype, "methodName");
const wrapper = mount(<Component {...props} />);
expect(wrapper.instance().methodName).toHaveBeenCalled();

我正试图用Jest重新创建这个：

Component.prototype.methodName = jest.fn();
const wrapper = mount(<Component {...props} />);
expect(wrapper.instance().methodName).toHaveBeenCalled();

此代码失败并引发以下错误：

jest.fn() value must be a mock function or spy.
Received:
  function: [Function bound mockConstructor]

是否可以使用Jest测试此功能？如果是这样,怎么样？

解决方法:

关键是使用jest spyOn方法.它应该是这样的：

const spy = jest.spyOn(Component.prototype, 'methodName');
const wrapper = mount(<Component {...props} />);
wrapper.instance().methodName();
expect(spy).toHaveBeenCalled();

如此处所见例如：Test if function is called react and enzyme

请注意,最佳做法是在每次测试运行后清除间谍功能

let spy

afterEach(() => {
  spy.mockClear()
})

https://facebook.github.io/jest/docs/en/jest-object.html#jestclearallmocks

标签：enzyme,javascript,reactjs,testing,jestjs
来源： https://codeday.me/bug/20190925/1817638.html