testdriverai 7.8.0-test.0 → 7.8.0-test.10

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.
Files changed (41) hide show
  1. package/agent/index.js +6 -5
  2. package/agent/lib/commands.js +3 -2
  3. package/agent/lib/http.js +144 -0
  4. package/agent/lib/sandbox.js +117 -102
  5. package/agent/lib/sdk.js +4 -2
  6. package/agent/lib/system.js +25 -65
  7. package/ai/skills/testdriver-mcp/SKILL.md +7 -0
  8. package/ai/skills/testdriver-running-tests/SKILL.md +1 -1
  9. package/docs/changelog.mdx +109 -12
  10. package/docs/docs.json +44 -31
  11. package/docs/v7/copilot/auto-healing.mdx +265 -0
  12. package/docs/v7/copilot/creating-tests.mdx +156 -0
  13. package/docs/v7/copilot/github.mdx +143 -0
  14. package/docs/v7/copilot/running-tests.mdx +149 -0
  15. package/docs/v7/copilot/setup.mdx +143 -0
  16. package/docs/v7/enterprise.mdx +3 -110
  17. package/docs/v7/{cloud.mdx → hosted.mdx} +43 -5
  18. package/docs/v7/mcp.mdx +9 -0
  19. package/docs/v7/quickstart.mdx +30 -2
  20. package/docs/v7/running-tests.mdx +1 -1
  21. package/docs/v7/self-hosted.mdx +127 -44
  22. package/interfaces/logger.js +0 -12
  23. package/interfaces/vitest-plugin.mjs +3 -0
  24. package/lib/core/Dashcam.js +11 -7
  25. package/lib/environments.json +18 -0
  26. package/lib/resolve-channel.js +4 -3
  27. package/{examples → manual}/drag-and-drop.test.mjs +1 -1
  28. package/package.json +1 -1
  29. package/sdk.js +3 -3
  30. package/vitest.config.mjs +20 -32
  31. /package/{examples → manual}/flake-diffthreshold-001.test.mjs +0 -0
  32. /package/{examples → manual}/flake-diffthreshold-01.test.mjs +0 -0
  33. /package/{examples → manual}/flake-diffthreshold-05.test.mjs +0 -0
  34. /package/{examples → manual}/flake-noredraw-cache.test.mjs +0 -0
  35. /package/{examples → manual}/flake-noredraw-nocache.test.mjs +0 -0
  36. /package/{examples → manual}/flake-redraw-cache.test.mjs +0 -0
  37. /package/{examples → manual}/flake-redraw-nocache.test.mjs +0 -0
  38. /package/{examples → manual}/flake-rocket-match.test.mjs +0 -0
  39. /package/{examples → manual}/flake-shared.mjs +0 -0
  40. /package/{examples → manual}/no-provision.test.mjs +0 -0
  41. /package/{examples → manual}/scroll-until-text.test.mjs +0 -0
@@ -5,7 +5,64 @@ rss: true
5
5
  icon: "code-compare"
6
6
  ---
7
7
 
