The Asynchronous Nature of Angular Test Drive with Waiting

I have the following typescript class that I am using to test the transporter. For auth, the OpenAM server is started.

import { element, by, ElementFinder, browser, ExpectedConditions} from 'protractor';
import { BasePage } from './base.pageobject';
import { SelectSitePage } from './select-site.pageobject';

export class AuthPage extends BasePage {
    readonly url: string = '/';

    readonly loginMenu: ElementFinder = element(by.css('nav.profile-menu'));
    readonly loginLink: ElementFinder = element(by.cssContainingText('a', 'Login'));
    readonly logoutLink: ElementFinder = element(by.cssContainingText('a', 'Logout'));

    // On OpenAM login page
    readonly userNameField: ElementFinder = element(by.id('idToken1'));
    readonly passwordField: ElementFinder = element(by.id('idToken2'));
    readonly loginButton: ElementFinder = element(by.id('loginButton_0'));
    readonly aintExist: ElementFinder = element(by.id('loginButton_666'));

    private selectSitePage: SelectSitePage = new SelectSitePage();

    /**
     * Log in if are not already
     */
    public logIn() {
        this.loginMenu.click();
        this.loginLink.isPresent().then((isPresent: boolean) => {
            if (isPresent) {
                this.loginLink.click();

                this.disableWaitingForAngular();
                var EC = ExpectedConditions;
                let loginButtonExpected = EC.presenceOf(this.loginButton);
                console.log('wait for login button ...');
                browser.driver.wait(loginButtonExpected, 2000);
                console.log('login button present');
                this.userNameField.clear();
                this.userNameField.sendKeys('user');
                this.passwordField.clear();
                this.passwordField.sendKeys('pw');
                this.loginButton.click();

                let searchBoxExpected = EC.presenceOf(this.selectSitePage.searchBox);
                console.log('wait for searchBox ...');
                browser.driver.wait(searchBoxExpected, 2000);
                console.log('searchBox present');

                this.enableWaitingForAngular();
            } else {
                console.log('AuthPage / logIn - already logged in');
            }
        });
    }

      

This works great, however it console.log

is issued almost immediately, as if it were wait()

not affecting them. However, the test failed if removed, so they seem to be relevant.

Are waits only for WebDriver objects? Doko doesn't make it clear.

+3


source to share


1 answer


Almost all of the teams in the Transporter async

. This means that they must be solved first. This also applies to wait

, see the docs .

So in your case, all commands are executed one after another, but since the sync is console.log()

synchronized, it will log the result before the promise of the previous line was resolved.

Maybe this article can help you with promises if you have problems with them.

If you want it to take console.log()

place after the previous line, you can do something like this



var EC = ExpectedConditions;
let loginButtonExpected = EC.presenceOf(this.loginButton);
console.log('wait for login button ...');
browser.driver.wait(loginButtonExpected, 2000)
    .then(() => {
       console.log('login button present');
    });

      

By the way. You are using TypeScript. This means that you can also use methods async / await

that will make your code more "synchronized" and await

"hold" the next line before the previous line is resolved. See also github protractor example project

Hope it helps

0


source







All Articles