webdriverio-skill

WebdriverIO 自动化技能

第 1 步 — 执行目标

默认在本地运行。如果提到“cloud”“TestMu”或“LambdaTest”，则通过 WDIO LambdaTest 服务在云端运行。

第 2 步 — 框架

信号	测试运行器
默认	Mocha
“Jasmine”	Jasmine
“Cucumber”“BDD”	Cucumber

核心模式

选择器

// ✅ Preferred
await $('[data-testid="submit"]').click();
await $('aria/Submit').click();
await $('button=Submit').click(); // text-based

// Chaining
await $('form').$('input[name="email"]').setValue('[email protected]');

// Multiple elements
const items = await $$('.list-item');

基本测试（Mocha）

describe('Login', () => {
    it('should login successfully', async () => {
        await browser.url('/login');
        await $('[data-testid="email"]').setValue('[email protected]');
        await $('[data-testid="password"]').setValue('password123');
        await $('[data-testid="submit"]').click();
        await expect(browser).toHaveUrl(expect.stringContaining('/dashboard'));
    });
});

页面对象

class LoginPage {
    get inputEmail() { return $('[data-testid="email"]'); }
    get inputPassword() { return $('[data-testid="password"]'); }
    get btnSubmit() { return $('[data-testid="submit"]'); }

    async login(email, password) {
        await this.inputEmail.setValue(email);
        await this.inputPassword.setValue(password);
        await this.btnSubmit.click();
    }
}
module.exports = new LoginPage();

TestMu AI 云配置

// wdio.conf.js
exports.config = {
    user: process.env.LT_USERNAME,
    key: process.env.LT_ACCESS_KEY,
    hostname: 'hub.lambdatest.com',
    port: 80,
    path: '/wd/hub',
    services: ['lambdatest'],
    capabilities: [{
        browserName: 'Chrome',
        browserVersion: 'latest',
        'LT:Options': {
            platform: 'Windows 11',
            build: 'WDIO Build',
            name: 'WDIO Test',
            video: true,
            network: true,
        }
    }],
};

等待策略

// Wait for element
await $('[data-testid="result"]').waitForDisplayed({ timeout: 10000 });

// Wait for condition
await browser.waitUntil(
    async () => (await $('[data-testid="count"]').getText()) === '5',
    { timeout: 10000, timeoutMsg: 'Count did not reach 5' }
);

快速参考

任务	命令
初始化	npm init wdio@latest
运行全部测试	npx wdio run wdio.conf.js
运行指定测试	npx wdio run wdio.conf.js --spec ./test/login.js
运行测试套件	npx wdio run wdio.conf.js --suite smoke
并行运行	在配置中设置 maxInstances: 5
截图	await browser.saveScreenshot('./screenshot.png')

参考文件

文件	阅读时机
reference/cloud-integration.md	LambdaTest 服务、并行运行、功能配置
reference/advanced-patterns.md	自定义命令、报告器、服务

深入了解模式 → reference/playbook.md

§	章节	内容
1	生产环境配置	多环境、多浏览器配置
2	页面对象模型	BasePage、LoginPage、DashboardPage
3	自定义命令	浏览器和元素命令、TypeScript
4	网络模拟	DevTools 模拟、中止、错误模拟
5	文件操作	上传、下载、拖放
6	多标签页、iFrame 和 Shadow DOM	窗口句柄、嵌套 Shadow DOM
7	视觉回归测试	图像比较服务
8	API 测试	基于 Fetch、API 与 UI 组合测试
9	移动端测试	Appium 服务集成
10	LambdaTest 集成	云端网格配置
11	CI/CD 集成	GitHub Actions、Docker Compose
12	调试快速参考	11 个常见问题
13	最佳实践清单	14 项