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