CODEWITHSUNDEEP
angularseleniumselenium-webdriverprotractor
Stan
Stan

Reputation: 163

protractor angular app browser.wait does not wait for element

I'm checking wrong log in message. I'm using async spec with browser.wait to wait for element to appear in DOM. But it does not work as expected. I would expect it to wait for given timeout if element is not present. But the spec fail quickly with message that element does not exist. It makes no sense. If it really does not exist it should wait for it and fail after timeout.

it("reports wrong login",  async () => {
    browser.waitForAngularEnabled(false);
    await username.clear(); //clear as it may be filled already with something
    await password.clear(); //clear as it may be filled already with something
    await username.sendKeys("wrongemail");
    await password.sendKeys("wrongpass");
    await submitButton.click();

    let errorTextElement = element(by.css(".has-remote-error > small"));
    let until = protractor.ExpectedConditions;
    browser.wait(until.presenceOf(errorTextElement), 5000, "error message element not found in DOM");
    let errorText = await errorTextElement.getText();

    //CHECKS
    expect(errorText).toEqual("Your email address or password is incorrect!");

})

I tired several ways to do this I found. This seems to be the correct way to do it. Why is this not working?

here is the fail test message:

Failed: No element found using locator: By(css selector, .has-remote-error > small)

usign protractor version 5.4.3 direct connect chrome 80.0.3987.149 on Mac OS X

actually here is config

// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/docs/referenceConf.js

const HtmlReporter = require('protractor-beautiful-reporter');

exports.config = {
    allScriptsTimeout: 30000,
    specs: [
        './e2eTests/**/*.e2e-spec.ts'
    ],
    capabilities: {
        'browserName': 'chrome'
    },
    directConnect: true,
    baseUrl: 'http://localhost:4200/',
    framework: 'jasmine',
    SELENIUM_PROMISE_MANAGER: false,
    // Options to be passed to Jasmine.
    jasmineNodeOpts: {
        showColors: true,
        defaultTimeoutInterval: 30000,
        print: function() {}
    },
    useAllAngular2AppRoots: true,
    beforeLaunch: function() {

    },
    onPrepare: function() {
        require('ts-node').register({ project: 'e2eTests/tsconfig.e2e.json' });

        // Add a screenshot reporter:
        jasmine.getEnv().addReporter(new HtmlReporter({
            preserveDirectory: false,
            takeScreenShotsOnlyForFailedSpecs: true,
            screenshotsSubfolder: 'images',
            jsonsSubfolder: 'jsons',
            baseDirectory: 'e2eTests/reports',
            clientDefaults:{
                useAjax:false,
                totalDurationFormat:'hms',
                showTotalDurationIn: 'header'
            }
        }).getJasmine2Reporter());


    }
};

Upvotes: 0

Views: 388

Answers (1)

Raj Kumar
Raj Kumar

Reputation: 788

Set waitForAngularEnabled to true and then try

it("reports wrong login",  async () => {
    browser.waitForAngularEnabled(true);
    await username.clear(); //clear as it may be filled already with something
    await password.clear(); //clear as it may be filled already with something
    await username.sendKeys("wrongemail");
    await password.sendKeys("wrongpass");
    await submitButton.click();

    let errorTextElement = element(by.css(".has-remote-error > small"));
    let until = protractor.ExpectedConditions;
    browser.wait(until.presenceOf(errorTextElement), 5000, "error message element not found in DOM");
    let errorText = await errorTextElement.getText();

    //CHECKS
    expect(errorText).toEqual("Your email address or password is incorrect!");

})

Upvotes: 0

Related Questions