酶模拟“点击”在应该时不起作用

Question

我正在使用 Jest 和 Enzyme 测试表单组件，但无法让点击模拟工作。供参考：Button 是一个样式化的 rebass Button，并以如下形式存在：

<Button
  type="reset"
  disabled={pristine || submitting}
  onClick={() => onClose(dirty)}
>

这是失败的测试：

 it('should handle the onClose event', () => {
      const onCloseSpy = jest.fn();
      const renderedComponent = mount(renderFormUtil({ onClose: onCloseSpy }));
      expect(onCloseSpy).not.toHaveBeenCalled();
      console.log(renderedComponent.find(Form).props().onClose);
      renderedComponent
      .find(Button)
      .first()
      .simulate('click');
    expect(onCloseSpy).toHaveBeenCalled();
  });

这里需要注意的是，如果我将模拟行替换为以下内容：

renderedComponent
  .find(Button)
  .first()
  .props()
  .onClick();

然后突然我的测试通过了。这怎么可能？如果 onClick 属性正确，那是不是意味着点击事件没有正确调用该属性？

Answer 1

不清楚这两个.find 是否选择了相同的组件，因为每个都使用不同的选择器。再加上您使用的是.first()，无法通过示例代码确定订单。
您可以尝试使用更具体的选择器，避免使用.first() 并仅使用.find 获取所需的组件。为此，您可以为特定的ButtonSubmit 添加id，并使用如下选择器：
.find('ButtonSubmit[id="foo"]')