@willbooster/agent-skills 1.15.2 → 1.17.0

package/skills/playwright-cli/references/request-mocking.md

@@ -0,0 +1,87 @@
+# Request Mocking
+
+Intercept, mock, modify, and block network requests.
+
+## CLI Route Commands
+
+```bash
+# Mock with custom status
+bunx @playwright/cli@latest route "**/*.jpg" --status=404
+
+# Mock with JSON body
+bunx @playwright/cli@latest route "**/api/users" --body='[{"id":1,"name":"Alice"}]' --content-type=application/json
+
+# Mock with custom headers
+bunx @playwright/cli@latest route "**/api/data" --body='{"ok":true}' --header="X-Custom: value"
+
+# Remove headers from requests
+bunx @playwright/cli@latest route "**/*" --remove-header=cookie,authorization
+
+# List active routes
+bunx @playwright/cli@latest route-list
+
+# Remove a route or all routes
+bunx @playwright/cli@latest unroute "**/*.jpg"
+bunx @playwright/cli@latest unroute
+```
+
+## URL Patterns
+
+```
+**/api/users           - Exact path match
+**/api/*/details       - Wildcard in path
+**/*.{png,jpg,jpeg}    - Match file extensions
+**/search?q=*          - Match query parameters
+```
+
+## Advanced Mocking with run-code
+
+For conditional responses, request body inspection, response modification, or delays:
+
+### Conditional Response Based on Request
+
+```bash
+bunx @playwright/cli@latest run-code "async page => {
+  await page.route('**/api/login', route => {
+    const body = route.request().postDataJSON();
+    if (body.username === 'admin') {
+      route.fulfill({ body: JSON.stringify({ token: 'mock-token' }) });
+    } else {
+      route.fulfill({ status: 401, body: JSON.stringify({ error: 'Invalid' }) });
+    }
+  });
+}"
+```
+
+### Modify Real Response
+
+```bash
+bunx @playwright/cli@latest run-code "async page => {
+  await page.route('**/api/user', async route => {
+    const response = await route.fetch();
+    const json = await response.json();
+    json.isPremium = true;
+    await route.fulfill({ response, json });
+  });
+}"
+```
+
+### Simulate Network Failures
+
+```bash
+bunx @playwright/cli@latest run-code "async page => {
+  await page.route('**/api/offline', route => route.abort('internetdisconnected'));
+}"
+# Options: connectionrefused, timedout, connectionreset, internetdisconnected
+```
+
+### Delayed Response
+
+```bash
+bunx @playwright/cli@latest run-code "async page => {
+  await page.route('**/api/slow', async route => {
+    await new Promise(r => setTimeout(r, 3000));
+    route.fulfill({ body: JSON.stringify({ data: 'loaded' }) });
+  });
+}"
+```

package/skills/playwright-cli/references/running-code.md

