在Jasmine中测试事件是否已触发

Question

在Jasmine中测试事件是否已触发

javascriptunit-testingtestingjasminejquery-events

13

如何在不使用jquery-jasmine的情况下在Jasmine中测试事件是否已触发？

我正在开发一个项目，我们不使用jQuery（呼啦），我试图为我的菜单触发函数编写单元测试。它的工作原理如下：

您单击一个按钮
我的可测试组件然后运行 document.dispatchEvent(new CustomEvent('menu.toggle'))
我想测试该组件确实分派了自定义事件。

我该如何测试这个呢？

- Kris Selbekk

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Kris Selbekk · Accepted Answer

我尝试了一下，找到了一个很好的解决方案：

import triggerEvent from 'trigger-event';
import component from './components/site-menu';

describe('triggering menu button', () => {
  let menuToggleSpy;
  beforeEach(() => {
    menuToggleSpy = jasmine.createSpy('event');
    component();
  });

  it('dispatches menu.toggle event', () => {
    document.addEventListener('menu.toggle', menuToggleSpy);

    const $trigger = document.querySelector('.js-trigger-main-menu');
    triggerEvent($trigger, 'click');

    expect(menuToggleSpy).toHaveBeenCalled();
  });
});

基本上创建一个名为“event”的新间谍，将其添加为我的事件处理程序，并验证它是否被调用。

如果有更好的方法来完成这个任务，我很乐意接受不同的答案。