testdriverai 5.7.17 → 5.7.20

package/.github/workflows/testdriver.yml

@@ -9,7 +9,6 @@ permissions:
 on:
   push:
     branches: ["main"]
-  pull_request:
   workflow_dispatch:
   schedule:
     - cron: "0 0 * * *"
@@ -50,7 +49,6 @@ jobs:
         uses: testdriverai/action@main
         with:
           os: ${{ contains(matrix.os, 'windows') && 'windows' || 'linux' }}
-          version: "alpha"
           prerun: |
             exit
           key: ${{ secrets.TESTDRIVER_API_KEY }}
@@ -62,28 +60,28 @@ jobs:
           TD_WEBSITE: "https://testdriver-sandbox.vercel.app"
           TD_VM_RESOLUTION: "1920x1080"
 
-      - name: Write MDX to shared snippets dir
+      - name: Write MDX snippets separately
         run: |
           mkdir -p snippets
-          FILE_NAME=$(basename "${{ matrix.test }}")
-          TEST_FILE="testdriver/$FILE_NAME"
-          DEST_FILE="snippets/${{ matrix.os }}-${FILE_NAME}.mdx"
+          FILE_NAME=$(basename "${{ matrix.test }}" .yaml)
+          TEST_FILE="testdriver/${FILE_NAME}.yaml"
 
-          URL="${{ steps.testdriver.outputs.link }}"
-          PARAMS="embed=true&timestamp=60000&playbackRate=2"
+          EMBED_URL="${{ steps.testdriver.outputs.link }}"
+          PARAMS="embed=true&timestamp=90000&playbackRate=5"
 
-          if [[ "$URL" == *\?* ]]; then
-            EMBED_URL="${URL}&${PARAMS}"
+          if [[ "$EMBED_URL" == *\?* ]]; then
+            EMBED_URL="${EMBED_URL}&${PARAMS}"
           else
-            EMBED_URL="${URL}?${PARAMS}"
+            EMBED_URL="${EMBED_URL}?${PARAMS}"
           fi
 
-          echo "<iframe src=\"$EMBED_URL\" />" > "$DEST_FILE"
-          echo >> "$DEST_FILE"
-          echo '```yaml' >> "$DEST_FILE"
-          cat "$TEST_FILE" >> "$DEST_FILE"
-          echo '```' >> "$DEST_FILE"
+          # Write iframe MDX
+          echo "<iframe src=\"$EMBED_URL\" width=\"100%\" height=\"300\" />" > "snippets/${FILE_NAME}-replay.mdx"
 
+          # Write YAML MDX
+          echo '```yaml' > "snippets/${FILE_NAME}-yaml.mdx"
+          cat "$TEST_FILE" >> "snippets/${FILE_NAME}-yaml.mdx"
+          echo '```' >> "snippets/${FILE_NAME}-yaml.mdx"
 
       - name: Upload snippets artifact
         uses: actions/upload-artifact@v4
@@ -91,16 +89,18 @@ jobs:
           name: snippets-${{ matrix.os }}-${{ matrix.test }}
           path: snippets/
           retention-days: 1
-
   create-snippets-commit:
     name: Commit Snippets
     needs: run-tests
     runs-on: ubuntu-latest
+    if: ${{ always() }}
+    env:
+      BASE_BRANCH: ${{ github.event.pull_request.base.ref || github.ref_name }}
     steps:
       - name: Check out current branch
         uses: actions/checkout@v3
         with:
-          ref: ${{ github.ref }}
+          ref: ${{ github.head_ref }}
 
       - name: Download all snippets artifacts
         uses: actions/download-artifact@v4
@@ -110,32 +110,10 @@ jobs:
           merge-multiple: true
 
       - name: Commit updated snippets
-        run: |
-          #!/usr/bin/env bash
-          set -e
-
-          # Set Git config
-          git config --global user.name 'github-actions[bot]'
-          git config --global user.email 'github-actions[bot]@users.noreply.github.com'
-
-          # Stage changes
-          git add docs/snippets/tests
-
-          # Commit if there are staged changes
-          if ! git diff --cached --quiet; then
-            git commit -m "Update test snippets [skip ci]"
-
-            # Extract the current branch name from GitHub Actions environment
-            BRANCH_NAME="${GITHUB_REF#refs/heads/}"
-
-            # Fallback if BRANCH_NAME is empty (e.g., pull request event)
-            if [ -z "$BRANCH_NAME" ]; then
-              echo "Branch name not found in GITHUB_REF; defaulting to 'main'"
-              BRANCH_NAME="main"
-            fi
-
-            # Push the commit to the correct branch
-            git push origin HEAD:"$BRANCH_NAME"
-          else
-            echo "No changes to commit"
-          fi
+        uses: EndBug/add-and-commit@v9
+        with:
+          author_name: github-actions[bot]
+          author_email: github-actions[bot]@users.noreply.github.com
+          message: "Update test snippets [skip ci]"
+          add: "docs/snippets/tests"
+          new_branch: ${{ github.head_ref }}