@@ -0,0 +1,231 @@
+# Running Custom Playwright Code
+
+Use `run-code` to execute arbitrary Playwright code for advanced scenarios not covered by CLI commands.
+
+## Syntax
+
+```bash
+bunx @playwright/cli@latest run-code "async page => {
+  // Your Playwright code here
+  // Access page.context() for browser context operations
+}"
+```
+
+## Geolocation
+
+```bash
+# Grant geolocation permission and set location
+bunx @playwright/cli@latest run-code "async page => {
+  await page.context().grantPermissions(['geolocation']);
+  await page.context().setGeolocation({ latitude: 37.7749, longitude: -122.4194 });
+}"
+
+# Set location to London
+bunx @playwright/cli@latest run-code "async page => {
+  await page.context().grantPermissions(['geolocation']);
+  await page.context().setGeolocation({ latitude: 51.5074, longitude: -0.1278 });
+}"
+
+# Clear geolocation override
+bunx @playwright/cli@latest run-code "async page => {
+  await page.context().clearPermissions();
+}"
+```
+
+## Permissions
+
+```bash
+# Grant multiple permissions
+bunx @playwright/cli@latest run-code "async page => {
+  await page.context().grantPermissions([
+    'geolocation',
+    'notifications',
+    'camera',
+    'microphone'
+  ]);
+}"
+
+# Grant permissions for specific origin
+bunx @playwright/cli@latest run-code "async page => {
+  await page.context().grantPermissions(['clipboard-read'], {
+    origin: 'https://example.com'
+  });
+}"
+```
+
+## Media Emulation
+
+```bash
+# Emulate dark color scheme
+bunx @playwright/cli@latest run-code "async page => {
+  await page.emulateMedia({ colorScheme: 'dark' });
+}"
+
+# Emulate light color scheme
+bunx @playwright/cli@latest run-code "async page => {
+  await page.emulateMedia({ colorScheme: 'light' });
+}"
+
+# Emulate reduced motion
+bunx @playwright/cli@latest run-code "async page => {
+  await page.emulateMedia({ reducedMotion: 'reduce' });
+}"
+
+# Emulate print media
+bunx @playwright/cli@latest run-code "async page => {
+  await page.emulateMedia({ media: 'print' });
+}"
+```
+
+## Wait Strategies
+
+```bash
+# Wait for network idle
+bunx @playwright/cli@latest run-code "async page => {
+  await page.waitForLoadState('networkidle');
+}"
+
+# Wait for specific element
+bunx @playwright/cli@latest run-code "async page => {
+  await page.locator('.loading').waitFor({ state: 'hidden' });
+}"
+
+# Wait for function to return true
+bunx @playwright/cli@latest run-code "async page => {
+  await page.waitForFunction(() => window.appReady === true);
+}"
+
+# Wait with timeout
+bunx @playwright/cli@latest run-code "async page => {
+  await page.locator('.result').waitFor({ timeout: 10000 });
+}"
+```
+
+## Frames and Iframes
+
+```bash
+# Work with iframe
+bunx @playwright/cli@latest run-code "async page => {
+  const frame = page.locator('iframe#my-iframe').contentFrame();
+  await frame.locator('button').click();
+}"
+
+# Get all frames
+bunx @playwright/cli@latest run-code "async page => {
+  const frames = page.frames();
+  return frames.map(f => f.url());
+}"
+```
+
+## File Downloads
+
+```bash
+# Handle file download
+bunx @playwright/cli@latest run-code "async page => {
+  const downloadPromise = page.waitForEvent('download');
+  await page.getByRole('link', { name: 'Download' }).click();
+  const download = await downloadPromise;
+  await download.saveAs('./downloaded-file.pdf');
+  return download.suggestedFilename();
+}"
+```
+
+## Clipboard
+
+```bash
+# Read clipboard (requires permission)
+bunx @playwright/cli@latest run-code "async page => {
+  await page.context().grantPermissions(['clipboard-read']);
+  return await page.evaluate(() => navigator.clipboard.readText());
+}"
+
+# Write to clipboard
+bunx @playwright/cli@latest run-code "async page => {
+  await page.evaluate(text => navigator.clipboard.writeText(text), 'Hello clipboard!');
+}"
+```
+
+## Page Information
+
+```bash
+# Get page title
+bunx @playwright/cli@latest run-code "async page => {
+  return await page.title();
+}"
+
+# Get current URL
+bunx @playwright/cli@latest run-code "async page => {
+  return page.url();
+}"
+
+# Get page content
+bunx @playwright/cli@latest run-code "async page => {
+  return await page.content();
+}"
+
+# Get viewport size
+bunx @playwright/cli@latest run-code "async page => {
+  return page.viewportSize();
+}"
+```
+
+## JavaScript Execution
+
+```bash
+# Execute JavaScript and return result
+bunx @playwright/cli@latest run-code "async page => {
+  return await page.evaluate(() => {
+    return {
+      userAgent: navigator.userAgent,
+      language: navigator.language,
+      cookiesEnabled: navigator.cookieEnabled
+    };
+  });
+}"
+
+# Pass arguments to evaluate
+bunx @playwright/cli@latest run-code "async page => {
+  const multiplier = 5;
+  return await page.evaluate(m => document.querySelectorAll('li').length * m, multiplier);
+}"
+```
+
+## Error Handling
+
+```bash
+# Try-catch in run-code
+bunx @playwright/cli@latest run-code "async page => {
+  try {
+    await page.getByRole('button', { name: 'Submit' }).click({ timeout: 1000 });
+    return 'clicked';
+  } catch (e) {
+    return 'element not found';
+  }
+}"
+```
+
+## Complex Workflows
+
+```bash
+# Login and save state
+bunx @playwright/cli@latest run-code "async page => {
+  await page.goto('https://example.com/login');
+  await page.getByRole('textbox', { name: 'Email' }).fill('user@example.com');
+  await page.getByRole('textbox', { name: 'Password' }).fill('secret');
+  await page.getByRole('button', { name: 'Sign in' }).click();
+  await page.waitForURL('**/dashboard');
+  await page.context().storageState({ path: 'auth.json' });
+  return 'Login successful';
+}"
+
+# Scrape data from multiple pages
+bunx @playwright/cli@latest run-code "async page => {
+  const results = [];
+  for (let i = 1; i <= 3; i++) {
+    await page.goto(\`https://example.com/page/\${i}\`);
+    const items = await page.locator('.item').allTextContents();
+    results.push(...items);
+  }
+  return results;
+}"
+```

package/skills/playwright-cli/references/session-management.md

