@willbooster/agent-skills 1.20.2 → 1.21.1

package/skills/playwright-cli/references/test-generation.md

@@ -11,22 +11,22 @@ This code appears in the output and can be copied directly into your test files.
 
 ```bash
 # Start a session
-bunx @playwright/cli@latest open https://example.com/login
+bunx @playwright/cli@0.1.8 open https://example.com/login
 
 # Take a snapshot to see elements
-bunx @playwright/cli@latest snapshot
+bunx @playwright/cli@0.1.8 snapshot
 # Output shows: e1 [textbox "Email"], e2 [textbox "Password"], e3 [button "Sign In"]
 
 # Fill form fields - generates code automatically
-bunx @playwright/cli@latest fill e1 "user@example.com"
+bunx @playwright/cli@0.1.8 fill e1 "user@example.com"
 # Ran Playwright code:
 # await page.getByRole('textbox', { name: 'Email' }).fill('user@example.com');
 
-bunx @playwright/cli@latest fill e2 "password123"
+bunx @playwright/cli@0.1.8 fill e2 "password123"
 # Ran Playwright code:
 # await page.getByRole('textbox', { name: 'Password' }).fill('password123');
 
-bunx @playwright/cli@latest click e3
+bunx @playwright/cli@0.1.8 click e3
 # Ran Playwright code:
 # await page.getByRole('button', { name: 'Sign In' }).click();
 ```
@@ -69,10 +69,10 @@ await page.locator('#submit-btn').click();
 Take snapshots to understand the page structure before recording actions:
 
 ```bash
-bunx @playwright/cli@latest open https://example.com
-bunx @playwright/cli@latest snapshot
+bunx @playwright/cli@0.1.8 open https://example.com
+bunx @playwright/cli@0.1.8 snapshot
 # Review the element structure
-bunx @playwright/cli@latest click e5
+bunx @playwright/cli@0.1.8 click e5
 ```
 
 ### 3. Add Assertions Manually

package/skills/playwright-cli/references/tracing.md

@@ -6,15 +6,15 @@ Capture detailed execution traces for debugging and analysis. Traces include DOM
 
 ```bash
 # Start trace recording
-bunx @playwright/cli@latest tracing-start
+bunx @playwright/cli@0.1.8 tracing-start
 
 # Perform actions
-bunx @playwright/cli@latest open https://example.com
-bunx @playwright/cli@latest click e1
-bunx @playwright/cli@latest fill e2 "test"
+bunx @playwright/cli@0.1.8 open https://example.com
+bunx @playwright/cli@0.1.8 click e1
+bunx @playwright/cli@0.1.8 fill e2 "test"
 
 # Stop trace recording
-bunx @playwright/cli@latest tracing-stop
+bunx @playwright/cli@0.1.8 tracing-stop
 ```
 
 ## Trace Output Files
@@ -67,22 +67,22 @@ When you start tracing, Playwright creates a `traces/` directory with several fi
 ### Debugging Failed Actions
 
 ```bash
-bunx @playwright/cli@latest tracing-start
-bunx @playwright/cli@latest open https://app.example.com
+bunx @playwright/cli@0.1.8 tracing-start
+bunx @playwright/cli@0.1.8 open https://app.example.com
 
 # This click fails - why?
-bunx @playwright/cli@latest click e5
+bunx @playwright/cli@0.1.8 click e5
 
-bunx @playwright/cli@latest tracing-stop
+bunx @playwright/cli@0.1.8 tracing-stop
 # Open trace to see DOM state when click was attempted
 ```
 
 ### Analyzing Performance
 
 ```bash
-bunx @playwright/cli@latest tracing-start
-bunx @playwright/cli@latest open https://slow-site.com
-bunx @playwright/cli@latest tracing-stop
+bunx @playwright/cli@0.1.8 tracing-start
+bunx @playwright/cli@0.1.8 open https://slow-site.com
+bunx @playwright/cli@0.1.8 tracing-stop
 
 # View network waterfall to identify slow resources
 ```
