如何使用jest测试使用捕鼠器创建的事件

时间:2018-01-31 11:03:43

标签: reactjs jest mousetrap

我正在使用mousetrap编写一个使用react的应用程序。我想知道如何在开玩笑中测试捕鼠器的事件。我想查看单击向左箭头时是否正在调用组件函数。我无法在测试中模拟此事件。似乎反应合成事件之外的事件不会对组件进行任何更改。我认为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();

  });

1 个答案:

答案 0 :(得分:0)

尝试使用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();

  });