CODEWITHSUNDEEP
protractor
patarakc
patarakc

Reputation: 13

protractor ExpectedConditions wait for DOM attribute to contain

I have the following DOM element:

input type="checkbox" class="ng-untouched ng-pristine ng-valid" ng-reflect-model="false"

In Protractor- I need to wait for the attribute ng-reflect-model to equal true before I perform my assertions. Is there a browser.wait ExpectedCondition to do this? If so, what is it?

I'm looking for something like Selenium's attributeContains

Upvotes: 0

Views: 741

Answers (3)

Silvan Bregy
Silvan Bregy

Reputation: 2734

You can create a helper function which can be used in other places too, for waiting for a specific condition:

export async function forCondition(condition: () => boolean | PromiseLike<boolean>, timeout = 20000): Promise<boolean> {
  try {
    return await browser.wait(condition, timeout);
  } catch (err) {
    return false;
  }
}

In code you can then do something like:

// other helper function
async function isValueSet(): Promise<boolean> {
  let input = element(by.model('input');
  let value = await input.getAttribute('ng-reflect-model');

  // cast to boolean operator.
  return !!value;
}

And then in the test:

it('should wait for value to be true', async function() {
  await forCondition(function () { return  isValueSet(); }, 30000);
  // expect()... 
}

Upvotes: 0

patarakc
patarakc

Reputation: 13

How does this look if I want to pass in parameters rather than have static values?

timer = 5000;

static waitForAttributeToContain(item: ElementFinder, attribute: string, value: string) {
    browser.wait(() => {
        return item.getAttribute(attribute).then(
            function(attributeCheck) {
                return attributeCheck === value;
            });
    }, timer);
}

Upvotes: 0

Sudharsan Selvaraj
Sudharsan Selvaraj

Reputation: 4832

There is no predefined expected condition available in protractor to verify attribute change for an element. But you can create your own wait condition like below,

browser.wait(function(){
  return element(by.css("input[type='checkbox']"))
                  .getAttribute("ng-reflect-model")
                  .then(function(ngReflectModel){
                     return ngReflectModel == "false";
                  })
},5000);

Upvotes: 1

Related Questions