package/CONTRIBUTING.md

@@ -0,0 +1,45 @@
+# Contributing
+
+## Setup `testdriverai` repo
+
+1. `gh repo clone testdriverai/testdriverai`
+1. `npm install` project dependencies
+1. `npm link`
+
+## Setting up a Test Project
+
+1. `cd $(mktemp -d)` to create a blank project
+1. `npm link testdriverai`
+1. `npx testdriverai init`
+
+   > Spawning GUI...
+   > Howdy! I'm TestDriver v4.2.29
+   > Working on **/private/var/folders/4w/\_l20wtfj41n2dx0xyhb8xd740000gn/T/tmp.PDxTlOLJBS/testdriver/testdriver.yml**
+   > ...
+
+1. `npx testdriverai testdriver/test.yml`
+
+## Testing against local `api`
+
+When running [replayableio/api](https://github.com/replayableio/api/) locally, specify `TD_API_ROOT` in your `.env` file or shell:
+
+```sh
+TD_API_ROOT=http://localhost:1337 npx testdriverai
+```
+
+## Logging
+
+- `DEV` to log the config
+- `VERBOSE` to log `logger.debug` (Default: `logger.info` and above)
+
+```sh
+DEV=true VERBOSE=true npx testdriverai
+```
+
+## Debugging with Chrome Node Inspector
+
+> https://nodejs.org/en/learn/getting-started/debugging
+
+```sh
+npx --node-options=--inspect testdriverai init
+```

package/README.md

@@ -153,3 +153,4 @@ gh pr create --web
 ```
 
 Your test will run on every commit and the results will be posted as a Dashcam.io video within your GitHub summary! Learn more about deploying on CI [here](https://docs.testdriver.ai/action/setup).
+

package/docs/commands/assert.mdx

@@ -3,8 +3,15 @@ title: "assert"
 sidebarTitle: "assert"
 description: "Validate conditions during a test using the assert command."
 icon: "check"
+mode: "wide"
 ---
 
+import Replay from '/snippets/tests/assert-replay.mdx'
+import Example from '/snippets/tests/assert-yaml.mdx'
+
+<Replay />
+<Example />
+
 ## Description
 The `assert` command validates that a specific condition is true. It ensures that a task completed successfully by checking the screen for the expected outcome. If the condition isn't met, the test will fail.
 

package/docs/commands/exec.mdx

@@ -3,8 +3,15 @@ title: "exec"
 sidebarTitle: "exec"
 description: "Execute custom shell or Node.js scripts within your tests."
 icon: "code"
+mode: "wide"
 ---
 
+import Replay from '/snippets/tests/exec-shell-replay.mdx'
+import Example from '/snippets/tests/exec-shell-yaml.mdx'
+
+<Replay />
+<Example />
+
 ## Description
 The `exec` command allows you to execute custom Node.js scripts within your TestDriver tests. This is useful for tasks like generating dynamic data, interacting with APIs, or performing custom logic during a test. The output of the script can be stored in a variable for use in subsequent steps. It's important to note that the output from `exec` must be a `string`. 
 

package/docs/commands/hover-image.mdx

@@ -3,8 +3,15 @@ title: "hover-image"
 sidebarTitle: "hover-image"
 description: "Locate an image on the screen and perform an action."
 icon: "image"
+mode: "wide"
 ---
 
+import Replay from '/snippets/tests/hover-image-replay.mdx'
+import Example from '/snippets/tests/hover-image-yaml.mdx'
+
+<Replay />
+<Example />
+
 ## Description
 
 The `hover-image` command is used to locate an image on the screen based on a description and perform an action on it. This can include hovering, clicking, right-clicking, or double-clicking the image.

package/docs/commands/hover-text.mdx

@@ -3,8 +3,15 @@ title: "hover-text"
 sidebarTitle: "hover-text"
 description: "Locate text on the screen and perform an action."
 icon: "text"
+mode: "wide"
 ---
 
+import Replay from '/snippets/tests/hover-text-replay.mdx'
+import Example from '/snippets/tests/hover-text-yaml.mdx'
+
+<Replay />
+<Example />
+
 ## Description
 The `hover-text` command is used to locate text on the screen based on a description and perform an action on it. This can include hovering, clicking, right-clicking, or double-clicking the text.
 

package/docs/commands/match-image.mdx

@@ -3,8 +3,15 @@ title: "match-image"
 sidebarTitle: "match-image"
 description: "Locate an image on the screen and perform an action."
 icon: "images"
+mode: "wide"
 ---
 
+import Replay from '/snippets/tests/match-image-replay.mdx'
+import Example from '/snippets/tests/match-image-yaml.mdx'
+
+<Replay />
+<Example />
+
 ## Description
 The `match-image` command is used to locate an image on the screen by matching it with a reference image file and performing an action (For example, click or hover) at its center. This command is particularly useful for interacting with elements that the AI has difficulty locating using descriptions or other methods.
 

package/docs/commands/scroll-until-text.mdx

@@ -3,36 +3,44 @@ title: "scroll-until-text"
 sidebarTitle: "scroll-until-text"
 description: "Scroll the screen until the specified text is found."
 icon: "scroll"
+mode: "wide"
 ---
 
+import Replay from '/snippets/tests/scroll-until-text-replay.mdx'
+import Example from '/snippets/tests/scroll-until-text-yaml.mdx'
+
+<Replay />
+<Example />
+
 ## Description
 The `scroll-until-text` command is used to scroll the screen in a specified direction until the specified text is found. This is useful for navigating to elements that aren't initially visible on the screen.
 
 ## Arguments
 | Argument    | Type     | Description                                                                 |
 |-------------|----------|-----------------------------------------------------------------------------|
-| `text`      | `string` | The text to find on the screen. Longer and unique are better.     |
+| `text`      | `string` | The text to find on the screen. Longer and unique are better. Note this is **case sensitive**     |
 | `direction` | `string` | The direction to scroll. Available directions are: `up`, `down`, `left`, `right`. |
-| `distance`  | `number` | (Optional) The maximum number of pixels to scroll before giving up. Default is `1200`. |
-| `method`    | `enum`   | (Optional) The matching algorithm to use. Possible values are `ai` (default) and `turbo`. |
+| `distance`  | `number` | (Optional) The maximum number of pixels to scroll before giving up. Default is `300`. |
+| `method`    | `enum`   | (Optional) The matching algorithm to use. Possible values are `keyboard` (default) and `mouse`. |
 
 ## Example usage
 ```yaml
 command: scroll-until-text
 text: Sign Up
 direction: down
+method: keyboard
+distance: 500
 ```
 
 ## Protips
 - Use unique and specific text to improve detection accuracy.
-- Choose the appropriate `method` for your use case:
-  - `ai`: More robust for complex or ambiguous text matching (default).
-  - `turbo`: Faster and more efficient for simpler scenarios.
-- Adjust the `distance` value to control how far the command scrolls before giving up.
+  - Adjust the `distance` value to control how far the command scrolls before giving up.
+  - If you don't specify a `distance`, the command will scroll 300 pixels at a time, giving up after 5 attempts.
 
 ## Gotchas
 - If the text can't be located within the specified `distance`, the command will fail.
 - Ensure the text is visible and matches exactly, as variations in font size, style, or screen resolution may affect detection accuracy.
+- Note that `text` is case-sensitive, so **Sign Up** and **sign up** would be treated as different strings.
 
 ## Notes
 - The `scroll-until-text` command is ideal for navigating to elements that are off-screen and can't be located using other commands.

package/docs/commands/type.mdx

@@ -3,8 +3,15 @@ title: "type"
 sidebarTitle: "type"
 description: "Simulate typing a string using keyboard emulation."
 icon: "typewriter"
+mode: "wide"
 ---
 
+import Replay from '/snippets/tests/type-replay.mdx'
+import Example from '/snippets/tests/type-yaml.mdx'
+
+<Replay />
+<Example />
+
 ## Description
 The `type` command is used to simulate typing a string using keyboard emulation. This is useful for entering text into input fields or performing text-based interactions.
 

package/docs/quickstart.mdx

@@ -3,66 +3,60 @@ title: "Quickstart"
 ---
 
 <Steps>
-
-<Step title="Install TestDriver">
-
-Install the TestDriver CLI globally:  
-
-```bash
-npm install -g testdriverai@beta
-```
-</Step>
-
-<Step title="Initialize Your Project">
-Set up your project with:  
-```bash
-testdriverai init
-```  
-This creates a `.env` file and sample workflow files.
-</Step>
-
-<Step title="Run TestDriver in Interactive Mode">
-Start TestDriver in interactive mode to create and refine tests dynamically:  
-```bash
-testdriverai
-```  
-Once started, you can use commands like `/explore`, `/undo`, and `/save` to interactively build and test your flows.
-</Step>
-
-<Step title="Define Your Test Steps">
-Use natural language to describe what you want to test. For example:  
-```
-> Open Google Chrome and search for "testdriverai"
-```
-TestDriver will generate steps like:  
-```yaml
-- command: focus-application
-  name: Google Chrome
-- command: hover-text
-  text: Search Google or type a URL
-  description: main search bar
-  action: click
-- command: type
-  text: testdriverai
-- command: press-keys
-  keys: [enter]
-```
-</Step>
-
-<Step title="Refine and Save Your Test">
-- Use `/undo` to remove the last step if needed.  
-- Save your test with `/save` to generate a reusable YAML file.
-</Step>
-
-<Step title="Run Saved Tests">
-Once saved, you can run your test file anytime:  
-```bash
-testdriverai run path/to/test.yaml
-```
-</Step>
-
+  <Step title="Initialize Your Project" stepNumber={1}>
+    Set up your project with:
+
+    ```bash
+    npx testdriverai@beta init
+    ```
+
+    This creates a `.env` file and sample workflow files.
+  </Step>
+  <Step title="Run TestDriver in Interactive Mode" stepNumber={2}>
+    <Tip>
+      Always start with interactive mode (`testdriverai`) to explore and refine your tests before saving them. It's faster and more intuitive\!
+    </Tip>
+    Start TestDriver in interactive mode to create and refine tests dynamically:
+
+    ```bash
+    npx testdriverai@beta
+    ```
+
+    Once started, you can use commands like `/explore`, `/undo`, and `/save` to interactively build and test your flows.
+  </Step>
+  <Step title="Define Your Test Steps" stepNumber={3}>
+    Use natural language to describe what you want to test. For example:
+
+    ```
+    > Open Google Chrome and search for "testdriverai"
+    ```
+
+    TestDriver will generate steps like:
+
+    ```yaml
+    - command: focus-application
+      name: Google Chrome
+    - command: hover-text
+      text: Search Google or type a URL
+      description: main search bar
+      action: click
+    - command: type
+      text: testdriverai
+    - command: press-keys
+      keys: [enter]
+    ```
+  </Step>
+  <Step title="Refine and Save Your Test" stepNumber={4}>
+    - Use `/undo` to remove the last step if needed.
+    - Save your test with `/save` to generate a reusable YAML file.
+  </Step>
+  <Step title="Run Saved Tests" stepNumber={5}>
+    Once saved, you can run your test file anytime:
+
+    ```bash
+    npx testdriverai@beta run path/to/test.yaml
+    ```
+  </Step>
 </Steps>
 
----
-
-**Pro Tip:** Always start with interactive mode (`testdriverai`) to explore and refine your tests before saving them. It's faster and more intuitive!
+---

package/docs/snippets/tests/assert-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351db6d4ad9429e27959ea?share=8vj2IG9LBS2op3mDLux1cQ&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/assert-yaml.mdx

@@ -0,0 +1,9 @@
+```yaml
+version: 5.7.7
+session: 682f5d92811bd5a322c0e636
+steps:
+  - prompt: assert the testdriver login page shows
+    commands:
+      - command: assert
+        expect: the TestDriver.ai Sandbox login page is displayed
+```

package/docs/snippets/tests/exec-js-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351d99d4ad9429e27959a3?share=NiFtJ2rH6G3TR30TK0W8uQ&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/exec-js-yaml.mdx

@@ -0,0 +1,51 @@
+```yaml
+version: 5.7.7
+session: 682f5fc22856e2eb40664269
+steps:
+  - prompt: fetch user data from API
+    commands:
+      - command: exec
+        output: user
+        lang: js
+        linux: >
+          const response = await
+          fetch('https://jsonplaceholder.typicode.com/users');
+
+          const user = await response.json();
+
+          console.log('user', user[0]);
+
+          result = user[0].email;
+        mac: >
+          const response = await
+          fetch('https://jsonplaceholder.typicode.com/users');
+
+          const user = await response.json();
+
+          console.log('user', user[0]);
+
+          result = user[0].email;
+        windows: >
+          const response = await
+          fetch('https://jsonplaceholder.typicode.com/users');
+
+          const user = await response.json();
+
+          console.log('user', user[0]);
+
+          result = user[0].email;
+      - command: hover-text
+        text: Username
+        description: input field for username
+        action: click
+      - command: type
+        text: ${OUTPUT.user}
+  - prompt: assert that the username field shows a valid email address
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: assert
+        expect: >-
+          the username field contains "Sincere@april.biz" which is a valid email
+          address
+```

package/docs/snippets/tests/exec-shell-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351d94d4ad9429e279599f?share=cZGF8hXRiEMVgjMb0mDDBA&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/exec-shell-yaml.mdx

@@ -0,0 +1,23 @@
+```yaml
+version: 5.1.1
+session: 67f00511acbd9ccac373edf7
+steps:
+  - prompt: launch chrome
+    commands:
+      - command: exec
+        lang: shell
+        linux: |
+          jumpapp google-chrome --disable-fre --no-default-browser-check --no-first-run "${TD_WEBSITE}" &
+          exit
+        mac: |
+          open -na "Google Chrome" --args --disable-fre --no-default-browser-check --no-first-run --disable-features=PasswordManagerEnabled "${TD_WEBSITE}" &
+          exit
+        windows:
+          Start-Process "C:/Program Files/Google/Chrome/Application/chrome.exe" -ArgumentList "--start-maximized", "${TD_WEBSITE}"
+          exit
+      - command: wait-for-text
+        text: ${TD_WEBSITE}
+        timeout: 30000
+      - command: assert
+        expect: Google Chrome is running
+```

package/docs/snippets/tests/hover-image-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351dcdd4ad9429e2795a0c?share=XQWE3QZ2uklzOk3vkw9FyQ&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/hover-image-yaml.mdx

@@ -0,0 +1,19 @@
+```yaml
+version: 5.7.7
+session: 682f60bf2856e2eb4066427f
+steps:
+  - commands:
+    - command: run
+      file: testdriver/snippets/login.yaml
+  - prompt: click on the image of a shopping cart
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: hover-image
+        description: shopping cart icon next to the Cart text in the top right corner
+        action: click
+  - prompt: assert that you see an empty shopping cart
+    commands:
+      - command: assert
+        expect: Your cart is empty
+```

package/docs/snippets/tests/hover-text-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351d99d4ad9429e27959a5?share=wy5uCSswzmKeVnOF9ykTVQ&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/hover-text-with-description-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351de8d4ad9429e2795a23?share=d8W4FM0kL4mpNcWFlIcydA&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/hover-text-with-description-yaml.mdx

@@ -0,0 +1,30 @@
+```yaml
+version: 5.7.7
+session: 682f62f6811bd5a322c0e726
+steps:
+  - commands:
+    - command: run
+      file: testdriver/snippets/login.yaml
+  - prompt: click on add to cart under the testdriver hat
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: hover-text
+        text: Add to Cart
+        description: add to cart button under TestDriver Hat
+        action: click
+  - prompt: click on the cart
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: hover-text
+        text: Cart
+        description: cart button in the top right corner
+        action: click
+  - prompt: assert the testdriver hat is in the cart
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: assert
+        expect: TestDriver Hat is in the cart
+```

package/docs/snippets/tests/hover-text-yaml.mdx

@@ -0,0 +1,15 @@
+```yaml
+version: 5.7.7
+session: 682f5aab811bd5a322c0e5a1
+steps:
+  - prompt: click on sign in
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: hover-text
+        text: Sign In
+        description: black button below the password field
+        action: click
+      - command: assert
+        expect: an error shows that fields are required
+```

package/docs/snippets/tests/match-image-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351e134eab8fb09d7a02be?share=6iP9HGD99K5MrQ9viHNXlw&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/match-image-yaml.mdx

@@ -0,0 +1,17 @@
+```yaml
+version: 5.7.7
+session: 682f5d92811bd5a322c0e636
+steps:
+  - commands:
+    - command: run
+      file: testdriver/snippets/login.yaml
+  - prompt: assert the testdriver login page shows
+    commands:
+      - command: match-image
+        path: cart.png
+        action: click
+  - prompt: assert that you see an empty shopping cart
+    commands:
+      - command: assert
+        expect: Your cart is empty
+```

package/docs/snippets/tests/press-keys-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351d95d4ad9429e27959a1?share=d12VqX1HNl9EI6fue9X4oQ&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/press-keys-yaml.mdx

@@ -0,0 +1,15 @@
+```yaml
+version: 5.7.7
+session: 682f645a2856e2eb406642f8
+steps:
+  - prompt: create a new tab
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: press-keys
+        keys:
+          - command
+          - t
+      - command: assert
+        expect: a new tab was created
+```

package/docs/snippets/tests/prompt-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351dd2d4ad9429e2795a16?share=553Boxgy6msWi6ppY0JaEw&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/prompt-yaml.mdx

@@ -0,0 +1,10 @@
+```yaml
+version: 5.7.7
+session: 682f5aab811bd5a322c0e5a1
+steps:
+  - prompt: enter a valid username, password, and sign in
+  - prompt: assert  
+    commands:
+      - command: assert
+        expect: the testdriver shop shows
+```

package/docs/snippets/tests/remember-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351db54eab8fb09d7a0275?share=IGChVSHFcEtimjMNw2mfhA&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/remember-yaml.mdx

@@ -0,0 +1,9 @@
+```yaml
+version: 5.7.7
+session: 682f66241f5b5f003ee139cb
+steps:
+  - prompt: remember the username of the user who cannot login
+    commands:
+      - command: focus-application
+        name: Google Chrome
+```

package/docs/snippets/tests/scroll-until-text-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351dbb4eab8fb09d7a027a?share=GMinhsqf0mH4BYof0gLxWw&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/scroll-until-text-yaml.mdx

@@ -0,0 +1,22 @@
+```yaml
+version: 5.7.7
+session: 682f62a1811bd5a322c0e70b
+steps:
+  - commands:
+    - command: run
+      file: testdriver/snippets/login.yaml
+  - prompt: scroll until text testdriver socks
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: scroll-until-text
+        text: testdriver socks
+        direction: down
+        method: keyboard
+  - prompt: assert testdriver socks appears on screen
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: assert
+        expect: TestDriver Socks appears on screen
+```

package/docs/snippets/tests/type-replay.mdx

@@ -0,0 +1 @@
+<iframe src="https://app.dashcam.io/replay/68351dccd4ad9429e2795a09?share=9hjY4zYKcBrC6L10u0zRDg&embed=true&timestamp=90000&playbackRate=5" width="100%" height="300" />

package/docs/snippets/tests/type-yaml.mdx

@@ -0,0 +1,31 @@
+```yaml
+version: 5.7.7
+session: 682f5c4c811bd5a322c0e5c1
+steps:
+  - prompt: enter standard_user within the username field
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: hover-text
+        text: Username
+        description: input field for username
+        action: click
+      - command: type
+        text: standard_user
+  - prompt: assert that standard_user shows in the username field
+    commands:
+      - command: assert
+        expect: the username field contains "standard_user"
+  - prompt: click on sign in
+    commands:
+      - command: hover-text
+        text: Sign in
+        description: black button below the password field
+        action: click
+  - prompt: assert that "please fill out this field" shows in the password field
+    commands:
+      - command: focus-application
+        name: Google Chrome
+      - command: assert
+        expect: Please fill out this field is visible near the password field
+```

package/package.json

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

package/testdriver/prompt.yaml

@@ -0,0 +1,8 @@
+version: 5.7.7
+session: 682f5aab811bd5a322c0e5a1
+steps:
+  - prompt: enter a valid username, password, and sign in
+  - prompt: assert  
+    commands:
+      - command: assert
+        expect: the testdriver shop shows

package/testdriver/snippets/login.yaml

@@ -1,22 +1,28 @@
 version: 5.7.7
 session: 682f6071811bd5a322c0e6dd
 steps:
-  - prompt: log into the app
+  - prompt: focus chrome
     commands:
       - command: focus-application
         name: Google Chrome
+  - prompt: enter a username
+    commands:
       - command: hover-text
         text: Username
         description: username input field
         action: click
       - command: type
         text: standard_user
+  - prompt: enter a password
+    commands:
       - command: hover-text
         text: Password
         description: password input field
         action: click
       - command: type
         text: secret_password
+  - prompt: click sign in
+    commands:
       - command: hover-text
         text: Sign in
         description: sign in button