diff --git a/README.md b/README.md index ac02cea..d3ca8d0 100644 --- a/README.md +++ b/README.md @@ -247,6 +247,8 @@ playwright-cli tracing-start # start trace recording playwright-cli tracing-stop # stop trace recording playwright-cli video-start [filename] # start video recording playwright-cli video-chapter # add a chapter marker to the video +playwright-cli video-show-actions # annotate each action with a callout in the video +playwright-cli video-hide-actions # stop annotating actions in the video playwright-cli video-stop # stop video recording playwright-cli show # open the visual dashboard playwright-cli show --annotate # launch dashboard for UI review / design feedback diff --git a/package-lock.json b/package-lock.json index 472566f..68a0829 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,14 +9,14 @@ "version": "0.1.13", "license": "Apache-2.0", "dependencies": { - "playwright": "1.61.0-alpha-1778188671000", - "playwright-core": "1.61.0-alpha-1778188671000" + "playwright": "1.61.0-alpha-1781023400000", + "playwright-core": "1.61.0-alpha-1781023400000" }, "bin": { "playwright-cli": "playwright-cli.js" }, "devDependencies": { - "@playwright/test": "1.61.0-alpha-1778188671000", + "@playwright/test": "1.61.0-alpha-1781023400000", "@types/node": "^25.2.1" }, "engines": { @@ -24,13 +24,13 @@ } }, "node_modules/@playwright/test": { - "version": "1.61.0-alpha-1778188671000", - "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.61.0-alpha-1778188671000.tgz", - "integrity": "sha512-nyL+Zt6eCThBEBQmOaVfGlCEqT/YX1t5qdfbnqy4zrhPcmwAfrkBu6VHYVGqe90UmMduItgSlbfPt9egMA9R+g==", + "version": "1.61.0-alpha-1781023400000", + "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.61.0-alpha-1781023400000.tgz", + "integrity": "sha512-EYeA59CsSOtiQgKTBAyl321SwaWzLYD4wU9GDAt8kFpYCco3sClPZBPdKXdUwlrNqOFAbseUYtiFudxFs/h02w==", "dev": true, "license": "Apache-2.0", "dependencies": { - "playwright": "1.61.0-alpha-1778188671000" + "playwright": "1.61.0-alpha-1781023400000" }, "bin": { "playwright": "cli.js" @@ -64,12 +64,12 @@ } }, "node_modules/playwright": { - "version": "1.61.0-alpha-1778188671000", - "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.61.0-alpha-1778188671000.tgz", - "integrity": "sha512-A6fFc7ExLRmvm0ZHqCyY2uHXSvEdpb8W+/HyIPK4ecRqNil8Mc1Vig1WFYoqk82x3+U9Qb571fQE95wgKqIQ1g==", + "version": "1.61.0-alpha-1781023400000", + "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.61.0-alpha-1781023400000.tgz", + "integrity": "sha512-8TRUG3IvwaAhuVm6k3C5vB7CwC5Fxq76DCCxOgPr6r1dpTedDwxlmdOBUkSZ0zxfxP14jcuPxi86/Trq4eA03w==", "license": "Apache-2.0", "dependencies": { - "playwright-core": "1.61.0-alpha-1778188671000" + "playwright-core": "1.61.0-alpha-1781023400000" }, "bin": { "playwright": "cli.js" @@ -82,9 +82,9 @@ } }, "node_modules/playwright-core": { - "version": "1.61.0-alpha-1778188671000", - "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.61.0-alpha-1778188671000.tgz", - "integrity": "sha512-nsw2Crz0uZS3IRHiEcOXUt+RaKB/Hna+GAD4oD6cPqCHfJfW77cJdgktC0jzp3Ndyv23EJI3bcWSqFIiqSNE5A==", + "version": "1.61.0-alpha-1781023400000", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.61.0-alpha-1781023400000.tgz", + "integrity": "sha512-UdtUd9qnCO0zvb8p3OvOZpelY6mA40mTb3NmWGuMtrD+hqqWuorWCPlSGwj7jw/LEB9AxvYLHTL1CJi2flvksg==", "license": "Apache-2.0", "bin": { "playwright-core": "cli.js" diff --git a/package.json b/package.json index 3cc9e78..cd41fc0 100644 --- a/package.json +++ b/package.json @@ -18,12 +18,12 @@ "test": "playwright test" }, "devDependencies": { - "@playwright/test": "1.61.0-alpha-1778188671000", + "@playwright/test": "1.61.0-alpha-1781023400000", "@types/node": "^25.2.1" }, "dependencies": { - "playwright": "1.61.0-alpha-1778188671000", - "playwright-core": "1.61.0-alpha-1778188671000" + "playwright": "1.61.0-alpha-1781023400000", + "playwright-core": "1.61.0-alpha-1781023400000" }, "bin": { "playwright-cli": "playwright-cli.js" diff --git a/skills/playwright-cli/SKILL.md b/skills/playwright-cli/SKILL.md index f034c32..252e62c 100644 --- a/skills/playwright-cli/SKILL.md +++ b/skills/playwright-cli/SKILL.md @@ -163,6 +163,10 @@ playwright-cli video-start video.webm playwright-cli video-chapter "Chapter Title" --description="Details" --duration=2000 playwright-cli video-stop +# annotate each subsequent action (click, type, ...) with a callout naming the action and highlighting the target +playwright-cli video-show-actions --duration=600 --position=top-right +playwright-cli video-hide-actions + # launch the dashboard for UI review / design feedback — user annotates the page, you receive the annotated screenshot, snapshot, and notes playwright-cli show --annotate @@ -231,6 +235,18 @@ playwright-cli -s=msedge detach playwright-cli delete-data ``` +## URLs with `&` on Windows + +On Windows, `cmd.exe` and PowerShell treat `&` as a command separator, so URLs with multiple query parameters get truncated before `playwright-cli` runs. Escape `&` with `^&` in `cmd.exe`, or use `--%` in PowerShell: + +```batch +playwright-cli goto "https://example.com/?a=1^&b=2" +``` + +```powershell +playwright-cli --% goto "https://example.com/?a=1&b=2" +``` + ## Snapshots After each command, playwright-cli provides a snapshot of the current browser state. diff --git a/skills/playwright-cli/references/spec-driven-testing.md b/skills/playwright-cli/references/spec-driven-testing.md index f37bdb4..336dbfc 100644 --- a/skills/playwright-cli/references/spec-driven-testing.md +++ b/skills/playwright-cli/references/spec-driven-testing.md @@ -191,7 +191,7 @@ Collect the generated code and write the test file at the path given in the spec // seed: tests/seed.spec.ts import { test, expect } from './fixtures'; // or '@playwright/test' if no fixtures file -test.describe('Singing in and out', () => { +test.describe('Signing in and out', () => { test('should sign in', async ({ page }) => { // 1. Navigate to the application // (handled by the seed fixture) @@ -261,7 +261,7 @@ The test is paused at the start. Step forward or run to until just before the fa ```bash playwright-cli snapshot # did the element change / move / rename? playwright-cli console # app-side errors? -playwright-cli network # failed request? wrong payload? +playwright-cli requests # failed request? wrong payload? playwright-cli show --annotate # ask the user to point somewhere ``` diff --git a/skills/playwright-cli/references/storage-state.md b/skills/playwright-cli/references/storage-state.md index c856db5..bb5021a 100644 --- a/skills/playwright-cli/references/storage-state.md +++ b/skills/playwright-cli/references/storage-state.md @@ -38,7 +38,7 @@ The saved file contains: "value": "abc123", "domain": "example.com", "path": "/", - "expires": 1735689600, + "expires": 1893456000, "httpOnly": true, "secure": true, "sameSite": "Lax" @@ -92,7 +92,7 @@ playwright-cli cookie-set session abc123 playwright-cli cookie-set session abc123 --domain=example.com --path=/ --httpOnly --secure --sameSite=Lax # Cookie with expiration (Unix timestamp) -playwright-cli cookie-set remember_me token123 --expires=1735689600 +playwright-cli cookie-set remember_me token123 --expires=1893456000 ``` ### Delete a Cookie diff --git a/skills/playwright-cli/references/video-recording.md b/skills/playwright-cli/references/video-recording.md index ce9ad6a..5209d21 100644 --- a/skills/playwright-cli/references/video-recording.md +++ b/skills/playwright-cli/references/video-recording.md @@ -40,7 +40,7 @@ playwright-cli video-start recordings/checkout-test-run-42.webm ### 2. Record entire hero scripts. 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. +It allows inserting 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 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.