酶：BrowserHistory 函数测试失败

Question

我对单元测试还很陌生。我正在使用 react+redux 并创建了一个 NotFound page/component 并且我正在编写它的单元测试。我需要测试一个失败的 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>
  );
};

Test.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

根据评论更新，

一些变化

1. 使用mount代替shallow

const mount = mount(<GenericNotFound />);

2. 使用spy如下，

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

Answer 2

通过关注@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();
    });