@@ -91,15 +91,15 @@ bunx @playwright/cli@latest tracing-stop
 
 ```bash
 # Record a complete user flow for documentation
-bunx @playwright/cli@latest tracing-start
+bunx @playwright/cli@0.1.8 tracing-start
 
-bunx @playwright/cli@latest open https://app.example.com/checkout
-bunx @playwright/cli@latest fill e1 "4111111111111111"
-bunx @playwright/cli@latest fill e2 "12/25"
-bunx @playwright/cli@latest fill e3 "123"
-bunx @playwright/cli@latest click e4
+bunx @playwright/cli@0.1.8 open https://app.example.com/checkout
+bunx @playwright/cli@0.1.8 fill e1 "4111111111111111"
+bunx @playwright/cli@0.1.8 fill e2 "12/25"
+bunx @playwright/cli@0.1.8 fill e3 "123"
+bunx @playwright/cli@0.1.8 click e4
 
-bunx @playwright/cli@latest tracing-stop
+bunx @playwright/cli@0.1.8 tracing-stop
 # Trace shows exact sequence of events
 ```
 
@@ -120,10 +120,10 @@ bunx @playwright/cli@latest tracing-stop
 
 ```bash
 # Trace the entire flow, not just the failing step
-bunx @playwright/cli@latest tracing-start
-bunx @playwright/cli@latest open https://example.com
+bunx @playwright/cli@0.1.8 tracing-start
+bunx @playwright/cli@0.1.8 open https://example.com
 # ... all steps leading to the issue ...
-bunx @playwright/cli@latest tracing-stop
+bunx @playwright/cli@0.1.8 tracing-stop
 ```
 
 ### 2. Clean Up Old Traces

package/skills/playwright-cli/references/video-recording.md

@@ -6,25 +6,25 @@ Capture browser automation sessions as video for debugging, documentation, or ve
 
 ```bash
 # Open browser first
-bunx @playwright/cli@latest open
+bunx @playwright/cli@0.1.8 open
 
 # Start recording
-bunx @playwright/cli@latest video-start demo.webm
+bunx @playwright/cli@0.1.8 video-start demo.webm
 
 # Add a chapter marker for section transitions
-bunx @playwright/cli@latest video-chapter "Getting Started" --description="Opening the homepage" --duration=2000
+bunx @playwright/cli@0.1.8 video-chapter "Getting Started" --description="Opening the homepage" --duration=2000
 
 # Navigate and perform actions
-bunx @playwright/cli@latest goto https://example.com
-bunx @playwright/cli@latest snapshot
-bunx @playwright/cli@latest click e1
+bunx @playwright/cli@0.1.8 goto https://example.com
+bunx @playwright/cli@0.1.8 snapshot
+bunx @playwright/cli@0.1.8 click e1
 
 # Add another chapter
-bunx @playwright/cli@latest video-chapter "Filling Form" --description="Entering test data" --duration=2000
-bunx @playwright/cli@latest fill e2 "test input"
+bunx @playwright/cli@0.1.8 video-chapter "Filling Form" --description="Entering test data" --duration=2000
+bunx @playwright/cli@0.1.8 fill e2 "test input"
 
 # Stop and save
-bunx @playwright/cli@latest video-stop
+bunx @playwright/cli@0.1.8 video-stop
 ```
 
 ## Best Practices
@@ -33,8 +33,8 @@ bunx @playwright/cli@latest video-stop
 
 ```bash
 # Include context in filename
-bunx @playwright/cli@latest video-start recordings/login-flow-2024-01-15.webm
-bunx @playwright/cli@latest video-start recordings/checkout-test-run-42.webm
+bunx @playwright/cli@0.1.8 video-start recordings/login-flow-2024-01-15.webm
+bunx @playwright/cli@0.1.8 video-start recordings/checkout-test-run-42.webm
 ```
 
 ### 2. Record entire hero scripts.
@@ -42,9 +42,9 @@ bunx @playwright/cli@latest video-start recordings/checkout-test-run-42.webm
 When recording a video for the user or as a proof of work, it is best to create a code snippet and execute it with run-code.
 It allows pulling appropriate pauses between the actions and annotating the video. There are new Playwright APIs for that.
 
-1. Perform scenario using CLI and take note of all locators and actions. You'll need those locators to request thier bounding boxes for highlight.
+1. Perform scenario using CLI and take note of all locators and actions. You'll need those locators to request their bounding boxes for highlight.
 2. Create a file with the intended script for video (below). Use pressSequentially w/ delay for nice typing, make reasonable pauses.
-3. Use playwright-cli run-code --file your-script.js
+3. Use playwright-cli run-code --filename your-script.js
 
 **Important**: Overlays are `pointer-events: none` — they do not interfere with page interactions. You can safely keep sticky overlays visible while clicking, filling, or performing any actions on the page.