Angular E2E Test: Getting "input" from "element"

Question

I attempting to set a text field value using angular's e2e test framework. Per their documentation, I have to use:

input(<model>).enter(<value>)

However, since the model is embedded in a repeater, passing the model isn't straight forward from the test context. I can though, pull it by using:

element('my_element_here', 'description')

However, the .enter(<value>) call can ONLY be called from what input() returns apparently and I can't figure out how to convert the return of element to what input() returns so I can simply call enter() on it!!

I have to assume I'm just overlooking something...

score 3 · Accepted Answer · edited May 05 '14 at 20:22

Yeah, the E2E input() method is sort of a nuisance as it does a find based on the ng-model of a particular input.. So for situations like ng-repeat, it doesn't lend itself to any practical use.

Good news is, you can get the functionality you want just using element().

element('my_element_here').val('Value I want to enter!')
expect(element('my_element_here').val()).toEqual("Value I want to enter!")

Basically, the element() call can be chained with any of these jQuery-esque methods:

val, text, html, height, innerHeight, outerHeight, width, innerWidth, outerWidth,
position, scrollLeft, scrollTop, offset.

The E2E Test harness for Angular is... interesting. And in desperate need of some TLC. But it's actually pretty good at what it does, once you get over the awkwardness of it! (And assuming you survive the documentation)

Presumably the double quote here `t to enter!")` should be a single quote? — KayEss, Oct 04 '13 at 10:33

score 2 · Answer 2 · answered Oct 04 '13 at 10:29

this works for me: to trigger the event input on a specific element

var evtInput = document.createEvent('Event');
    evtInput.initEvent('input', true, false);

element('#my-element').query(function(el, done) {          
                el[0].dispatchEvent(evtInput);
                done();
            });

score -1 · Answer 3 · answered Jul 10 '13 at 12:31

-1

I would add that to mimic exactly input behaviour you need to fire a 'change' event (which .val() does do)

element('my_element_here').val('Value I want to enter!");
element('my_element_here').trigger('input'); // Or 'change' if do not support 'input'

answered Jul 10 '13 at 12:31

CarolineBda

240
1
4
11

except that element doesn't support trigger – eighteyes Oct 21 '13 at 22:15

Angular E2E Test: Getting "input" from "element"

3 Answers3