replace browser.sleep in Protractor and WebDriver to wait for an element

You should never use browser.driver.sleep(1000) in order to wait for an element with Protractor.

do not use browser wait with protractorInstead use ExpectedConditions in order to  with Protractor.

browser.wait(EC.presenceOf(detailsTableResidents), 3500);
This means, it will wait up to 3500 ms, until the element is rendered.
If the element is rendered within 1000ms, it will skip the rest of 2500 waiting ms. Therefore, you saved 2500ms.

Explanation. Why you should use EC instead of sleep in order to wait for an element to be rendered with Protractor.

Protractor is “Angular aware”, meaning it does some nice stuff for you, like being smart enough to know when an Angular application is bootstrapped, handling things like waiting for a digest loop to complete when you update your model, etc.
There’s absolutely no rule on how long will it take for a specific element to render. If the network does works really well it will take a longer time to download the sources
In simpler words, this means that Protractor will directly communicate with Angular application, in order to shorthen the time, and it will get real time information that a specific DOM element was updated.
The difference between browser.sleep() and browser.wait() is that browser.wait() expects a specific value/condition. This wait condition is valid of Protractor or any WebDriver framework.
Another thing that needs mentioned here is that Protractor/WebDriver will stop running that function as soon as that function is evaluated to true, or the timeout time is complete.

Now, I will actual show how to use Smart Waits with Protractor / How to use Expected Conditions with Protractor

Another way for rewriting protractor.driver.sleep, is using async functions and browser wait.
let matchingFile = UtilsFiles.getFile(filePath);
browser.driver.wait(function () {
    if (matchingFile) {
        return true;
    return false;
}, 3000);
In the example above the UtilsFiles.getFile(filePath); method, calls for a value. It that method receives a value within 3000 miliseconds, then it will return true and continue, otherwise will return false.
how To wait for an element to contain any text, you can write a custom expected condition:
let EC = protractor.ExpectedConditions;
let testSearchingLookingMethod = function(elementFinder) {
    let searchesForText = function() {
        return elementFinder.getText().then(function(actualTextResultedFromAPromise) {
            return actualTextResultedFromAPromise;
    return EC.and(EC.presenceOf(elementFinder), searchesForText);
How to run the above function:
browser.wait(testSearchingLookingMethod(element(by.css(‘.divName’)), 5000);
There are a bunch of methods for EC already written for Protractor that you should use in your tests!

Examples of Expected Conditions for Protractor:

Negates the result of a promise.
Chain a number of expected conditions using logical_and, short circuiting at the first expected condition that evaluates to false.
// Waits for title to contain ‘Foo’, but is not ‘FooBar’
Chain a number of expected conditions using logical_or, short circuiting at the first expected condition that evaluates to true.
// it waits until title contain either ‘Foo’ or ‘Bar’
Expect an alert to be present.
An Expectation for checking an element is visible and enabled such that you can click it.
An expectation for checking if the given text is present in the element.
An expectation for checking if the given text is present in the element’s value.
An expectation for checking that the title contains a case-sensitive substring.
An expectation for checking the title of a page.
An expectation for checking that the URL contains a case-sensitive substring.
An expectation for checking the URL of a page.
An expectation for checking that an element is present on the DOM of a page.
An expectation for checking that an element is not attached to the DOM of a page.


An expectation for checking that an element is present on the DOM of a page and visible.


An expectation for checking that an element is either invisible or not present on the DOM.
An expectation for checking the selection is selected.
How to wait for page complete after click an element with With WebDriver{
 // will start processing then as soon as click completed loaded.
Do you you have some specific question in mind? Get in touch with me and ask me !

3 Responses

    1. So I have an issue I am trying to resolve where I was using sleeps to wait but because of app performance I am constantly dealing with intermittent failures do to timing. Basically my specs run against an ng app that is constantly updated, when it is updated the TOS get updated and a flag is set to make a modal pop every time a user logs in. Almost all specs run a login() beforeAll. Some times the modal is there, sometimes it’s not. I am looking to update my TOSCheck() function with EC’s but I am curious as how to approach it.

  1. you can check if that element is present, and if is present condition return true (wrapped in a promise) then skip the modal. if not, then don’t skip the modal. if the modal gets triggered, then the true condition for skip modal will get triggered as well. this should help you with your timing issue for your app.
    let me know if you still have issues, I will help with your Protractor app!

Leave a Reply

Back to Top