CODEWITHSUNDEEP
angulartypescriptprotractorweb-deployment
Marcel Wiechmann
Marcel Wiechmann

Reputation: 73

Angular2 E2E Protractor. Wait until element has class

I need find a way to wait with my e2e test (angular2 project) until the tested element gets an specific css class.

Is there any possible way without browser.wait() or browser.sleep()?

Upvotes: 5

Views: 2377

Answers (2)

René Rubio Cruz
René Rubio Cruz

Reputation: 1

This function waits for a class to disappears from an element, given the element object (ElementFinder) and the CSS class you want to check for.

    static async waitCssClassToDisappear(elem:ElementFinder, cssClass:string, timeout?: number) {
        await browser.wait(()=>{
            return elem.getAttribute('class').then((value) =>{
                return value.indexOf(cssClass) < 0;
            });
        }, timeout ? timeout : Utils.defaultTimeout, 'CSS class did not disappear within specified timeout');
    }

Upvotes: 0

alecxe
alecxe

Reputation: 473873

You've even used the word "wait" in the question, but asking to solve it without the built-in waiting functions. I don't see much sense in that.

We've solved something similar before and came up with a custom wait function which can be used as an Expected Condition with browser.wait():

function waitForCssClass(elementFinder, desiredClass) {
    return function () {
        return elementFinder.getAttribute('class').then(function (classValue) {
            return classValue && classValue.indexOf(desiredClass) >= 0;
        });
    };
};

browser.wait(waitForCssClass($("#myid"), "desiredClass"), 5000);

Upvotes: 7

Related Questions