WebdriverIO Automation Skill
Step 1 — Execution Target
Default local. If mentions "cloud", "TestMu", "LambdaTest" → cloud via WDIO LambdaTest service.
Step 2 — Framework
| Signal |
Runner |
| Default |
Mocha |
| "Jasmine" |
Jasmine |
| "Cucumber", "BDD" |
Cucumber |
Core Patterns
Selectors
// ✅ Preferred
await $('[data-testid="submit"]').click();
await $('aria/Submit').click();
await $('button=Submit').click(); // text-based
// Chaining
await $('form').$('input[name="email"]').setValue('test@test.com');
// Multiple elements
const items = await $$('.list-item');
Basic Test (Mocha)
describe('Login', () => {
it('should login successfully', async () => {
await browser.url('/login');
await $('[data-testid="email"]').setValue('user@test.com');
await $('[data-testid="password"]').setValue('password123');
await $('[data-testid="submit"]').click();
await expect(browser).toHaveUrl(expect.stringContaining('/dashboard'));
});
});
Page Object
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 Cloud Config
// 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 Strategies
// 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' }
);
Quick Reference
| Task |
Command |
| Setup |
npm init wdio@latest |
| Run all |
npx wdio run wdio.conf.js |
| Run specific |
npx wdio run wdio.conf.js --spec ./test/login.js |
| Run suite |
npx wdio run wdio.conf.js --suite smoke |
| Parallel |
Set maxInstances: 5 in config |
| Screenshot |
await browser.saveScreenshot('./screenshot.png') |
Reference Files
| File |
When to Read |
reference/cloud-integration.md |
LambdaTest service, parallel, capabilities |
reference/advanced-patterns.md |
Custom commands, reporters, services |
Deep Patterns → reference/playbook.md
| § |
Section |
Lines |
| 1 |
Production Configuration |
Multi-env, multi-browser configs |
| 2 |
Page Object Model |
BasePage, LoginPage, DashboardPage |
| 3 |
Custom Commands |
Browser + element commands, TypeScript |
| 4 |
Network Mocking |
DevTools mock, abort, error simulation |
| 5 |
File Operations |
Upload, download, drag & drop |
| 6 |
Multi-Tab, iFrame & Shadow DOM |
Window handles, nested shadow |
| 7 |
Visual Regression |
Image comparison service |
| 8 |
API Testing |
Fetch-based, API+UI combined |
| 9 |
Mobile Testing |
Appium service integration |
| 10 |
LambdaTest Integration |
Cloud grid config |
| 11 |
CI/CD Integration |
GitHub Actions, Docker Compose |
| 12 |
Debugging Quick-Reference |
11 common problems |
| 13 |
Best Practices Checklist |
14 items |
1---2name: webdriverio-skill3description: Generates WebdriverIO (WDIO) automation tests in JavaScript or TypeScript. Supports local and TestMu AI cloud. Use when user mentions "WebdriverIO", "WDIO", "wdio.conf", "browser.url", "$", "$$". Triggers on: "WebdriverIO", "WDIO", "wdio", "browser.$".4license: MIT5---6
7# WebdriverIO Automation Skill
8
9## Step 1 — Execution Target
10
11Default local. If mentions "cloud", "TestMu", "LambdaTest" → cloud via WDIO LambdaTest service.
12
13## Step 2 — Framework
14
15| Signal | Runner |
16|--------|--------|
17| Default | Mocha |
18| "Jasmine" | Jasmine |
19| "Cucumber", "BDD" | Cucumber |
20
21## Core Patterns
22
23### Selectors
24
25```javascript
26// ✅ Preferred
27await $('[data-testid="submit"]').click();
28await $('aria/Submit').click();
29await $('button=Submit').click(); // text-based
30
31// Chaining
32await $('form').$('input[name="email"]').setValue('test@test.com');
33
34// Multiple elements
35const items = await $$('.list-item');
36```
37
38### Basic Test (Mocha)
39
40```javascript
41describe('Login', () => {
42 it('should login successfully', async () => {
43 await browser.url('/login');
44 await $('[data-testid="email"]').setValue('user@test.com');
45 await $('[data-testid="password"]').setValue('password123');
46 await $('[data-testid="submit"]').click();
47 await expect(browser).toHaveUrl(expect.stringContaining('/dashboard'));
48 });
49});
50```
51
52### Page Object
53
54```javascript
55class LoginPage {
56 get inputEmail() { return $('[data-testid="email"]'); }
57 get inputPassword() { return $('[data-testid="password"]'); }
58 get btnSubmit() { return $('[data-testid="submit"]'); }
59
60 async login(email, password) {
61 await this.inputEmail.setValue(email);
62 await this.inputPassword.setValue(password);
63 await this.btnSubmit.click();
64 }
65}
66module.exports = new LoginPage();
67```
68
69### TestMu AI Cloud Config
70
71```javascript
72// wdio.conf.js
73exports.config = {
74 user: process.env.LT_USERNAME,
75 key: process.env.LT_ACCESS_KEY,
76 hostname: 'hub.lambdatest.com',
77 port: 80,
78 path: '/wd/hub',
79 services: ['lambdatest'],
80 capabilities: [{
81 browserName: 'Chrome',
82 browserVersion: 'latest',
83 'LT:Options': {
84 platform: 'Windows 11',
85 build: 'WDIO Build',
86 name: 'WDIO Test',
87 video: true,
88 network: true,
89 }
90 }],
91};
92```
93
94### Wait Strategies
95
96```javascript
97// Wait for element
98await $('[data-testid="result"]').waitForDisplayed({ timeout: 10000 });
99
100// Wait for condition
101await browser.waitUntil(
102 async () => (await $('[data-testid="count"]').getText()) === '5',
103 { timeout: 10000, timeoutMsg: 'Count did not reach 5' }
104);
105```
106
107## Quick Reference
108
109| Task | Command |
110|------|---------|
111| Setup | `npm init wdio@latest` |
112| Run all | `npx wdio run wdio.conf.js` |
113| Run specific | `npx wdio run wdio.conf.js --spec ./test/login.js` |
114| Run suite | `npx wdio run wdio.conf.js --suite smoke` |
115| Parallel | Set `maxInstances: 5` in config |
116| Screenshot | `await browser.saveScreenshot('./screenshot.png')` |
117
118## Reference Files
119
120| File | When to Read |
121|------|-------------|
122| `reference/cloud-integration.md` | LambdaTest service, parallel, capabilities |
123| `reference/advanced-patterns.md` | Custom commands, reporters, services |
124
125## Deep Patterns → `reference/playbook.md`
126
127| § | Section | Lines |
128|---|---------|-------|
129| 1 | Production Configuration | Multi-env, multi-browser configs |
130| 2 | Page Object Model | BasePage, LoginPage, DashboardPage |
131| 3 | Custom Commands | Browser + element commands, TypeScript |
132| 4 | Network Mocking | DevTools mock, abort, error simulation |
133| 5 | File Operations | Upload, download, drag & drop |
134| 6 | Multi-Tab, iFrame & Shadow DOM | Window handles, nested shadow |
135| 7 | Visual Regression | Image comparison service |
136| 8 | API Testing | Fetch-based, API+UI combined |
137| 9 | Mobile Testing | Appium service integration |
138| 10 | LambdaTest Integration | Cloud grid config |
139| 11 | CI/CD Integration | GitHub Actions, Docker Compose |
140| 12 | Debugging Quick-Reference | 11 common problems |
141| 13 | Best Practices Checklist | 14 items |