reactjs - 如何在使用 jest 的反应中测试使用捕鼠器创建的事件

Question

我正在编写一个使用捕鼠器的反应应用程序。我想知道如何开玩笑地测试捕鼠器的事件。我想查看单击左箭头时是否正在调用组件函数。我无法在测试中模拟此事件。似乎反应合成事件之外的事件没有对组件进行任何更改。我认为 Mousetrap 将事件附加到窗口。我需要知道如何测试这个功能。

it("checks on leftclick", () => {

    var spy = jest.spyOn(MyComponent.prototype, "onLeftClick");
    var wrapper = mount(<MyComponent />);
    var event = simulant( 'keyDown', { key: 37, which: 37 });
    simulant.fire(window, event); // It did not work
    ReactTestUtils.simulate.keyDown(window, { key: "ArrowLeft", keyCode: 37, which: 37 }) //Did not work either
    expect(spy).toHaveBeenCalled();
    spy.mockReset();
    spy.mockRestore();

  });

Answer 1

尝试使用document.documentElement代替window和以下模拟火灾语法：

it("checks on leftclick", () => {

    var spy = jest.spyOn(MyComponent.prototype, "onLeftClick");
    var wrapper = mount(<MyComponent />);
    simulant.fire(document.documentElement, "keydown", { keyCode: 37 });
    expect(spy).toHaveBeenCalled();
    spy.mockReset();
    spy.mockRestore();

  });