In a web form built using AngularJS, I'm trying to enter some data into a bo box, then select a value by pressing the down arrow key and then the Enter key. After that, I'm checking that the bo box's popup window (it's a Kendo UI Combo Box) is no longer visible.

The tests run in Chrome on Windows and Mac OS X. On Windows, the following code works fine:

boInput.sendKeys('CAN')
    .sendKeys(protractor.Key.ENTER)
    .sendKeys(protractor.Key.ARROW_DOWN)
    .sendKeys(protractor.Key.ENTER);

expect(input.getAttribute('value')).toBe('id_3');
expect(popup.getAttribute('style')).toContain('display: none');

Protractor enters "CAN" into the bobox, then selects the visible entry using the down arrow key, and then confirms the selection using the Enter key, which also dismisses the Combo Box popup.

On OS X, this doesn't work, the second expectation always fails, since the Enter key event to dismiss the popup isn't fired before evaluating the expectation for some reason.

I found that I have to change the code to the following to make it work:

boInput.sendKeys('CAN')
    .sendKeys(protractor.Key.ENTER)
    .sendKeys(protractor.Key.ARROW_DOWN)
    .sendKeys(protractor.Key.ENTER).then(function() {
        expect(input.getAttribute('value')).toBe('id_3');
        expect(popup.getAttribute('style')).toContain('display: none');
    });

sendKeys returns a promise, and if I put the expectation in there, everything works fine.

Is this the correct way to do this? None of the examples I found on the web use the then call on sendKeys.

And why does the first code work on Windows and not on OS X? Am I missing something? Is there a better way to do this?

Edit: Is this possibly related to the handling of native keyboard events on OS X? The Protractor documentation at .WebElement.prototype.sendKeys has the following:

Note: On browsers where native keyboard events are not yet supported (e.g. Firefox on OS X), key events will be synthesized. Special punctionation keys will be synthesized according to a standard QWERTY en-us keyboard layout.

In a web form built using AngularJS, I'm trying to enter some data into a bo box, then select a value by pressing the down arrow key and then the Enter key. After that, I'm checking that the bo box's popup window (it's a Kendo UI Combo Box) is no longer visible.

The tests run in Chrome on Windows and Mac OS X. On Windows, the following code works fine:

boInput.sendKeys('CAN')
    .sendKeys(protractor.Key.ENTER)
    .sendKeys(protractor.Key.ARROW_DOWN)
    .sendKeys(protractor.Key.ENTER);

expect(input.getAttribute('value')).toBe('id_3');
expect(popup.getAttribute('style')).toContain('display: none');

Protractor enters "CAN" into the bobox, then selects the visible entry using the down arrow key, and then confirms the selection using the Enter key, which also dismisses the Combo Box popup.

On OS X, this doesn't work, the second expectation always fails, since the Enter key event to dismiss the popup isn't fired before evaluating the expectation for some reason.

I found that I have to change the code to the following to make it work:

boInput.sendKeys('CAN')
    .sendKeys(protractor.Key.ENTER)
    .sendKeys(protractor.Key.ARROW_DOWN)
    .sendKeys(protractor.Key.ENTER).then(function() {
        expect(input.getAttribute('value')).toBe('id_3');
        expect(popup.getAttribute('style')).toContain('display: none');
    });

sendKeys returns a promise, and if I put the expectation in there, everything works fine.

Is this the correct way to do this? None of the examples I found on the web use the then call on sendKeys.

And why does the first code work on Windows and not on OS X? Am I missing something? Is there a better way to do this?

Edit: Is this possibly related to the handling of native keyboard events on OS X? The Protractor documentation at http://angular.github.io/protractor/#/api?view=webdriver.WebElement.prototype.sendKeys has the following:

Note: On browsers where native keyboard events are not yet supported (e.g. Firefox on OS X), key events will be synthesized. Special punctionation keys will be synthesized according to a standard QWERTY en-us keyboard layout.

• javascript
• angularjs
• protractor

• Excellent question! I don't have an answer but suggest you to, if using Jasmine, separate the sendKeys part from the expect part each within its own it() block and avoid then with that technique. – Leo Gallucci Commented Oct 9, 2014 at 10:49
• Also checkout issue #690 for some links regarding OSX sendKeys issues. – Leo Gallucci Commented Oct 9, 2014 at 10:49
• But wouldn't that defeat the purpose? To me, each test (described in an "it") prises both the actions (sendKeys in this case) and the verification (expect). Splitting them up into separate tests breaks that link. – nwinkler Commented Oct 9, 2014 at 15:02
• Good point. However in the practical side of things that has worked out great for me when using Protractor while attempting to do more than 1 thing in a Jasmine spec has lead to flaky tests. – Leo Gallucci Commented Oct 9, 2014 at 16:18

1 Answer 1

Since sendKeys returns a promise, it's asynchronous (as you know) and is liable to happen later than expected on any machine. I strongly suspect that if you ran the test 1000 times on Windows, it would fail at least a few times for the same reason.

I've almost died of old age trying to find a "best practice" for cases like this, and I don't think there is one, other than what you're already doing. Many of my Protractor tests that rely on promise-returning actions end up being long strings of then() statements with anonymous functions inside. See the link:

How to assign count of rows or getText to a variable in Protractor

Basically, if you don't force Protractor to do things in the right order, then five times out of ten they will happen in the wrong order.