Protractor how to wait for options

Question

I have code like this:

        element(by.model("roleSelection.role")).element(by.cssContainingText('option', newRole)).click();//.then(function() {console.log('role click')})//;

where the options is loaded via a call to the server.

I can wait for the first element by doing this

   browser.wait(function() {
return browser.isElementPresent(by.model("roleSelection.role")).then(function(present){
    return present;
});}, 8000);

and it seems to work. But how can I wait until the "sub-element" is clickable. I have tried this

   browser.wait(function() {
return browser.isElementPresent(by.model("roleSelection.role")).then(function(present){
    if (present) {
        var elm = element(by.model("roleSelection.role"));
        return elm.isElementPresent(by.cssContainingText('option', newRole)).then(function(subpresent) {
            return subpresent;
        });
    }
});   }, 8000);

score 0 · Answer 1 · edited May 23 '17 at 12:31

0

Well, try to this: https://angular.github.io/protractor/#/api?view=ExpectedConditions.prototype.elementToBeClickable

But, Please keep in mind, Protractor is suitable for angular webpages and interactions, and animations. For example ng-animate. So, it is not sure to working for example jquery, or other animates.

In this way:

 onPrepare: function () {
    // disable animations when testing to speed things up
    var disableNgAnimate = function () {
      angular.module('disableNgAnimate', []).run(function ($animate) {
        $animate.enabled(false);
      });
    };
    browser.addMockModule('disableNgAnimate', disableNgAnimate);
  }

Or you can switch in script way in browser.executeScript(). Please see this link. It works only jquery animations.

If you not have animate problems. Use setTimeout() JS function.

edited May 23 '17 at 12:31

Community

1
1

answered Feb 09 '16 at 21:17

ktom

228
1
3
11

The page is angular but with manual bootstapping. This page is efter login, then I select role. After that the page fetches the "departments" to select from. Now when this is fetched I select "department". – TheBurnMill Feb 09 '16 at 22:38
I have tried expectedconditions but it didn't work, not even the simple version that works above.The message was something like "could not bind". – TheBurnMill Feb 09 '16 at 22:43

score 0 · Accepted Answer · answered Feb 09 '16 at 23:24

0

Have you tried clickable? Something along these lines

var EC = protractor.ExpectedConditions;
var select = element(by.model("roleSelection.role"))
var isClickable = EC.elementToBeClickable(select);
browser.wait(isClickable,5000); //now options should have been loaded by now

answered Feb 09 '16 at 23:24

nilesh

14,131
7
65
79

This seems to have solved it (most of the time anyway). Thanks alot. – TheBurnMill Feb 15 '16 at 14:58

Protractor how to wait for options

2 Answers2