8
- <Update label="v7.8.0-canary.4" description="March 2026" tags={["canary"]}>
8
+ <Update label="v7.8.0-test.9" description="March 2026" tags={["test"]}>
9
+
10
+ 🔧 Improvements
11
+
12
+ - **Stable release promotion** — Fixed an issue where promoting a test or canary release to stable could be incorrectly skipped. Stable releases now proceed reliably regardless of the prior pre-release channel.
13
+ - **Example docs sync** — Example documentation now updates more reliably, continuing even when individual example tests fail so that passing examples still get refreshed.
14
+
15
+ </Update>
16
+
17
+ <Update label="v7.8.0-test.8" description="March 2026" tags={["test"]}>
18
+
19
+ 🔧 Improvements
20
+
21
+ - **VS Code environment switching** — The TestDriver VS Code extension now includes a status bar indicator and a new **TestDriver: Switch Environment** command. You can switch between stable, canary, and test environments directly from VS Code, and your MCP server configuration updates automatically.
22
+ - **Plan rename: Starter → Pro** — The "Starter" plan has been renamed to **Pro**. No changes to pricing or features — just a clearer name. The "Self-Hosted" tier is now labeled **Enterprise**.
23
+ - **SDK network resilience** — API requests now automatically retry on transient server errors (500, 502, 503, 504) with exponential backoff, reducing flaky test failures caused by brief infrastructure hiccups.
24
+ - **Pricing page refresh** — The [hosted plans page](/v7/hosted) now shows plan cards with included minutes, concurrency limits, and pricing at a glance.
25
+
26
+ 📚 Docs updates
27
+
28
+ - **Quickstart redesign** — The [quickstart](/v7/quickstart) now has tabbed setup paths for CLI, GitHub Copilot, and manual installation.
29
+ - **Deployment section** — "Cloud" is now [Hosted](/v7/hosted) and the previous Enterprise page has been consolidated into [Self-Hosted](/v7/self-hosted), which covers both standard and air-gapped deployments.
30
+
31
+ </Update>
32
+
33
+ <Update label="v7.8.0-test.7" description="March 2026" tags={["test"]}>
34
+ This release includes all changes from v7.8.0-test.6 with version bumps across all packages. No additional user-facing changes.
35
+ </Update>
36
+
37
+ <Update label="v7.8.0-test.6" description="March 2026" tags={["test"]}>
38
+
39
+ 🔧 Improvements
40
+
41
+ - **Sandbox spawning reliability** — Sandbox creation now uses a 3-minute timeout to handle slow infrastructure, then immediately switches to a 60-second orphan timeout for fast cleanup. This reduces sandbox creation failures during high-traffic periods.
42
+ - **Command deadline timeouts** — Sandbox commands now enforce a hard deadline that terminates execution if the connection drops mid-command, preventing tests from hanging indefinitely.
43
+ - **Real-time channel cleanup** — Fixed a compatibility issue with the real-time messaging layer that could cause channel cleanup to fail during shutdown.
44
+ - **Dashboard timestamp tooltips** — Extended UTC date tooltips to the test history sidebar. Hovering over any relative timestamp (e.g., "5 minutes ago") across the [dashboard](https://console.testdriver.ai) now shows the full UTC date and time.
45
+
46
+ </Update>
47
+
48
+ <Update label="v7.8.0-test.4" description="March 2026" tags={["test"]}>
49
+
50
+ ✨ New features
51
+
52
+ - **[GitHub Copilot integration](/v7/copilot/setup)** — Use TestDriver directly from GitHub Copilot in VS Code. The new MCP server lets Copilot launch sandboxes, interact with elements, and run assertions through natural language. Includes guides for [creating tests](/v7/copilot/creating-tests), [running tests](/v7/copilot/running-tests), [GitHub Actions integration](/v7/copilot/github), and [auto-healing](/v7/copilot/auto-healing).
53
+
54
+ 🔧 Improvements
55
+
56
+ - **Sandbox reliability** — Linux sandboxes now use a longer creation timeout to handle slow infrastructure, then immediately switch to a short orphan timeout for fast cleanup of disconnected sessions.
57
+ - **Command execution timeouts** — Sandbox commands now have deadline timeouts that prevent hangs if the connection drops mid-execution.
58
+ - **Real-time connection stability** — Updated the real-time messaging layer for better compatibility and more reliable channel cleanup during shutdown.
59
+ - **Dashboard date display** — Hovering over relative timestamps (e.g., "5 minutes ago") now shows the full UTC date and time.
60
+
61
+ </Update>
62
+
63
+ <Update label="v7.8.0-canary.5" description="March 2026" tags={["canary"]}>
64
+ This release includes all changes from v7.8.0-canary.4 with version bumps.
65
+
9
66
  ✨ New features
10
67
 
11
68
  - **[Cache API](/v7/cache)** — Speed up repeated test runs with screenshot-based caching. The system compares screenshots to cached results and reuses element positions when the screen hasn't changed, reducing AI calls.
@@ -21,27 +78,67 @@ icon: "code-compare"
21
78
  - [Exec PowerShell](/v7/examples/exec-pwsh) — Generate dynamic data with PowerShell
22
79
  - [Focus window](/v7/examples/focus-window) — Switch focus between application windows
23
80
 
81
+ 🔧 Improvements
82
+
83
+ - Improved console URL mapping for canary and test environments
84
+ - Enhanced Ably channel cleanup for better resource management
85
+ - Updated release workflow with improved changelog generation
86
+ </Update>
87
+
88
+ <Update label="v7.5.26" description="March 2026" tags={["stable"]}>
89
+ 🚀 Stable release
90
+
91
+ This release promotes v7.5.25 to stable with deployment channel improvements.
92
+
93
+ ✨ Features
94
+
95
+ - **Deployment channels** — SDK now supports stable and canary release channels. Stable releases use the `latest` npm tag, while canary releases use the `canary` tag. Install canary with `npm install testdriverai@canary`.
96
+
97
+ 🔧 Improvements
98
+
99
+ - Improved cache hit debugging and logging
100
+ - Enhanced element location reliability
101
+ - Better error handling during test execution
102
+
103
+ 🐛 Bug fixes
104
+
105
+ - Fixed restart behavior during auto-updates
106
+ - Fixed console URL routing for various environments
107
+
24
108
  <Note>
25
- This release includes changes from v7.8.0-test.7 and v7.8.0-test.8.
109
+ This release includes changes from v7.5.17 through v7.5.25.
26
110
  </Note>
27
111
  </Update>
28
112
 
29
- <Update label="v7.8.0-test.8" description="March 2026" tags={["test"]}>
30
- New features
113
+ <Update label="v7.5.25" description="March 2026" tags={["stable"]}>
114
+ 🐛 Bug fixes
31
115
 
32
- - Added new AI skills for cache, errors, events, provision, redraw, and screenshots
33
- - Removed automated changelog generation from release workflow
116
+ - Fixed restart update behavior
34
117
  </Update>
35
118
 
36
- <Update label="v7.8.0-test.7" description="March 2026" tags={["test"]}>
37
- 🔧 Maintenance
119
+ <Update label="v7.5.24" description="March 2026" tags={["stable"]}>
120
+ 🔧 Improvements
38
121
 
39
- - Version bump syntax improvements
122
+ - Disabled auto-update restart to improve CI stability
40
123
  </Update>
41
124
 
42
- <Update label="v7.8.0-test.6" description="March 2026" tags={["test"]}>
43
- 🔧 Maintenance
125
+ <Update label="v7.5.22" description="March 2026" tags={["stable"]}>
126
+ 🔧 Improvements
127
+
128
+ - Added markdown-to-HTML rendering for marketing content
129
+ </Update>
130
+
131
+ <Update label="v7.5.19" description="March 2026" tags={["stable"]}>
132
+ 🔧 Improvements
133
+
134
+ - Enhanced debugging output for cache hits
135
+ - Improved element location reliability
136
+ </Update>
137
+
138
+ <Update label="v7.5.17" description="March 2026" tags={["stable"]}>
139
+ 🔧 Improvements
44
140
 
45
- - Fix changelog generation in release workflow (04a789ec)
141
+ - Improved codespace scaling and development environment setup
142
+ - Updated VS Code extension version
46
143
  </Update>
47
144
 
package/docs/docs.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "$schema": "https://mintlify.com/docs.json",
3
- "theme": "palm",
3
+ "theme": "almond",
4
4
  "name": "TestDriver",
5
5
  "colors": {
6
6
  "primary": "#b3d334",
@@ -48,20 +48,31 @@
48
48
  "/v7/examples/windows-installer"
49
49
  ]
50
50
  },