@@ -0,0 +1,170 @@
+# Browser Session Management
+
+Run multiple isolated browser sessions concurrently with state persistence.
+
+## Named Browser Sessions
+
+Use `-s` flag to isolate browser contexts:
+
+```bash
+# Browser 1: Authentication flow
+bunx @playwright/cli@latest -s=auth open https://app.example.com/login
+
+# Browser 2: Public browsing (separate cookies, storage)
+bunx @playwright/cli@latest -s=public open https://example.com
+
+# Commands are isolated by browser session
+bunx @playwright/cli@latest -s=auth fill e1 "user@example.com"
+bunx @playwright/cli@latest -s=public snapshot
+```
+
+## Browser Session Isolation Properties
+
+Each browser session has independent:
+
+- Cookies
+- LocalStorage / SessionStorage
+- IndexedDB
+- Cache
+- Browsing history
+- Open tabs
+
+## Browser Session Commands
+
+```bash
+# List all browser sessions
+bunx @playwright/cli@latest list
+
+# Stop a browser session (close the browser)
+bunx @playwright/cli@latest close                # stop the default browser
+bunx @playwright/cli@latest -s=mysession close   # stop a named browser
+
+# Stop all browser sessions
+bunx @playwright/cli@latest close-all
+
+# Forcefully kill all daemon processes (for stale/zombie processes)
+bunx @playwright/cli@latest kill-all
+
+# Delete browser session user data (profile directory)
+bunx @playwright/cli@latest delete-data                # delete default browser data
+bunx @playwright/cli@latest -s=mysession delete-data   # delete named browser data
+```
+
+## Environment Variable
+
+Set a default browser session name via environment variable:
+
+```bash
+export PLAYWRIGHT_CLI_SESSION="mysession"
+bunx @playwright/cli@latest open example.com  # Uses "mysession" automatically
+```
+
+## Common Patterns
+
+### Concurrent Scraping
+
+```bash
+#!/bin/bash
+# Scrape multiple sites concurrently
+
+# Start all browsers
+bunx @playwright/cli@latest -s=site1 open https://site1.com &
+bunx @playwright/cli@latest -s=site2 open https://site2.com &
+bunx @playwright/cli@latest -s=site3 open https://site3.com &
+wait
+
+# Take snapshots from each
+bunx @playwright/cli@latest -s=site1 snapshot
+bunx @playwright/cli@latest -s=site2 snapshot
+bunx @playwright/cli@latest -s=site3 snapshot
+
+# Cleanup
+bunx @playwright/cli@latest close-all
+```
+
+### A/B Testing Sessions
+
+```bash
+# Test different user experiences
+bunx @playwright/cli@latest -s=variant-a open "https://app.com?variant=a"
+bunx @playwright/cli@latest -s=variant-b open "https://app.com?variant=b"
+
+# Compare
+bunx @playwright/cli@latest -s=variant-a screenshot
+bunx @playwright/cli@latest -s=variant-b screenshot
+```
+
+### Persistent Profile
+
+By default, browser profile is kept in memory only. Use `--persistent` flag on `open` to persist the browser profile to disk:
+
+```bash
+# Use persistent profile (auto-generated location)
+bunx @playwright/cli@latest open https://example.com --persistent
+
+# Use persistent profile with custom directory
+bunx @playwright/cli@latest open https://example.com --profile=/path/to/profile
+```
+
+## Default Browser Session
+
+When `-s` is omitted, commands use the default browser session:
+
+```bash
+# These use the same default browser session
+bunx @playwright/cli@latest open https://example.com
+bunx @playwright/cli@latest snapshot
+bunx @playwright/cli@latest close  # Stops default browser
+```
+
+## Browser Session Configuration
+
+Configure a browser session with specific settings when opening:
+
+```bash
+# Open with config file
+bunx @playwright/cli@latest open https://example.com --config=.playwright/my-cli.json
+
+# Open with specific browser
+bunx @playwright/cli@latest open https://example.com --browser=firefox
+
+# Open in headed mode
+bunx @playwright/cli@latest open https://example.com --headed
+
+# Open with persistent profile
+bunx @playwright/cli@latest open https://example.com --persistent
+```
+
+## Best Practices
+
+### 1. Name Browser Sessions Semantically
+
+```bash
+# GOOD: Clear purpose
+bunx @playwright/cli@latest -s=github-auth open https://github.com
+bunx @playwright/cli@latest -s=docs-scrape open https://docs.example.com
+
+# AVOID: Generic names
+bunx @playwright/cli@latest -s=s1 open https://github.com
+```
+
+### 2. Always Clean Up
+
+```bash
+# Stop browsers when done
+bunx @playwright/cli@latest -s=auth close
+bunx @playwright/cli@latest -s=scrape close
+
+# Or stop all at once
+bunx @playwright/cli@latest close-all
+
+# If browsers become unresponsive or zombie processes remain
+bunx @playwright/cli@latest kill-all
+```
+
+### 3. Delete Stale Browser Data
+
+```bash
+# Remove old browser data to free disk space
+bunx @playwright/cli@latest -s=oldsession delete-data
+```