@testdriverai/mcp 7.9.149-test → 7.9.151-test
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/agent/interface.js +6 -0
- package/ai/skills/testdriver-caching/SKILL.md +13 -6
- package/ai/skills/testdriver-client/SKILL.md +5 -1
- package/ai/skills/testdriver-debugging-with-screenshots/SKILL.md +14 -4
- package/ai/skills/testdriver-find/SKILL.md +2 -0
- package/ai/skills/testdriver-generating-tests/SKILL.md +159 -8
- package/ai/skills/testdriver-machine-setup/SKILL.md +75 -8
- package/ai/skills/testdriver-making-assertions/SKILL.md +78 -2
- package/ai/skills/testdriver-performing-actions/SKILL.md +97 -2
- package/ai/skills/testdriver-quickstart/SKILL.md +47 -28
- package/ai/skills/testdriver-wait/SKILL.md +1 -1
- package/ai/skills/testdriver:generating-tests/SKILL.md +0 -11
- package/docs/changelog.mdx +1 -1
- package/docs/docs.json +14 -39
- package/docs/v7/assert.mdx +0 -1
- package/docs/v7/caching.mdx +14 -10
- package/docs/v7/client.mdx +1 -1
- package/docs/v7/copilot/auto-healing.mdx +167 -18
- package/docs/v7/copilot/running-tests.mdx +915 -54
- package/docs/v7/debugging-with-screenshots.mdx +17 -7
- package/docs/v7/generating-tests.mdx +166 -10
- package/docs/v7/making-assertions.mdx +81 -4
- package/docs/v7/performing-actions.mdx +100 -4
- package/docs/v7/quickstart.mdx +299 -21
- package/docs/v7/wait.mdx +1 -1
- package/interfaces/cli/commands/init.js +2 -0
- package/lib/init-project.js +7 -0
- package/mcp-server/dist/server.mjs +2 -0
- package/mcp-server/src/server.ts +2 -0
- package/package.json +3 -3
- package/docs/v7/ai/agent.mdx +0 -72
- package/docs/v7/ai/mcp.mdx +0 -228
- package/docs/v7/ai/skills.mdx +0 -73
- package/docs/v7/ai.mdx +0 -205
- package/docs/v7/copilot/creating-tests.mdx +0 -156
- package/docs/v7/copilot/github.mdx +0 -143
- package/docs/v7/copilot/setup.mdx +0 -143
- package/docs/v7/device-config.mdx +0 -317
- package/docs/v7/locating-elements.mdx +0 -71
- package/docs/v7/machine-setup.mdx +0 -331
- package/docs/v7/running-tests.mdx +0 -185
- package/docs/v7/waiting-for-elements.mdx +0 -90
|
@@ -1,143 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "GitHub Integration"
|
|
3
|
-
sidebarTitle: "GitHub"
|
|
4
|
-
description: "Use TestDriver from GitHub's web interface and mobile app"
|
|
5
|
-
icon: "github"
|
|
6
|
-
---
|
|
7
|
-
|
|
8
|
-
TestDriver works directly in GitHub's web interface and mobile app. The same MCP server that powers VS Code integration also works in GitHub, letting you create and manage tests from anywhere.
|
|
9
|
-
|
|
10
|
-
## How It Works
|
|
11
|
-
|
|
12
|
-
When you add a TestDriver agent file to your repository at `.github/agents/testdriver.agent.md`, GitHub Copilot can use TestDriver's MCP tools directly in:
|
|
13
|
-
|
|
14
|
-
- GitHub.com (web browser)
|
|
15
|
-
- GitHub Mobile app (iOS/Android)
|
|
16
|
-
- Pull request conversations
|
|
17
|
-
- Issue comments
|
|
18
|
-
|
|
19
|
-
## Using TestDriver in GitHub Web
|
|
20
|
-
|
|
21
|
-
<Steps>
|
|
22
|
-
<Step title="Navigate to Your Repository">
|
|
23
|
-
Open your repository on GitHub.com. Make sure you have the TestDriver agent file at `.github/agents/testdriver.agent.md`.
|
|
24
|
-
</Step>
|
|
25
|
-
|
|
26
|
-
<Step title="Start a Copilot Chat">
|
|
27
|
-
Click the **Copilot icon** in the GitHub interface to open a chat. You can find this in:
|
|
28
|
-
- The repository's Code tab
|
|
29
|
-
- Pull request pages
|
|
30
|
-
- Issue pages
|
|
31
|
-
</Step>
|
|
32
|
-
|
|
33
|
-
<Step title="Invoke the TestDriver Agent">
|
|
34
|
-
Start your message with `@testdriver`:
|
|
35
|
-
|
|
36
|
-
```
|
|
37
|
-
@testdriver Create a test that verifies the homepage loads correctly at https://myapp.com
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
The agent will spawn a sandbox environment and begin executing, just like in VS Code.
|
|
41
|
-
</Step>
|
|
42
|
-
|
|
43
|
-
<Step title="View Screenshots in Chat">
|
|
44
|
-
As the test runs, screenshots appear directly in the chat. You can see what the AI sees and provide guidance if needed.
|
|
45
|
-
</Step>
|
|
46
|
-
</Steps>
|
|
47
|
-
|
|
48
|
-
## Creating Tests from PR Comments
|
|
49
|
-
|
|
50
|
-
You can create tests directly from pull request reviews. Comment on a PR and mention Copilot:
|
|
51
|
-
|
|
52
|
-
```
|
|
53
|
-
@copilot create a TestDriver test that verifies this new feature works.
|
|
54
|
-
Test the checkout flow with a guest user.
|
|
55
|
-
```
|
|
56
|
-
|
|
57
|
-
Copilot will:
|
|
58
|
-
1. Use the TestDriver MCP server
|
|
59
|
-
2. Create a test based on your description
|
|
60
|
-
3. Commit the test file to the PR branch
|
|
61
|
-
|
|
62
|
-
This is useful for:
|
|
63
|
-
- Adding test coverage during code review
|
|
64
|
-
- Verifying bug fixes before merging
|
|
65
|
-
- Creating regression tests for new features
|
|
66
|
-
|
|
67
|
-
## Creating Tests from Issues
|
|
68
|
-
|
|
69
|
-
You can also create tests from issue comments:
|
|
70
|
-
|
|
71
|
-
```
|
|
72
|
-
@copilot Use TestDriver to create a test that reproduces this bug.
|
|
73
|
-
Navigate to /settings, change the theme, and verify it persists after refresh.
|
|
74
|
-
```
|
|
75
|
-
|
|
76
|
-
The test will be created in a new branch and linked to the issue.
|
|
77
|
-
|
|
78
|
-
## Mobile App Support
|
|
79
|
-
|
|
80
|
-
The GitHub Mobile app supports Copilot chat, which means you can use TestDriver from your phone:
|
|
81
|
-
|
|
82
|
-
1. Open the GitHub app
|
|
83
|
-
2. Navigate to your repository
|
|
84
|
-
3. Tap the Copilot icon
|
|
85
|
-
4. Type `@testdriver` followed by your request
|
|
86
|
-
|
|
87
|
-
Screenshots and test progress appear in the chat, letting you create and debug tests on the go.
|
|
88
|
-
|
|
89
|
-
## Example: PR Review Workflow
|
|
90
|
-
|
|
91
|
-
Here's a complete workflow for adding tests during code review:
|
|
92
|
-
|
|
93
|
-
<Steps>
|
|
94
|
-
<Step title="Developer Opens PR">
|
|
95
|
-
A developer opens a pull request with a new feature.
|
|
96
|
-
</Step>
|
|
97
|
-
|
|
98
|
-
<Step title="Reviewer Requests Tests">
|
|
99
|
-
The reviewer comments:
|
|
100
|
-
```
|
|
101
|
-
@copilot Create a TestDriver test for this user registration flow.
|
|
102
|
-
Test both successful registration and validation errors.
|
|
103
|
-
```
|
|
104
|
-
</Step>
|
|
105
|
-
|
|
106
|
-
<Step title="Copilot Creates Tests">
|
|
107
|
-
Copilot spawns TestDriver, creates the tests, and commits them to the PR branch.
|
|
108
|
-
</Step>
|
|
109
|
-
|
|
110
|
-
<Step title="Tests Run in CI">
|
|
111
|
-
The new tests run automatically in CI, validating the feature works as expected.
|
|
112
|
-
</Step>
|
|
113
|
-
</Steps>
|
|
114
|
-
|
|
115
|
-
## Agent File Reference
|
|
116
|
-
|
|
117
|
-
The agent file at `.github/agents/testdriver.agent.md` contains the configuration for GitHub Copilot to use TestDriver. Here's the structure:
|
|
118
|
-
|
|
119
|
-
```yaml
|
|
120
|
-
---
|
|
121
|
-
name: testdriver
|
|
122
|
-
description: An expert at creating and refining automated tests using TestDriver.ai
|
|
123
|
-
mcp-servers:
|
|
124
|
-
testdriver:
|
|
125
|
-
command: npx
|
|
126
|
-
args:
|
|
127
|
-
- -p
|
|
128
|
-
- testdriverai
|
|
129
|
-
- testdriverai-mcp
|
|
130
|
-
env:
|
|
131
|
-
TD_API_KEY: ${TD_API_KEY}
|
|
132
|
-
---
|
|
133
|
-
|
|
134
|
-
# TestDriver Expert
|
|
135
|
-
|
|
136
|
-
You are an expert at writing automated tests using TestDriver...
|
|
137
|
-
```
|
|
138
|
-
|
|
139
|
-
The `TD_API_KEY` is pulled from your repository secrets when running in GitHub Actions or from your environment when using the web interface.
|
|
140
|
-
|
|
141
|
-
<Warning>
|
|
142
|
-
Make sure `TD_API_KEY` is set in your repository secrets for CI workflows. Go to **Settings → Secrets and variables → Actions** to add it.
|
|
143
|
-
</Warning>
|
|
@@ -1,143 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "GitHub Copilot Setup"
|
|
3
|
-
sidebarTitle: "IDE Setup"
|
|
4
|
-
description: "Install the TestDriver extension and configure MCP for GitHub Copilot"
|
|
5
|
-
icon: "wrench"
|
|
6
|
-
---
|
|
7
|
-
|
|
8
|
-
TestDriver integrates with GitHub Copilot through the VS Code extension and MCP server. This guide walks you through the complete setup.
|
|
9
|
-
|
|
10
|
-
## Prerequisites
|
|
11
|
-
|
|
12
|
-
Before you begin, you'll need:
|
|
13
|
-
|
|
14
|
-
- **GitHub Copilot** — A subscription with MCP access. A [free tier](https://github.com/features/copilot/plans) is available.
|
|
15
|
-
- **TestDriver Account** — Create a free account at [console.testdriver.ai](https://console.testdriver.ai/team) to get your API key. 60 free device minutes, no credit card required.
|
|
16
|
-
- **VS Code** — The TestDriver extension provides the best experience with live preview and integrated test running.
|
|
17
|
-
|
|
18
|
-
## Setup Steps
|
|
19
|
-
|
|
20
|
-
<Steps>
|
|
21
|
-
<Step title="Install the TestDriver Extension">
|
|
22
|
-
<Card
|
|
23
|
-
horizontal
|
|
24
|
-
title="Install TestDriver for VS Code"
|
|
25
|
-
arrow
|
|
26
|
-
href="vscode:extension/testdriver.testdriver"
|
|
27
|
-
icon="/images/content/extension/vscode.svg"
|
|
28
|
-
></Card>
|
|
29
|
-
|
|
30
|
-
The extension provides:
|
|
31
|
-
- One-click sign-in and project initialization
|
|
32
|
-
- Live preview panel for watching tests execute
|
|
33
|
-
- MCP server configuration
|
|
34
|
-
</Step>
|
|
35
|
-
|
|
36
|
-
<Step title="Sign Into TestDriver">
|
|
37
|
-
Sign in to connect your account and API key.
|
|
38
|
-
|
|
39
|
-
1. Open the command palette (`Cmd+Shift+P` or `Ctrl+Shift+P`)
|
|
40
|
-
2. Run **TestDriver: Login**
|
|
41
|
-
3. Your browser will open to the TestDriver sign-in page
|
|
42
|
-
4. Sign in (or create an account)
|
|
43
|
-
5. You'll be redirected back to VS Code, now signed in
|
|
44
|
-
|
|
45
|
-
<Tip>
|
|
46
|
-
The extension automatically saves your API key to VS Code's secure storage and your workspace `.env` file.
|
|
47
|
-
</Tip>
|
|
48
|
-
</Step>
|
|
49
|
-
|
|
50
|
-
<Step title="Initialize Your Project">
|
|
51
|
-
Set up TestDriver in your project with a single command.
|
|
52
|
-
|
|
53
|
-
1. Open the command palette (`Cmd+Shift+P` or `Ctrl+Shift+P`)
|
|
54
|
-
2. Run **TestDriver: Init Project**
|
|
55
|
-
|
|
56
|
-
This command:
|
|
57
|
-
- Creates a `package.json` with TestDriver and Vitest dependencies
|
|
58
|
-
- Generates a `vitest.config.mjs` with proper timeout settings
|
|
59
|
-
- Creates example test files in `tests/`
|
|
60
|
-
- Sets up `.env` with your API key
|
|
61
|
-
- Creates the TestDriver agent file at `.github/agents/testdriver.agent.md`
|
|
62
|
-
- Configures the MCP server
|
|
63
|
-
|
|
64
|
-
<Note>
|
|
65
|
-
If you already have a `package.json`, the command will add the necessary dependencies to it.
|
|
66
|
-
</Note>
|
|
67
|
-
</Step>
|
|
68
|
-
|
|
69
|
-
<Step title="Start the MCP Server">
|
|
70
|
-
The MCP server enables GitHub Copilot to control TestDriver sandboxes.
|
|
71
|
-
|
|
72
|
-
After initialization, the MCP configuration is created at `.vscode/mcp.json`:
|
|
73
|
-
|
|
74
|
-
```json .vscode/mcp.json
|
|
75
|
-
{
|
|
76
|
-
"servers": {
|
|
77
|
-
"testdriver": {
|
|
78
|
-
"command": "npx",
|
|
79
|
-
"args": ["-p", "testdriverai", "testdriverai-mcp"],
|
|
80
|
-
"env": {
|
|
81
|
-
"TD_PREVIEW": "ide",
|
|
82
|
-
"TD_API_KEY": "your-api-key"
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
```
|
|
88
|
-
|
|
89
|
-
**To start the MCP server:**
|
|
90
|
-
|
|
91
|
-
1. Open the command palette (`Cmd+Shift+P` or `Ctrl+Shift+P`)
|
|
92
|
-
2. Run **MCP: List Servers**
|
|
93
|
-
3. Click on the **testdriver** server
|
|
94
|
-
4. Select **Start Server**
|
|
95
|
-
|
|
96
|
-
You can also click the MCP icon in the status bar to manage servers.
|
|
97
|
-
|
|
98
|
-
<Tip>
|
|
99
|
-
See the [VS Code MCP documentation](https://code.visualstudio.com/docs/copilot/chat/mcp-servers) for more details on managing MCP servers.
|
|
100
|
-
</Tip>
|
|
101
|
-
|
|
102
|
-
<Warning>
|
|
103
|
-
Make sure your API key is set. The extension uses the key from your sign-in, but you can also set it via the `TD_API_KEY` environment variable.
|
|
104
|
-
</Warning>
|
|
105
|
-
</Step>
|
|
106
|
-
|
|
107
|
-
<Step title="Install Vitest Extension (Recommended)">
|
|
108
|
-
For the best experience running tests, install the Vitest extension:
|
|
109
|
-
|
|
110
|
-
<Card
|
|
111
|
-
horizontal
|
|
112
|
-
title="Vitest Extension"
|
|
113
|
-
arrow
|
|
114
|
-
href="vscode:extension/vitest.explorer"
|
|
115
|
-
icon="flask-vial"
|
|
116
|
-
>
|
|
117
|
-
Run tests with GUI mode from the Test Explorer
|
|
118
|
-
</Card>
|
|
119
|
-
|
|
120
|
-
After installation, you'll see a beaker icon in the sidebar for accessing the Test Explorer.
|
|
121
|
-
</Step>
|
|
122
|
-
</Steps>
|
|
123
|
-
|
|
124
|
-
## Verify Your Setup
|
|
125
|
-
|
|
126
|
-
To verify everything is configured correctly:
|
|
127
|
-
|
|
128
|
-
1. Open the command palette and run **TestDriver: Check Status**
|
|
129
|
-
2. You should see:
|
|
130
|
-
- ✅ Signed in
|
|
131
|
-
- ✅ MCP server configured
|
|
132
|
-
- ✅ Project initialized
|
|
133
|
-
|
|
134
|
-
## The Agent File
|
|
135
|
-
|
|
136
|
-
During initialization, TestDriver creates an agent file at `.github/agents/testdriver.agent.md`. This file tells GitHub Copilot how to use TestDriver's MCP tools.
|
|
137
|
-
|
|
138
|
-
The agent has access to tools like:
|
|
139
|
-
- `session_start` — Launch a sandbox with Chrome or other apps
|
|
140
|
-
- `find` / `click` / `type` — Interact with elements on screen
|
|
141
|
-
- `assert` — Verify conditions using AI vision
|
|
142
|
-
- `screenshot` — Capture the current screen state
|
|
143
|
-
|
|
@@ -1,317 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "Configuring the Device"
|
|
3
|
-
description: "Launch browsers, desktop apps, and extensions in your TestDriver sandbox"
|
|
4
|
-
icon: "wrench"
|
|
5
|
-
---
|
|
6
|
-
|
|
7
|
-
Provision methods are the starting point for most tests. They launch applications in your sandbox and prepare the environment for testing.
|
|
8
|
-
|
|
9
|
-
## Chrome Browser
|
|
10
|
-
|
|
11
|
-
The most common starting point for web testing. Launches Chrome browser and navigates to a URL.
|
|
12
|
-
|
|
13
|
-
```javascript
|
|
14
|
-
await testdriver.provision.chrome({
|
|
15
|
-
url: 'https://example.com',
|
|
16
|
-
});
|
|
17
|
-
```
|
|
18
|
-
|
|
19
|
-
### Options
|
|
20
|
-
|
|
21
|
-
| Option | Type | Default | Description |
|
|
22
|
-
|--------|------|---------|-------------|
|
|
23
|
-
| `url` | string | `'http://testdriver-sandbox.vercel.app/'` | URL to navigate to |
|
|
24
|
-
| `maximized` | boolean | `true` | Start browser maximized |
|
|
25
|
-
| `guest` | boolean | `false` | Use guest mode (no profile) |
|
|
26
|
-
|
|
27
|
-
### Example: Basic Web Test
|
|
28
|
-
|
|
29
|
-
```javascript
|
|
30
|
-
import { describe, expect, it } from "vitest";
|
|
31
|
-
import { TestDriver } from "testdriverai/vitest/hooks";
|
|
32
|
-
|
|
33
|
-
describe("Login Flow", () => {
|
|
34
|
-
it("should log in successfully", async (context) => {
|
|
35
|
-
const testdriver = TestDriver(context);
|
|
36
|
-
|
|
37
|
-
await testdriver.provision.chrome({
|
|
38
|
-
url: 'https://myapp.com/login',
|
|
39
|
-
});
|
|
40
|
-
|
|
41
|
-
await testdriver.find("Email input").click();
|
|
42
|
-
await testdriver.type("user@example.com");
|
|
43
|
-
|
|
44
|
-
await testdriver.find("Password input").click();
|
|
45
|
-
await testdriver.type("password123");
|
|
46
|
-
|
|
47
|
-
await testdriver.find("Sign In button").click();
|
|
48
|
-
|
|
49
|
-
const result = await testdriver.assert("the dashboard is visible");
|
|
50
|
-
expect(result).toBeTruthy();
|
|
51
|
-
});
|
|
52
|
-
});
|
|
53
|
-
```
|
|
54
|
-
|
|
55
|
-
<Info>
|
|
56
|
-
`provision.chrome()` automatically starts Dashcam recording and waits for Chrome to be ready before returning.
|
|
57
|
-
</Info>
|
|
58
|
-
|
|
59
|
-
---
|
|
60
|
-
|
|
61
|
-
## Chrome Extensions
|
|
62
|
-
|
|
63
|
-
Launch Chrome with a custom extension loaded. Supports both local extensions and Chrome Web Store extensions.
|
|
64
|
-
|
|
65
|
-
### Load from Local Path
|
|
66
|
-
|
|
67
|
-
Clone or create an extension locally, then load it:
|
|
68
|
-
|
|
69
|
-
```javascript
|
|
70
|
-
// First, get the extension onto the sandbox
|
|
71
|
-
await testdriver.exec(
|
|
72
|
-
'sh',
|
|
73
|
-
'git clone https://github.com/user/my-extension.git /tmp/my-extension',
|
|
74
|
-
60000
|
|
75
|
-
);
|
|
76
|
-
|
|
77
|
-
// Launch Chrome with the extension
|
|
78
|
-
await testdriver.provision.chromeExtension({
|
|
79
|
-
extensionPath: '/tmp/my-extension',
|
|
80
|
-
url: 'https://example.com'
|
|
81
|
-
});
|
|
82
|
-
```
|
|
83
|
-
|
|
84
|
-
### Load from Chrome Web Store
|
|
85
|
-
|
|
86
|
-
Load any published extension by its Chrome Web Store ID:
|
|
87
|
-
|
|
88
|
-
```javascript
|
|
89
|
-
await testdriver.provision.chromeExtension({
|
|
90
|
-
extensionId: 'cjpalhdlnbpafiamejdnhcphjbkeiagm', // uBlock Origin
|
|
91
|
-
url: 'https://example.com'
|
|
92
|
-
});
|
|
93
|
-
```
|
|
94
|
-
|
|
95
|
-
<Tip>
|
|
96
|
-
Find the extension ID in the Chrome Web Store URL. For example, `https://chrome.google.com/webstore/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm` → ID is `cjpalhdlnbpafiamejdnhcphjbkeiagm`
|
|
97
|
-
</Tip>
|
|
98
|
-
|
|
99
|
-
### Options
|
|
100
|
-
|
|
101
|
-
| Option | Type | Default | Description |
|
|
102
|
-
|--------|------|---------|-------------|
|
|
103
|
-
| `extensionPath` | string | - | Local path to unpacked extension directory |
|
|
104
|
-
| `extensionId` | string | - | Chrome Web Store extension ID |
|
|
105
|
-
| `url` | string | - | URL to navigate to after launch |
|
|
106
|
-
| `maximized` | boolean | `true` | Start browser maximized |
|
|
107
|
-
|
|
108
|
-
<Warning>
|
|
109
|
-
You must provide either `extensionPath` or `extensionId`, but not both.
|
|
110
|
-
</Warning>
|
|
111
|
-
|
|
112
|
-
### Example: Testing a Chrome Extension
|
|
113
|
-
|
|
114
|
-
```javascript
|
|
115
|
-
import { describe, expect, it } from "vitest";
|
|
116
|
-
import { TestDriver } from "testdriverai/vitest/hooks";
|
|
117
|
-
|
|
118
|
-
describe("Chrome Extension Test", () => {
|
|
119
|
-
it("should load and interact with extension", async (context) => {
|
|
120
|
-
const testdriver = TestDriver(context);
|
|
121
|
-
|
|
122
|
-
// Clone extension from GitHub
|
|
123
|
-
await testdriver.exec(
|
|
124
|
-
'sh',
|
|
125
|
-
'git clone https://github.com/user/my-extension.git /tmp/my-extension',
|
|
126
|
-
60000,
|
|
127
|
-
true
|
|
128
|
-
);
|
|
129
|
-
|
|
130
|
-
// Launch Chrome with extension loaded
|
|
131
|
-
await testdriver.provision.chromeExtension({
|
|
132
|
-
extensionPath: '/tmp/my-extension',
|
|
133
|
-
url: 'https://testdriver.ai'
|
|
134
|
-
});
|
|
135
|
-
|
|
136
|
-
// Click extensions puzzle icon
|
|
137
|
-
const extensionsButton = await testdriver.find("puzzle-shaped icon in Chrome toolbar");
|
|
138
|
-
await extensionsButton.click();
|
|
139
|
-
|
|
140
|
-
// Interact with your extension
|
|
141
|
-
const myExtension = await testdriver.find("My Extension in the dropdown");
|
|
142
|
-
await myExtension.click();
|
|
143
|
-
|
|
144
|
-
const result = await testdriver.assert("extension popup is visible");
|
|
145
|
-
expect(result).toBeTruthy();
|
|
146
|
-
});
|
|
147
|
-
});
|
|
148
|
-
```
|
|
149
|
-
|
|
150
|
-
---
|
|
151
|
-
|
|
152
|
-
## Desktop Apps
|
|
153
|
-
|
|
154
|
-
Download and install desktop applications. Supports `.deb`, `.rpm`, `.msi`, `.exe`, `.AppImage`, `.dmg`, `.pkg`, and shell scripts.
|
|
155
|
-
|
|
156
|
-
```javascript
|
|
157
|
-
const filePath = await testdriver.provision.installer({
|
|
158
|
-
url: 'https://example.com/app.deb',
|
|
159
|
-
appName: 'MyApp', // Focus this app after install
|
|
160
|
-
launch: true, // Auto-launch after install
|
|
161
|
-
});
|
|
162
|
-
```
|
|
163
|
-
|
|
164
|
-
### Options
|
|
165
|
-
|
|
166
|
-
| Option | Type | Default | Description |
|
|
167
|
-
|--------|------|---------|-------------|
|
|
168
|
-
| `url` | string | **required** | URL to download the installer from |
|
|
169
|
-
| `filename` | string | auto-detected | Filename to save as |
|
|
170
|
-
| `appName` | string | - | Application name to focus after install |
|
|
171
|
-
| `launch` | boolean | `true` | Launch the app after installation |
|
|
172
|
-
|
|
173
|
-
### Supported File Types
|
|
174
|
-
|
|
175
|
-
| Extension | OS | Install Method |
|
|
176
|
-
|-----------|-----|----------------|
|
|
177
|
-
| `.deb` | Linux | `dpkg -i` + `apt-get install -f` |
|
|
178
|
-
| `.rpm` | Linux | `rpm -i` |
|
|
179
|
-
| `.AppImage` | Linux | `chmod +x` |
|
|
180
|
-
| `.sh` | Linux | `chmod +x` + execute |
|
|
181
|
-
| `.msi` | Windows | `msiexec /i /quiet` |
|
|
182
|
-
| `.exe` | Windows | Silent install (`/S`) |
|
|
183
|
-
| `.dmg` | macOS | Mount + copy to Applications |
|
|
184
|
-
| `.pkg` | macOS | `installer -pkg` |
|
|
185
|
-
|
|
186
|
-
### Example: Install and Test a Desktop App
|
|
187
|
-
|
|
188
|
-
```javascript
|
|
189
|
-
import { describe, expect, it } from "vitest";
|
|
190
|
-
import { TestDriver } from "testdriverai/vitest/hooks";
|
|
191
|
-
|
|
192
|
-
describe("Desktop App Test", () => {
|
|
193
|
-
it("should install and launch app", async (context) => {
|
|
194
|
-
const testdriver = TestDriver(context);
|
|
195
|
-
|
|
196
|
-
// Download and install
|
|
197
|
-
const installerPath = await testdriver.provision.installer({
|
|
198
|
-
url: 'https://github.com/sharkdp/bat/releases/download/v0.24.0/bat_0.24.0_amd64.deb',
|
|
199
|
-
});
|
|
200
|
-
|
|
201
|
-
// Verify installation
|
|
202
|
-
const output = await testdriver.exec('sh', 'bat --version', 5000);
|
|
203
|
-
expect(output).toContain('bat');
|
|
204
|
-
});
|
|
205
|
-
});
|
|
206
|
-
```
|
|
207
|
-
|
|
208
|
-
### Example: Windows Installer
|
|
209
|
-
|
|
210
|
-
```javascript
|
|
211
|
-
import { describe, expect, it } from "vitest";
|
|
212
|
-
import { TestDriver } from "testdriverai/vitest/hooks";
|
|
213
|
-
|
|
214
|
-
describe("Windows App Test", () => {
|
|
215
|
-
it("should install on Windows", async (context) => {
|
|
216
|
-
const testdriver = TestDriver(context, {
|
|
217
|
-
os: 'windows'
|
|
218
|
-
});
|
|
219
|
-
|
|
220
|
-
// Download MSI installer
|
|
221
|
-
const installerPath = await testdriver.provision.installer({
|
|
222
|
-
url: 'https://example.com/app.msi',
|
|
223
|
-
launch: false, // Don't auto-launch
|
|
224
|
-
});
|
|
225
|
-
|
|
226
|
-
// Custom installation if needed
|
|
227
|
-
await testdriver.exec(
|
|
228
|
-
'pwsh',
|
|
229
|
-
`Start-Process msiexec.exe -ArgumentList "/i", "${installerPath}", "/qn" -Wait`,
|
|
230
|
-
120000
|
|
231
|
-
);
|
|
232
|
-
|
|
233
|
-
// Verify installation
|
|
234
|
-
const result = await testdriver.assert("application is installed");
|
|
235
|
-
expect(result).toBeTruthy();
|
|
236
|
-
});
|
|
237
|
-
});
|
|
238
|
-
```
|
|
239
|
-
|
|
240
|
-
### Manual Installation
|
|
241
|
-
|
|
242
|
-
Set `launch: false` to download without auto-installing:
|
|
243
|
-
|
|
244
|
-
```javascript
|
|
245
|
-
const filePath = await testdriver.provision.installer({
|
|
246
|
-
url: 'https://example.com/custom-script.sh',
|
|
247
|
-
launch: false,
|
|
248
|
-
});
|
|
249
|
-
|
|
250
|
-
// Run custom install commands
|
|
251
|
-
await testdriver.exec('sh', `chmod +x "${filePath}"`, 5000);
|
|
252
|
-
await testdriver.exec('sh', `"${filePath}" --custom-flag`, 60000);
|
|
253
|
-
```
|
|
254
|
-
|
|
255
|
-
---
|
|
256
|
-
|
|
257
|
-
## VS Code
|
|
258
|
-
|
|
259
|
-
Launch Visual Studio Code with optional workspace and extensions.
|
|
260
|
-
|
|
261
|
-
```javascript
|
|
262
|
-
await testdriver.provision.vscode({
|
|
263
|
-
workspace: '/home/testdriver/my-project',
|
|
264
|
-
extensions: ['ms-python.python', 'esbenp.prettier-vscode'],
|
|
265
|
-
});
|
|
266
|
-
```
|
|
267
|
-
|
|
268
|
-
### Options
|
|
269
|
-
|
|
270
|
-
| Option | Type | Default | Description |
|
|
271
|
-
|--------|------|---------|-------------|
|
|
272
|
-
| `workspace` | string | - | Workspace folder to open |
|
|
273
|
-
| `extensions` | string[] | `[]` | Extensions to install (by ID) |
|
|
274
|
-
|
|
275
|
-
### Example: VS Code Extension Test
|
|
276
|
-
|
|
277
|
-
```javascript
|
|
278
|
-
import { describe, expect, it } from "vitest";
|
|
279
|
-
import { TestDriver } from "testdriverai/vitest/hooks";
|
|
280
|
-
|
|
281
|
-
describe("VS Code Test", () => {
|
|
282
|
-
it("should open workspace with extensions", async (context) => {
|
|
283
|
-
const testdriver = TestDriver(context);
|
|
284
|
-
|
|
285
|
-
// Create a test project
|
|
286
|
-
await testdriver.exec('sh', 'mkdir -p /tmp/test-project && echo "print(1)" > /tmp/test-project/test.py', 10000);
|
|
287
|
-
|
|
288
|
-
// Launch VS Code
|
|
289
|
-
await testdriver.provision.vscode({
|
|
290
|
-
workspace: '/tmp/test-project',
|
|
291
|
-
extensions: ['ms-python.python'],
|
|
292
|
-
});
|
|
293
|
-
|
|
294
|
-
// Verify VS Code is ready
|
|
295
|
-
const result = await testdriver.assert("VS Code is open with the project");
|
|
296
|
-
expect(result).toBeTruthy();
|
|
297
|
-
|
|
298
|
-
// Open the Python file
|
|
299
|
-
await testdriver.find("test.py in the explorer").click();
|
|
300
|
-
});
|
|
301
|
-
});
|
|
302
|
-
```
|
|
303
|
-
|
|
304
|
-
---
|
|
305
|
-
|
|
306
|
-
## Choosing the Right Provision Method
|
|
307
|
-
|
|
308
|
-
| Use Case | Method |
|
|
309
|
-
|----------|--------|
|
|
310
|
-
| Testing a website | `provision.chrome` |
|
|
311
|
-
| Testing a Chrome extension | `provision.chromeExtension` |
|
|
312
|
-
| Testing a desktop app (needs installation) | `provision.installer` |
|
|
313
|
-
| Testing VS Code or VS Code extensions | `provision.vscode` |
|
|
314
|
-
|
|
315
|
-
<Tip>
|
|
316
|
-
All provision methods automatically start Dashcam recording and wait for the application to be ready before returning. You don't need to call `dashcam.start()` manually.
|
|
317
|
-
</Tip>
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: "Locating Elements"
|
|
3
|
-
description: "Find UI elements using natural language descriptions"
|
|
4
|
-
icon: "crosshairs"
|
|
5
|
-
---
|
|
6
|
-
|
|
7
|
-
## Locating Single Elements
|
|
8
|
-
|
|
9
|
-
Use natural language to describe elements. Descriptions should be specific enough to locate the element, but not too-specific that they break with minor UI changes. For example:
|
|
10
|
-
|
|
11
|
-
```javascript
|
|
12
|
-
await testdriver.find('email input field');
|
|
13
|
-
await testdriver.find('first product card in the grid');
|
|
14
|
-
await testdriver.find('dropdown menu labeled "Country"');
|
|
15
|
-
```
|
|
16
|
-
|
|
17
|
-
<Info>TestDriver will cache found elements for improved performance on subsequent calls. Learn more about [element caching here](/v7/caching).</Info>
|
|
18
|
-
|
|
19
|
-
## Debugging Found Elements
|
|
20
|
-
|
|
21
|
-
After finding an element, you can inspect its properties for debugging:
|
|
22
|
-
|
|
23
|
-
```javascript
|
|
24
|
-
const button = await testdriver.find('submit button');
|
|
25
|
-
console.log(button);
|
|
26
|
-
```
|
|
27
|
-
|
|
28
|
-
This outputs all element properties:
|
|
29
|
-
|
|
30
|
-
```javascript
|
|
31
|
-
{
|
|
32
|
-
description: 'submit button',
|
|
33
|
-
found: true,
|
|
34
|
-
x: 150,
|
|
35
|
-
y: 300,
|
|
36
|
-
coordinates: { x: 150, y: 300, centerX: 200, centerY: 320 },
|
|
37
|
-
threshold: 0.8,
|
|
38
|
-
confidence: 0.95,
|
|
39
|
-
similarity: 0.92,
|
|
40
|
-
selector: 'button[type="submit"]',
|
|
41
|
-
cache: {
|
|
42
|
-
hit: true,
|
|
43
|
-
strategy: 'pixel-diff',
|
|
44
|
-
createdAt: '2025-01-15T10:30:00Z',
|
|
45
|
-
diffPercent: 0.02,
|
|
46
|
-
imageUrl: 'https://...'
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
```
|
|
50
|
-
|
|
51
|
-
## Working with Multiple Elements
|
|
52
|
-
|
|
53
|
-
Find and interact with multiple elements:
|
|
54
|
-
|
|
55
|
-
```javascript
|
|
56
|
-
// Find all matching elements
|
|
57
|
-
const products = await testdriver.findAll('product card');
|
|
58
|
-
console.log(`Found ${products.length} products`);
|
|
59
|
-
|
|
60
|
-
// Interact with each
|
|
61
|
-
for (const product of products) {
|
|
62
|
-
const title = await product.find('title text');
|
|
63
|
-
console.log('Product:', title.text);
|
|
64
|
-
|
|
65
|
-
await product.find('add to cart button').click();
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
// Or find specific element
|
|
69
|
-
const firstProduct = products[0];
|
|
70
|
-
await firstProduct.click();
|
|
71
|
-
```
|