酶模拟‘点击’不工作时，它应该

Question

我正在使用Jest和Enzyme来测试一个表单组件，但我在模拟点击时遇到了问题。供参考：Button是一个带样式的rebass按钮，并以如下形式存在：

<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"]')