如何使用 Jest/Enzyme 在 Echarts 上测试 Click 事件？

【问题标题】：How to test a Click event on Echarts using Jest/Enzyme?如何使用 Jest/Enzyme 在 Echarts 上测试 Click 事件？
【发布时间】：2020-08-18 10:44:41
【问题描述】：

我有一个 echarts-for-react 条形图。在 barClick 上，页面重定向到不同的 url。如何使用 Enzyme/Jest 测试此点击事件？

const handleClick = (params) => {
  if(params.data){
    let url = get_route(params.value[2])
    window.open(url, "_self")
  }
  return null
};

let onEvents = {'click': handleClick};

<ReactEcharts
            option={this.getOption()}
            onEvents={onEvents}
            style={{width: '100%', height: `${height}px`}}
            className='react_for_echarts' 
            />

【问题讨论】：

标签： reactjs jestjs enzyme echarts

【解决方案1】：

我不知道这个echarts 组件，但通常要使用酶对其进行测试，您应该：

监视您的函数以跟踪其调用（您必须将其从箭头函数更改为正确的 js 函数）const spy = jest.spyOn(MyComponent.prototype, 'handleClick');
安装组件const component = mount(<MyComponent/>);
模拟单击所需按钮 (?) component.find(ReactEcharts).simulate('click');
更新您的组件component.update();
检查函数是否被调用expect(spy).toHaveBeenCalled();

【讨论】：