在 React 中使用 Enzyme 模拟带有参数的 onClick 方法

Question

我正在尝试使用 Enzyme for React 在我的单元测试中模拟 onClick 方法。我找到了许多模拟带有一些事件 e 的 onClick 的指南，例如：

handleClick(e) {
    // Does something
}

....
<MyComponent
onClick = {handleClick}
></MyComponent>

但是我希望能够模拟我的 onClick ，它不将事件作为参数，而是采用其他东西，即：

onClick = {() => handleClick(myParam)}

我试过使用，.simulate('click', [myParam]);但它没有像我预期的那样传递参数。

我将如何模拟将特定参数发送到处理程序的点击？

Answer 1

根据文件，它指出：

.simulate(event[, mock]) => 自模拟事件

参数

事件（字符串）：要模拟的事件名称模拟（对象 [可选]）：将与传递给处理程序的事件对象合并的模拟事件对象。

所以你需要修复你的代码并传递一个对象：

.simulate('click', {myParam});

您还可以查看 implementationaion 并在此处查看它是如何传递给事件处理程序的：

simulate(event, ...args) {
    const handler = this.prop(propFromEvent(event));
    if (handler) {
      withSetStateAllowed(() => {
        // TODO(lmr): create/use synthetic events
        // TODO(lmr): emulate React's event propagation
        performBatchedUpdates(this, () => {
          handler(...args);
        });
        this.root.update();
      });
    }
    return this;
  }