unit-testing - 酶：BrowserHistory 函数测试失败

Question

我对单元测试相当陌生。我正在使用 react+redux 并且我已经创建了一个NotFound页面/组件并且我正在编写它的单元测试。我需要测试一个失败的 onClick 事件。

404.jsx

const GenericNotFound = () => {
  const goBack = () => {
    browserHistory.goBack();
  };
  return (
    <section >
      <h1>Sorry. The requested URL is not found</h1>
      <a onClick={goBack}>Go back</a>
    </section>
  );
};

测试.js

 const wrapper = shallow(<GenericNotFound />);
  const browserHistory = {
    goBack: sinon.spy()
  };
  const onClick = wrapper.find('a').props().onClick;
  onClick();
  expect(browserHistory.goBack).to.have.been.called;

即使这样，它也会给我一个错误Cannot read property 'goBack' of undefined

先感谢您。

Answer 1

通过遵循@anoop 答案：

 it('should render an anchor tag', () => {
      sinon.spy(browserHistory, 'goBack');
      const wrapper = mount(<GenericNotFound />;
      const onClick = wrapper.find('a').props().onClick;
      onClick();
      expect(browserHistory.goBack).to.have.been.called;
      browserHistory.goBack.restore();
    });

Answer 2

随着评论的更新，

一些变化

1. 使用mount代替shallow

const mount = mount(<GenericNotFound />);

2. spy如下使用，

sinon.spy(browserHistory.prototype, 'goBack')