茉莉花测试中角度元素的调度事件不起作用

Question

在我的测试用例中，我正在尝试这样的事情：

element = angular.element('<div></div>')
element.trigger('mouseenter');

但是，有错误说“未定义不是函数”。我认为这是因为我没有使用 jquery。我也试过这个：

goog.events.dispatchEvent(element[0], 'mouseenter');

但是，它说“断言失败：不能将 goog.events.dispatchEvent 与非 goog.events.Listenable 实例一起使用”

有什么解决办法吗？

Answer 1

您所追求的是以编程方式触发鼠标事件。这不需要解决方法或库。要使用的对象或方法取决于您要定位的环境。

以编程方式触发事件涉及创建自定义事件。由于您控制此自定义事件，因此您还可以决定它是可取消的还是气泡的。请注意，mouseenter在 IE 上不会冒泡。

下面的元素事件目标没有被任何 DOM 库包装——它只是对名为targetEl.

当前规范：使用MouseEvent构造函数。

var event = new MouseEvent('mouseenter', { 
  'view': window, 
  'bubbles': true, 
  'cancelable': true 
});
targetEl.dispatchEvent(event);

var event = document.createEvent('MouseEvents');
event.initEvent('mouseenter', true /*bubbles*/, true /*cancelable*/);
targetEl.dispatchEvent(event);

var event = document.createEventObject();
targetEl.fireEvent('onmouseenter', event);

对于涉及 Closure: 的问题的一部分，goog.events.dispatchEvent不会将原始 DOM 元素作为事件目标，因为它需要一个实现特定接口的对象（一个Listenable）。至于 Angular，它的jqLite实现不包括 jQuery 的.trigger()方法。

除非您专门评估库在测试环境中触发自定义事件（与响应它们相反）的能力，否则上述方法是可行的方法。