在React中使用Jest进行单元测试onClick处理程序

Question

我有以下代码，可为每个元素（可以是button或li）单击设置自定义处理程序。

componentWillReceiveProps(nextProps) {
   this._setCallbackToItemLinks(nextProps);
}

_setCallbackToItemLinks(props) {
    const items = props && props.items;
    items.forEach(item => {
      item.links.forEach(link => {
        this._setCallbackToLink(link);
      });
    });
 }



 _setCallbackToLink(link) {
    link.onClickFromProps = link.onClick;
    link.onClick = e => this._onItemClick(e, link.onClickFromProps);
 }



onItemClick(e, onClickFromProps) {
    console.log("Custom click event handler called");
    if (onClickFromProps) 
      onClickFromProps(e);
}

我想使用Jest对上述功能进行单元测试。

const component= mount(<Comp />);
const mock2 = jest.fn();
component.setProps({ items: [{links: [{ name: 'Test', key: 'Test', url: 'Test', onClick: mock2 }]}] });
const link= component.find('.nav-link');
navLink.simulate('click');
expect(mock2.mock.calls.length).toBe(1);

测试通过了，但是我没有得到用console.log方法编写的onItemClick语句。当我尝试调试该测试时，调用模拟点击后甚至没有进入onItemClick。

navLink确实显示了<a>标签。

当我登录navLink.props().onClick时，它显示[Function: bound]