51
+
51
52
  {
52
- "group": "Plans & Pricing",
53
+ "group": "Deployment",
53
54
  "icon": "server",
54
55
  "pages": [
55
- "/v7/cloud",
56
- "/v7/self-hosted",
57
- "/v7/enterprise"
56
+ "/v7/hosted",
57
+ "/v7/self-hosted"
58
58
  ]
59
59
  },
60
60
  "/changelog"
61
61
  ]
62
62
  },
63
+
63
64
  {
64
- "group": "Creating Tests",
65
+ "group": "GitHub Copilot",
66
+ "pages": [
67
+ "/v7/copilot/setup",
68
+ "/v7/copilot/creating-tests",
69
+ "/v7/copilot/running-tests",
70
+ "/v7/copilot/github",
71
+ "/v7/copilot/auto-healing"
72
+ ]
73
+ },
74
+ {
75
+ "group": "Guide",
65
76
  "pages": [
66
77
  "/v7/generating-tests",
67
78
  "/v7/device-config",
@@ -95,35 +106,37 @@
95
106
  ]
96
107
  },
97
108
  {
98
- "group": "Actions",
99
- "pages": [
100
- "/v7/ai",
101
- "/v7/assert",
102
- "/v7/captcha",
103
- "/v7/click",
104
- "/v7/double-click",
105
- "/v7/exec",
106
- "/v7/find",
107
- "/v7/focus-application",
108
- "/v7/hover",
109
- "/v7/mouse-down",
110
- "/v7/mouse-up",
111
- "/v7/parse",
112
- "/v7/press-keys",
113
- "/v7/right-click",
114
- "/v7/screenshot",
115
- "/v7/type",
116
- "/v7/scroll"
117
- ]
118
- },
119
- {
120
- "group": "SDK",
109
+ "group": "SDK Reference",
121
110
  "pages": [
122
- "/v7/elements",
123
111
  "/v7/client",
112
+ "/v7/elements",
113
+ {
114
+ "group": "Actions",
115
+ "icon": "bolt",
116
+ "pages": [
117
+ "/v7/ai",
118
+ "/v7/assert",
119
+ "/v7/captcha",
120
+ "/v7/click",
121
+ "/v7/double-click",
122
+ "/v7/exec",
123
+ "/v7/find",
124
+ "/v7/focus-application",
125
+ "/v7/hover",
126
+ "/v7/mouse-down",
127
+ "/v7/mouse-up",
128
+ "/v7/parse",
129
+ "/v7/press-keys",
130
+ "/v7/right-click",
131
+ "/v7/screenshot",
132
+ "/v7/scroll",
133
+ "/v7/type"
134
+ ]
135
+ },
124
136
  "/v7/dashcam"
125
137
  ]
126
- } ]
138
+ }
139
+ ]
127
140
  },
