如何在不使用jquery-jasmine
的情况下在Jasmine中测试事件是否已触发?
我正在开发一个项目,我们不使用jQuery(呼啦),我试图为我的菜单触发函数编写单元测试。它的工作原理如下:
- 您单击一个按钮
- 我的可测试组件然后运行
document.dispatchEvent(new CustomEvent('menu.toggle'))
- 我想测试该组件确实分派了自定义事件。
我该如何测试这个呢?
如何在不使用jquery-jasmine
的情况下在Jasmine中测试事件是否已触发?
我正在开发一个项目,我们不使用jQuery(呼啦),我试图为我的菜单触发函数编写单元测试。它的工作原理如下:
document.dispatchEvent(new CustomEvent('menu.toggle'))
我该如何测试这个呢?
我尝试了一下,找到了一个很好的解决方案:
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”的新间谍,将其添加为我的事件处理程序,并验证它是否被调用。
如果有更好的方法来完成这个任务,我很乐意接受不同的答案。
menuToggleSpy
吗?我收到了一个“找不到变量”的错误。 - adamdportdescribe
块的第一行中指定了。@zameb - 我在实际测试的第一行将spy添加为"menu.toggle"事件的事件处理程序。 - Kris Selbekk