No way to test ngMouseenter?

Question

I've searched the docs and google and am struggling to find solid references to how one is supposed to write an E2E test for ngMouseenter events. Angular's E2E testing tools has element(<selector>).click() but nothing as far as I can see for other event types.

In my case the mouseenter (and mouseleave) triggers behavior I'd like to keep tested, and I imagine others have similar use cases. Is there a way to do this?

[edit]

I found an extension for angular's scenario runner here on SO: AngularJS: how to invoke event handlers and detect bindings in tests

This allows me to do:

jqFunction(<selector>, "mouseenter")

and works great.

score 1 · Answer 1 · answered Oct 12 '13 at 03:50

1

Looking on the angular github there is a pull request for mouseover which was merged in v1.1.2 here. Maybe this will help?

Otherwise, so long as you can trigger the event using jQuery you should be able to do something like

element(<selector>).query(function(selected, done) {
    selected.trigger('mouseenter');
    done();
});

for any custom events. Saying this, I have tried testing in a plunker and can't seem to get mouseenter to trigger at all, whether or not angular is involved.

answered Oct 12 '13 at 03:50

Andyrooger

6,748
1
43
44

Unfortunately this solution didn't seem to work, though I'm not precisely sure why. However, I found a useful extension here on SO, that allows me to do what I'm looking for: http://stackoverflow.com/questions/17575768/angularjs-how-to-invoke-event-handlers-and-detect-bindings-in-tests/17807007#17807007 – cmw Oct 15 '13 at 22:35
Good spot. Seeing this, I think I understand why mine doesn't work and others such as the one linked do. Inside my `query`, `selected` is a jq object from the jQuery lib provided inside scenario runner (1.8.2 in my case). When I trigger an event on that, it runs the handlers attached in the cache for that jQuery instance. The link shows how to get the jQuery instance from the actual app (so tethers the tests to the app a little more) and allows you to trigger like you had done from your own app. I'm still a little confused as to why `click` will work but `mouseenter` won't though. – Andyrooger Oct 16 '13 at 01:29

score 1 · Answer 2 · edited May 23 '17 at 12:15

1

The ng-mouseenter directive builds on the mouseover event internally. To trigger it, just call

yourElement.trigger('mouseover');

No way to test ngMouseenter?

2 Answers2