128
141
  {
129
142
  "version": "v6",
@@ -0,0 +1,265 @@
1
+ ---
2
+ title: "Auto-Healing Tests"
3
+ sidebarTitle: "Auto-Healing"
4
+ description: "Set up automatic test repair in CI using GitHub Copilot and TestDriver"
5
+ icon: "bandage"
6
+ ---
7
+
8
+ Auto-healing tests automatically fix themselves when your application changes. By integrating GitHub Copilot with TestDriver in your CI pipeline, you can have AI investigate test failures and propose fixes.
9
+
10
+ ## How It Works
11
+
12
+ When a test fails in CI:
13
+
14
+ 1. **GitHub Actions detects the failure**
15
+ 2. **Copilot spawns the TestDriver agent** with access to the MCP server
16
+ 3. **The agent investigates** by running the failing test and analyzing what changed
17
+ 4. **Copilot creates a fix** by updating the test code
18
+ 5. **A pull request is opened** with the proposed changes for review
19
+
20
+ ## Setting Up Auto-Healing
21
+
22
+ <Steps>
23
+ <Step title="Add Repository Secrets">
24
+ Add your TestDriver API key to your repository secrets:
25
+
26
+ 1. Go to **Settings → Secrets and variables → Actions**
27
+ 2. Click **New repository secret**
28
+ 3. Add `TD_API_KEY` with your API key value
29
+ </Step>
30
+
31
+ <Step title="Create the Auto-Heal Workflow">
32
+ Add a GitHub Actions workflow that triggers on test failures:
33
+
34
+ ```yaml .github/workflows/auto-heal.yml
35
+ name: Auto-Heal Tests
36
+
37
+ on:
38
+ workflow_run:
39
+ workflows: ["Tests"] # Your main test workflow
40
+ types: [completed]
41
+ branches: [main]
42
+
43
+ jobs:
44
+ auto-heal:
45
+ if: ${{ github.event.workflow_run.conclusion == 'failure' }}
46
+ runs-on: ubuntu-latest
47
+ permissions:
48
+ contents: write
49
+ pull-requests: write
50
+
51
+ steps:
52
+ - uses: actions/checkout@v4
53
+
54
+ - name: Setup Node.js
55
+ uses: actions/setup-node@v4
56
+ with:
57
+ node-version: "20"
58
+
59
+ - name: Install dependencies
60
+ run: npm ci
61
+
62
+ - name: Run failing tests and capture output
63
+ id: tests
64
+ continue-on-error: true
65
+ run: |
66
+ vitest run 2>&1 | tee test-output.txt
67
+ echo "output<<EOF" >> $GITHUB_OUTPUT
68
+ cat test-output.txt >> $GITHUB_OUTPUT
69
+ echo "EOF" >> $GITHUB_OUTPUT
70
+ env:
71
+ TD_API_KEY: ${{ secrets.TD_API_KEY }}
72
+
73
+ - name: Invoke Copilot to fix tests
74
+ uses: github/copilot-action@v1
75
+ with:
76
+ prompt: |
77
+ @testdriver The following tests failed:
78
+
79
+ ${{ steps.tests.outputs.output }}
80
+
81
+ Please investigate each failure by:
82
+ 1. Running the failing test
83
+ 2. Analyzing what changed in the UI or behavior
84
+ 3. Updating the test code to fix the issue
85
+
86
+ Create a commit with your changes.
87
+ env:
88
+ TD_API_KEY: ${{ secrets.TD_API_KEY }}
89
+
90
+ - name: Create Pull Request
91
+ uses: peter-evans/create-pull-request@v5
92
+ with:
93
+ title: "Auto-heal: Fix failing tests"
94
+ body: |
95
+ This PR was automatically generated by the auto-heal workflow.
96
+
97
+ ## Changes
98
+ The following tests were updated to fix failures detected in CI.
99
+
100
+ ## Review
101
+ Please review the changes carefully before merging.
102
+ branch: auto-heal/${{ github.run_id }}
103
+ commit-message: "fix: auto-heal failing tests"
104
+ ```
105
+ </Step>
106
+
107
+ <Step title="Configure Test Workflow">
108
+ Make sure your main test workflow has a name that matches the `workflows` trigger:
109
+
110
+ ```yaml .github/workflows/tests.yml
111
+ name: Tests # Must match the workflow_run trigger
112
+
113
+ on:
114
+ push:
115
+ branches: [main]
116
+ pull_request:
117
+
118
+ jobs:
119
+ test:
120
+ runs-on: ubuntu-latest
121
+ steps:
122
+ - uses: actions/checkout@v4
123
+ - uses: actions/setup-node@v4
124
+ with:
125
+ node-version: "20"
126
+ - run: npm ci
127
+ - run: vitest run
128
+ env:
129
+ TD_API_KEY: ${{ secrets.TD_API_KEY }}
130
+ ```
131
+ </Step>
132
+ </Steps>
133
+
134
+ ## Example: Button Text Change
135
+
136
+ Here's what auto-healing looks like when a button's text changes:
137
+
138
+ <Steps>
139
+ <Step title="Application Changes">
140
+ A developer changes a button's text from "Submit" to "Send":
141
+
142
+ ```html
143
+ <!-- Before -->
144
+ <button>Submit</button>
145
+
146
+ <!-- After -->
147
+ <button>Send</button>
148
+ ```
149
+ </Step>
150
+
151
+ <Step title="Test Fails">
152
+ The test fails because it's looking for the old text:
153
+
154
+ ```javascript
155
+ // This now fails
156
+ const submitButton = await testdriver.find("Submit button");
157
+ ```
158
+ </Step>
159
+
160
+ <Step title="Auto-Heal Triggers">
161
+ The auto-heal workflow runs, and Copilot investigates:
162
+
163
+ ```
164
+ The test is looking for a "Submit button" but I see a "Send button"
165
+ on the page. The button functionality is the same, just the text changed.
166
+ I'll update the test to use the new text.
167
+ ```
168
+ </Step>
169
+
170
+ <Step title="PR Created">
171
+ A pull request is opened with the fix:
172
+
173
+ ```javascript
174
+ // Updated by auto-heal
175
+ const submitButton = await testdriver.find("Send button");
176
+ ```
177
+ </Step>
178
+ </Steps>
179
+
180
+ ## Configuration Options
181
+
182
+ ### Selective Auto-Healing
183
+
184
+ You can limit auto-healing to specific test files or patterns:
185
+
186
+ ```yaml
187
+ - name: Run failing tests
188
+ run: |
189
+ # Only heal tests in the e2e directory
190
+ vitest run tests/e2e/ 2>&1 | tee test-output.txt
191
+ ```
192
+
193
+ ### Manual Approval
194
+
195
+ For safety, you can require manual approval before auto-heal runs:
196
+
197
+ ```yaml
198
+ jobs:
199
+ auto-heal:
200
+ environment: auto-heal # Requires approval
201
+ ```
202
+
203
+ Configure the environment in **Settings → Environments** with required reviewers.
204
+
205
+ ### Limiting Changes
206
+
207
+ Add instructions to constrain what the AI can change:
208
+
209
+ ```yaml
210
+ - name: Invoke Copilot to fix tests
211
+ uses: github/copilot-action@v1
212
+ with:
213
+ prompt: |
214
+ @testdriver Fix the failing tests.
215
+
216
+ Rules:
217
+ - Only update element selectors and text matching
218
+ - Do not change test logic or assertions
219
+ - Do not add or remove tests
220
+ - Keep changes minimal
221
+ ```
222
+
223
+ ## Best Practices
224
+
225
+ <AccordionGroup>
226
+ <Accordion title="Always review auto-heal PRs">
227
+ Auto-heal is a tool, not a replacement for human judgment. Review all changes before merging to ensure the test still validates what you intended.
228
+ </Accordion>
229
+
230
+ <Accordion title="Use descriptive element descriptions">
231
+ Tests with clear, semantic descriptions are easier for the AI to heal:
232
+ ```javascript
233
+ // ✅ Good - describes purpose
234
+ await testdriver.find("primary call-to-action button in the hero section");
235
+
236
+ // ❌ Bad - too vague
237
+ await testdriver.find("button");
238
+ ```
239
+ </Accordion>
240
+
241
+ <Accordion title="Set up notifications">
242
+ Configure GitHub notifications or Slack integration to be alerted when auto-heal PRs are created.
243
+ </Accordion>
244
+
245
+ <Accordion title="Track heal rate">
246
+ Monitor how often tests need healing. High heal rates may indicate:
247
+ - Tests are too brittle
248
+ - Application is changing rapidly
249
+ - Element descriptions need improvement
250
+ </Accordion>
251
+ </AccordionGroup>
252
+
253
+ ## Limitations
254
+
255
+ Auto-healing works best for:
256
+ - Element text changes
257
+ - Layout and styling updates
258
+ - Minor UI restructuring
259
+
260
+ It may struggle with:
261
+ - Major workflow changes
262
+ - New features requiring new assertions
263
+ - Complex multi-step interactions
264
+
265
+ For significant changes, create new tests manually using the [TestDriver agent](/v7/copilot/creating-tests).
@@ -0,0 +1,156 @@
1
+ ---
2
+ title: "Creating Tests"
3
+ sidebarTitle: "Creating Tests"
4
+ description: "Use the TestDriver agent and MCP to create tests through natural language"
5
+ icon: "wand-magic-sparkles"
6
+ ---
7
+
8
+ With GitHub Copilot and TestDriver's MCP server, you can create tests by chatting with an AI agent. The agent spawns a virtual machine, executes actions, and writes test code for you.
9
+
10
+ ## Start a Conversation
11
+
12
+ Open GitHub Copilot Chat in VS Code. If your project has no other agents configured, the TestDriver agent is used by default. Otherwise, select **testdriver** from the agent dropdown in the chat panel.
13
+
14
+ Describe what you want to test:
15
+
16
+ ```
17
+ Create a test that logs into my app at https://myapp.com
18
+ ```
19
+
20
+ The agent will:
21
+ 1. Start a new session and spawn a Linux virtual machine
22
+ 2. Launch Chrome and navigate to your URL
23
+ 3. Execute actions based on your instructions
24
+ 4. Write the test code to a `.test.mjs` file
25
+
26
+ <Note>
27
+ The TestDriver agent appears in the agent selection dropdown if you have other agents configured (like `copilot-instructions.md` or other `.agent.md` files). Make sure to select **testdriver** to use TestDriver's MCP tools.
28
+ </Note>
29
+
30
+ ## Live Preview Panel
31
+
32
+ When the agent starts a session, a **live preview panel** opens in VS Code. This lets you:
33
+
34
+ - **Watch tests execute** in real-time
35
+ - **Interact with the VM** — click, type, and navigate manually
36
+ - **Debug issues** — see exactly what the AI sees
37
+
38
+ <Note>
39
+ The live preview panel requires the TestDriver VS Code extension. Set `TD_PREVIEW=ide` in your MCP configuration to enable it. See the [device configuration docs](/v7/device-config) for all preview options.
40
+ </Note>
41
+
42
+ ## Interactive Workflow
43
+
44
+ The recommended workflow for creating tests:
45
+
46
+ <Steps>
47
+ <Step title="Describe Your Test">
48
+ Tell the agent what you want to test:
49
+
50
+ ```
51
+ Test the checkout flow on https://shop.example.com
52
+ ```
53
+ </Step>
54
+
55
+ <Step title="Watch and Guide">
56
+ The agent will start executing. Watch the preview panel and provide guidance if needed:
57
+
58
+ ```
59
+ The login modal appeared. Use test@example.com and password123
60
+ ```
61
+ </Step>
62
+
63
+ <Step title="Add Assertions">
64
+ Ask the agent to verify specific conditions:
65
+
66
+ ```
67
+ Assert that the order confirmation page is shown with the order number
68
+ ```
69
+ </Step>
70
+
71
+ <Step title="Review the Code">
72
+ The agent writes test code as it works. Review the generated `.test.mjs` file and make any adjustments.
73
+ </Step>
74
+ </Steps>
75
+
76
+ ## Example Conversation
77
+
78
+ Here's a complete example of creating a login test:
79
+
80
+ ```
81
+ You: Create a test for the login flow at https://console.testdriver.ai
82
+
83
+ Agent: I'll create a test for the login flow. Starting a session...
84
+ [Screenshot: Login page loaded]
85
+
86
+ I can see the login page. Let me find the email input.
87
+ [Screenshot: Email input highlighted]
88
+
89
+ Now I'll type the email and find the password field...
90
+
91
+ You: Use test@example.com for the email
92
+
93
+ Agent: Got it. Typing test@example.com...
94
+ [Screenshot: Email entered]
95
+
96
+ Now entering the password and clicking Sign In...
97
+ [Screenshot: Dashboard loaded]
98
+
99
+ ✅ Login successful! I've written the test to tests/login.test.mjs
100
+ ```
101
+
102
+ ## Generated Test Code
103
+
104
+ The agent generates standard Vitest test files:
105
+
106
+ ```javascript tests/login.test.mjs
107
+ import { describe, expect, it } from "vitest";
108
+ import { TestDriver } from "testdriverai/vitest/hooks";
109
+
110
+ describe("Login Flow", () => {
111
+ it("should log in successfully", async (context) => {
112
+ const testdriver = TestDriver(context);
113
+
114
+ await testdriver.provision.chrome({
115
+ url: "https://console.testdriver.ai"
116
+ });
117
+
118
+ const emailInput = await testdriver.find("email input field");
119
+ await emailInput.click();
120
+ await testdriver.type("test@example.com");
121
+
122
+ const passwordInput = await testdriver.find("password input field");
123
+ await passwordInput.click();
124
+ await testdriver.type("password123");
125
+
126
+ const signInButton = await testdriver.find("Sign In button");
127
+ await signInButton.click();
128
+
129
+ const result = await testdriver.assert("dashboard is visible");
130
+ expect(result).toBeTruthy();
131
+ });
132
+ });
133
+ ```
134
+
135
+ ## Tips for Better Tests
136
+
137
+ <AccordionGroup>
138
+ <Accordion title="Be specific with element descriptions">
139
+ Instead of "click the button", say "click the blue Sign In button in the header". More context helps the AI find the right element.
140
+ </Accordion>
141
+ <Accordion title="Add waits for dynamic content">
142
+ If your app has animations or loading states, tell the agent to wait:
143
+ ```
144
+ Wait for the loading spinner to disappear before continuing
145
+ ```
146
+ </Accordion>
147
+ <Accordion title="Use assertions liberally">
148
+ Add assertions after each major action to catch regressions early:
149
+ ```
150
+ Assert that the product was added to the cart
151
+ ```
152
+ </Accordion>
153
+ <Accordion title="Break complex flows into steps">
154
+ For long workflows, create the test incrementally and verify each step works before moving on.
155
+ </Accordion>
156
+ </AccordionGroup>