testdriverai 5.3.0 → 5.3.2

package/docs/getting-started/vscode.mdx

@@ -0,0 +1,80 @@
+---
+title: "Install the TestDriver.ai VSCode Extension"
+sidebarTitle: "VSCode Extension"
+description: "Comprehensive guide to installing and setting up TestDriver.ai for VSCode"
+icon: "file-code"
+---
+
+
+[Download VSCode Extension](https://github.com/testdriverai/vscode/actions/runs/14451916515#artifacts)
+
+# Install the extension
+
+1. Open Visual Studio Code.
+2. Go to the Extensions view by clicking on the Extensions icon in the Activity Bar on the side of the window or by pressing `Ctrl+Shift+X`.
+3. In the Extensions view, click on the three-dot menu in the top-right corner and select "Install from VSIX...".
+4. Navigate to the location where you downloaded the `testdriverai.vsix` file and select it.
+
+![](/images/content/vscode-install.png)
+
+# Try the Walkthrough
+
+The extension should launch a walkthrough. If it does not, you can manually start it by running the command `TestDriver: Start Walkthrough` from the Command Palette (`Ctrl+Shift+P`).
+
+![](/images/content/vscode-walkthrough.png)
+
+# Overview
+
+![](/images/content/vscode-overview.png)
+
+- Test Pane
+  - Located in the **Activity Bar** (left-hand side of the editor).
+  - Clicking the **flask icon** opens the TestDriver test explorer.
+  - Lists all the available YAML-based test definitions.
+- Run all Tests
+  - This button runs all tests shown in the Test Explorer.
+  - Found near the top of the Test Explorer view.
+  - Especially useful for quickly validating a batch of test cases.
+- AI Test Creation
+  - New files created by TestDriver will automatically be focused in the editor.
+  - Defines an automated test script created by TestDriver.
+- AI Agent Test Preview
+  - Sidebar chat panel shows the TestDriver agent’s response to the prompt.
+  - Offers feedback, interpretation, or suggested actions for the test steps.
+  - Example: It identifies the context (e.g., a terminal is in focus) and suggests the correct automation action.
+  - Additional files modified by the agent are listed for context.
+- Test Output
+  - Terminal panel at the bottom of the screen.
+  - Displays live output from running the test file.
+  - Shows TestDriver version, current test script, and metadata like session ID.
+  - Helpful for debugging and understanding test execution flow.
+- Test History
+  - Shows a list of previously run test scripts.
+  - Allows developers to review or re-run older tests.
+  - Useful for regression testing or comparing AI-generated test iterations.
+
+# Troubleshooting
+
+## I don't have GitHub Copilot Chat
+
+You can still use the extension to run and manage tests. Use the CLI for test creation instead.
+
+## The @testdriverai command doesn't show up
+
+Make sure the GitHub Copilot Chat is set to "ask."
+
+![](/images/content/vscode-ask.png)
+
+## How do I stop a running execution?
+
+Click on the "Stop" button in the bottom of agent chat.
+
+![](/images/content/vscode-stop-chat.png)
+
+Click on the "Stop" button in the top right corner of the test execution. This only shows on hover.
+
+![](/images/content/vscode-stop-test.png)
+
+A TestDriver icon will show in the tray bar. Click it, then click "quit."
+
+![](/images/content/vscode-stop-quit.png)

package/docs/getting-started/writing.mdx

@@ -1,7 +1,8 @@
 ---
-title: "Writing Tests with TestDriver.ai"
-sidebarTitle: "Writing Tests"
-description: "Step-by-step guide to writing and refining tests using TestDriver.ai's interactive CLI."
+title: "Test Copilot"
+sidebarTitle: "Test Copilot"
+description: "Create tests with the help of TestDriver's interactive computer-use agent."
+icon: "glasses"
 ---
 
 The TestDriver.ai interactive CLI allows you to create, refine, and execute tests dynamically using natural language commands. Here's how to get started.

package/docs/guide/assertions.mdx

@@ -2,6 +2,7 @@
 title: "Using Assertions in TestDriver.ai"
 sidebarTitle: "Assertions"
 description: "Comprehensive guide to understanding and implementing assertions in TestDriver.ai for robust test validation."
+icon: "square-check"
 ---
 
 # Guide: Using Assertions in TestDriver.ai

package/docs/guide/authentication.mdx

@@ -2,6 +2,7 @@
 title: "Authentication in TestDriver.ai"
 sidebarTitle: "Authentication"
 description: "Learn how to securely handle authentication workflows in TestDriver.ai using GitHub Actions."
+icon: "lock"
 ---
 
 This guide explains how to handle **authentication workflows** in **TestDriver.ai** using GitHub Actions. It covers securely passing credentials (e.g., usernames and passwords) to the TestDriver.ai action and using them in both the `prerun` script and test files.

package/docs/guide/code.mdx

@@ -2,6 +2,7 @@
 title: "Custom Code in TestDriver.ai"
 sidebarTitle: "Custom Code"
 description: "Learn how to integrate custom Node.js scripts into your TestDriver.ai workflows for dynamic testing."
+icon: "code"
 ---
 
 TestDriver.ai allows you to execute custom **Node.js** scripts within your test workflows using the `exec` command. This feature, introduced in version `5.1.0`, enables you to integrate custom logic, such as generating one-time passwords (OTPs), hitting APIs, or performing other dynamic operations, directly into your tests.

package/docs/guide/locating.mdx

@@ -2,6 +2,7 @@
 title: "Locating Elements in TestDriver.ai"
 sidebarTitle: "Locating Elements"
 description: "Learn how to effectively describe and locate elements using TestDriver.ai's visual understanding capabilities."
+icon: "magnifying-glass"
 ---
 
 TestDriver.ai uses **visual understanding** to locate elements on the screen. Unlike traditional testing frameworks that rely on selectors or element IDs, TestDriver.ai identifies elements based on their **visual appearance**. This guide explains how to describe elements effectively to ensure TestDriver.ai can locate them accurately.

package/docs/guide/setup-teardown.mdx

@@ -2,6 +2,7 @@
 title: "Setup & Teardown"
 sidebarTitle: "Setup & Teardown"
 description: "Learn how to effectively describe and locate elements using TestDriver.ai's visual understanding capabilities."
+icon: "hammer"
 ---
 
 

package/docs/guide/variables.mdx

@@ -1,3 +1,7 @@
+---
+icon: "square-root-variable"
+---
+
 # Using Variables in TestDriver.ai
 
 Variables in **TestDriver.ai** allow you to dynamically store and reuse data during test execution. This feature is particularly useful for handling dynamic content, passing data between steps, and customizing test behavior based on runtime conditions.

package/docs/guide/waiting.mdx

@@ -1,25 +1,39 @@
+---
+title: Waiting in TestDriver.ai
+sidebarTitle: Waiting
+icon: "hourglass-half"
+---
+
 # Waiting in TestDriver.ai: Ensuring Stability and Reducing Flakiness
 
-Waiting is a critical feature in TestDriver.ai that ensures tests are stable and reliable, even in dynamic or slow-loading environments. TestDriver.ai provides built-in mechanisms to wait for UI changes, network stabilization, and specific elements like text or images to appear on the screen. These features help reduce test flakiness and improve the accuracy of your test results.
+Waiting is a critical feature in TestDriver.ai that ensures tests are stable and reliable, even in dynamic or slow-loading environments. 
 
----
+
+## Summary of Waiting Features
+
+| **Feature**          | **Description**                                                                 |
+|-----------------------|---------------------------------------------------------------------------------|
+| **`redraw`(automatic)** | TestDriver automatically waits for UI changes and network activity to resolve. |
+| **`wait-for-text`**   | Waits for specific text to appear on the screen.                                |
+| **`wait-for-image`**  | Waits for a specific image or visual element to appear on the screen.           |
 
 ## Key Waiting Features in TestDriver.ai
 
-1. **`wait-for-text` Command**:
+1. **Automatic Waiting with `redraw`**:
+   - TestDriver.ai automatically waits for the machine before moving to the next step.
+   - This includes waiting for:
+     - UI changes to complete.
+     - Network activity to stabilize (e.g., API calls).
+   - Reduces the need for manual waits, making tests faster and less prone to flakiness.
+
+2. **`wait-for-text` Command**:
    - Waits for specific text to appear on the screen.
    - Useful for validating dynamic content or ensuring that a page has fully loaded before proceeding.
 
-2. **`wait-for-image` Command**:
+3. **`wait-for-image` Command**:
    - Waits for a specific image or visual element to appear on the screen.
    - Ideal for verifying the presence of icons, logos, or other graphical elements.
 
-3. **Automatic Waiting with `redraw`**:
-   - TestDriver.ai automatically waits for the screen to stabilize before moving to the next step.
-   - This includes waiting for:
-     - UI changes to complete.
-     - Network activity to stabilize (e.g., AJAX requests or API calls).
-   - Reduces the need for manual waits, making tests faster and less prone to flakiness.
 
 ---
 
@@ -74,7 +88,6 @@ The `wait-for-image` command pauses the test until the specified image or visual
 
 ```
 
-
 In this example, the test waits up to 8 seconds for the company logo to appear in the top-left corner.
 
 ---
@@ -160,11 +173,8 @@ steps:
     commands:
       - command: assert
         expect: The dashboard is displayed
-
-
 ```
 
-
 ---
 
 ## Best Practices for Waiting
@@ -183,17 +193,3 @@ steps:
 
 5. **Test Incrementally**:
    - Add waiting commands step-by-step to ensure each part of the workflow is stable.
-
----
-
-## Summary of Waiting Features
-
-| **Feature**          | **Description**                                                                 |
-|-----------------------|---------------------------------------------------------------------------------|
-| **`wait-for-text`**   | Waits for specific text to appear on the screen.                                |
-| **`wait-for-image`**  | Waits for a specific image or visual element to appear on the screen.           |
-| **`redraw` Function** | Automatically waits for UI changes, network stabilization, and screen updates. |
-
----
-
-By leveraging TestDriver.ai's waiting features, you can create stable and reliable tests that adapt to dynamic environments, reducing flakiness and improving overall test quality.

package/docs/overview/comparison.mdx

@@ -1,3 +1,7 @@
+---
+title: "Comparison"
+icon: "boxing-glove"
+---
 
 ### Application Support
 

package/docs/overview/faq.mdx

@@ -1,6 +1,7 @@
 ---
 title: "FAQ"
 sidebarTitle: "FAQ"
+icon: "block-question"
 ---
 
 

package/docs/overview/quickstart.mdx

@@ -1,7 +1,17 @@
 ---
 title: "Quickstart"
+description: "Get started with TestDriver.ai in minutes."
+icon: "gauge-max"
 ---
 
+<Card
+  title="Get the VSCode Extension"
+  icon="link"
+  href="/getting-started/vscode"
+>
+  Turn your IDE into a powerful computer-use automation tool with our VSCode extension.
+</Card>
+
 <Steps>
 
 <Step title="Install TestDriver">

package/docs/overview/what-is-testdriver.mdx

@@ -1,6 +1,8 @@
 ---
 title: "What is TestDriver?"
 description: "TestDriver is a computer-use agent for QA testing of user interfaces."
+icon: "circle-info"
+mode: "wide"
 ---
 
 TestDriver uses AI vision and keyboard and mouse control to automate end-to-end testing. TestDriver is `selectorless` meaning it is not aware of the underlying code structure.

package/docs/security/action.mdx

@@ -2,10 +2,9 @@
 title: "Security Features of the TestDriver Action"
 sidebarTitle: "GitHub Action"
 description: "Understand the ephemeral VM runners, secrets handling, and environment-specific security for the TestDriver Action."
+icon: "code-pull-request"
 ---
 
-# TestDriver Action Security
-
 ## Open Source
 The TestDriver Action is open source, and its source code is available for review. You can find the repository here:
 

package/docs/security/agent.mdx

@@ -2,10 +2,9 @@
 title: "Security Features of the TestDriver Agent"
 sidebarTitle: "TestDriver Agent "
 description: "Explore the data collected, persistence, and privacy practices of the TestDriver Agent."
+icon: "robot"
 ---
 
-# TestDriver Agent Security
-
 ## Source
 The TestDriver Agent is open-source and available on NPM. You can browse the source code to see all the data collected and understand how everything works.
 

package/docs/security/platform.mdx

@@ -2,10 +2,9 @@
 title: "Security Features of the Dashboard"
 sidebarTitle: "TestDriver Platform" 
 description: "Learn about the security features of the TestDriver web dashboard, including SSL, OAuth, RBAC, and more."
+icon: "layer-group"
 ---
 
-# TestDriver Web Dashboard Security
-
 ## Overview
 The TestDriver web dashboard provides a secure interface for managing and reviewing your tests. Tests executed via the GitHub Action are recorded and reported through Dashcam, another application developed by TestDriver. For more details, refer to the [Dashcam documentation](https://dashcam.docs.testdriver.ai).
 

package/lib/commander.js

@@ -118,6 +118,12 @@ commands:
         notify(generator.jsonToManual(object, false));
         response = await commands["hover"](object.x, object.y);
         break;
+      case "drag":
+        speak(`dragging mouse`);
+        logger.info(generator.jsonToManual(object));
+        notify(generator.jsonToManual(object, false));
+        response = await commands["drag"](object.x, object.y);
+        break;
       case "hover-text":
         speak(`searching for ${object.description}`);
         server.broadcast("status", `searching for ${object.description}`);

package/lib/commands.js

@@ -233,7 +233,7 @@ const click = async (x, y, action = "click") => {
     double = true;
   }
 
-  logger.debug(chalk.dim(`${click} ${button} clicking at ${x}, ${y}...`), true);
+  logger.debug(chalk.dim(`${action} ${button} clicking at ${x}, ${y}...`), true);
 
   x = parseInt(x);
   y = parseInt(y);
@@ -276,6 +276,7 @@ const click = async (x, y, action = "click") => {
     }
 
     emitter.emit(events.mouseClick, { x, y, button, click });
+
   }
 
   if (!config.TD_VM && platform()== "darwin" && action === "right-click") {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "testdriverai",
-  "version": "5.3.0",
+  "version": "5.3.2",
   "description": "Next generation autonomous AI agent for end-to-end testing of web & desktop",
   "main": "index.js",
   "bin": {

package/test.yml

@@ -0,0 +1,18 @@
+version: 4
+steps:
+  - prompt: Enter Password n stuff
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: hover-text
+        text: Username 
+        description: username field
+        action: click
+      - command: type
+        text: ${TD_PASSWORD}
+      - command: hover-text
+        text: Password
+        description: Password field
+        action: click
+      - command: type
+        text: ${TD_PASSWORD}

package/testdriver/testdriver_2025-04-14T17-43-37-760Z.yaml

@@ -0,0 +1,10 @@
+version: 5.3.0
+session: 67fd494ed04f2b16ef43c84e
+steps:
+  - prompt: /try navigate to airbnb.com
+    commands:
+      - command: type
+        text: airbnb.com
+      - command: press-keys
+        keys:
+          - enter

package/testdriver/testdriver_2025-04-14T17-45-00-565Z.yaml

@@ -0,0 +1,13 @@
+version: 5.3.0
+session: 67fd4b4fd04f2b16ef43c86d
+steps:
+  - prompt: /try navigate to airbnb.com
+    commands:
+      - command: press-keys
+        keys:
+          - command
+          - space
+  - prompt: /try navigate to airbnb.com
+    commands:
+      - command: focus-application
+        name: Google Chrome