Question

Spectron是用于自动node.js个应用的Electron框架。我正在使用Spectron以及AVA和Typescript进行自动化集成测试。我正在使用AVA's suggest method来使测试的上下文类型安全，但我无法弄清楚如何在Spectron的客户端属性（webdriverio客户端上获得类型安全性。我只能看到Spectron打字稿定义文件提供的一些属性，这导致了打字稿变换错误。

这些是我得到的错误：

src/pages/drive-shell.ts(7,34): error TS2339: Property 'waitForVisible' does not exist on type 'SpectronClient'.
src/pages/login.ts(7,34): error TS2339: Property 'waitForVisible' does not exist on type 'SpectronClient'.
src/pages/login.ts(11,21): error TS2339: Property 'setValue' does not exist on type 'SpectronClient'.
src/pages/login.ts(12,21): error TS2339: Property 'setValue' does not exist on type 'SpectronClient'.
src/pages/login.ts(13,21): error TS2339: Property 'click' does not exist on type 'SpectronClient'.

Answer 1

我实际上解决了这个问题，因为我正在打字这个问题，但是因为我做了一些搜索而无法找到任何解决方案我认为我可能会回答我自己的问题以帮助其他人。

我需要获得webdriver io的打字

npm i -S @types/webdriverio

然后我将该类型导入我的login.ts脚本并将其用作SpectronClient

import * as WebdriverIO from 'webdriverio';
export class Login {
    constructor(private client: WebdriverIO.Client<void>) { }

    public async waitForPageToLoad() {
        return await this.client.waitForVisible('#username');
    }

    public login(username: string, password: string) {
        this.client.setValue('#username', username);
        this.client.setValue('#Password', password);
        this.client.click('#login');
    }
}

这是我的完整test.ts测试脚本

import * as ava from 'ava';
import { Application } from 'spectron';
import { Login } from './pages/login';
import { Settings } from './settings';

function contextualize<T>(getContext: () => Promise<T>): ava.RegisterContextual<T> {
    ava.test.beforeEach(async (t) => {
        Object.assign(t.context, await getContext());
    });
    return ava.test;
}
const test = contextualize(async () => {
    const app = new Application({
        path: '../electron.exe',
        args: ['../app/index.html'],
    });
    await app.start();
    return { app };
});

test.afterEach.always(async (t) => await t.context.app.stop());

test('can login', async (t) => {
    const login = new Login(t.context.app.client);
    await login.waitForPageToLoad();
    login.login(Settings.username, Settings.password);
});

Answer 2

截至目前（2019年7月），WebdriverIO已移至版本5.0，但Spectron仍使用WebdriverIO4。请确保在安装WebdriverIO类型以解决此问题时指定Spectron中使用的版本：

npm i -S @types/webdriverio@^4.8.0

Answer 3

在花了几乎一整天的时间深入研究源代码后，我发现 Spectron 文档是错误的。

它明确地说，

<块引用>

Spectron 使用 WebdriverIO 并在创建的应用程序实例上公开托管客户端属性。客户端 API 是 WebdriverIO 的浏览器对象。

但是从 WebdriverIO documentation 中可以看出，click、setValue 等函数不是 browser 对象的一部分。它们在 element object 下可用。所以这就是我所做的，

const inputText = await app.client.$('user_name'); // get hold of the element
inputText.click(); // get access to the WebdriverIO functions

如何为SpectronClient实现Typescript webdriverio？

3 个答案: