量角器中的async/await样板

Question

我正在尝试使用async/ awaitwith protractorin TypeScript.我正在关注以下示例:https://github.com/angular/protractor/tree/master/exampleTypescript/asyncAwait

它在我的实验中运行良好.但是,我必须await在与浏览器交互相关的每个调用上使用.

例如:

我有一个登录页面的页面对象:

login.ts:

import {browser, element, by, By, $, $$, ExpectedConditions} from "protractor";
import { DashboardPage } from "./dashboard";
export class LoginPage {
    usernameInput = element(by.id("username"));
    passwordInput = element(by.id("password"));
    loginButton = element(by.id("login_button"));

    async get() {
        await browser.get(login_url);
        return this;
    }

    async getTitle() {
        let title = await browser.getTitle();
        return title;
    }

    async typeUsername(username: string) {
        await this.usernameInput.sendKeys(username);
    }

    async typePassword(password: string) {
        await this.passwordInput.sendKeys(password);
    }

    async login() {
        await this.loginButton.click();
        return new DashboardPage();
    }
}

LoginSpec.ts:

import {browser, element, by, By, $, $$, ExpectedConditions} from "protractor";
import { LoginPage } from "../pages/login";
describe("Login Page", function() {

    beforeEach(() => {
        // login page is not an angular page.
        browser.ignoreSynchronization = true;
    });

    afterEach(() => {
        browser.ignoreSynchronization = false;
    });

    it("should go to dashboard page after successfully login", async (): Promise<any> => {
        let loginPage = new LoginPage();
        await loginPage.get();
        await loginPage.typeUsername(username);
        await loginPage.typePassword(password);
        let dashboard = await loginPage.login();
        expect(await dashboard.getTitle()).toEqual(`Dashboard`);
    });
});

在上面的测试规范中,我必须使用很多await来调用浏览器交互.这引入了很多样板await.

问题是,是否有任何减少样板的想法或方法？此外,这是用正确的方法async/ await用protractor？

Answer 1

不幸的是，如果没有所有这些等待 - 您的代码将无法正确同步。在某些情况下，您可以省略粘贴等待 - 但大多数情况下这是必要的，因为等待使您的承诺一一安排。

Async/Await 仍然依赖于 Promise。所以你的等待代码的工作方式与此相同：

it("should go to dashboard page after successfully login", (): Promise<any> => {
    let loginPage = new LoginPage();
    return loginPage.get().then(() => {
        return loginPage.typeUsername(username);
    }).then(() => {
        return loginPage.typePassword(password);
    }).then(()=> {
        return loginPage.login();
    }).then((dashboard)=> {
        return expect(dashboard.getTitle()).toEqual(`Dashboard`);
    })
});

因此，考虑等待就像一个很好的语法糖而不是承诺链： https://github.com/SeleniumHQ/selenium/wiki/WebDriverJs#option-1-use-classic-promise-chaining

但是有一种方法可以在不放置 waits\thens\generators\callbacks 的情况下进行同步。它被称为“纤维”。不幸的是量角器不支持这一点，但WebdriverIO使用它来同步代码： https ://www.facebook.com/ProtractorAngularJS/posts/1950761568515087