メニュー
Browser automation with Claude in Chrome. Use this skill for web app testing, debugging with console logs, form automation, data extraction, multi-site workflows, and recording browser interactions as GIFs. Requires Chrome extension.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
| name | claude-chrome |
| description | Browser automation with Claude in Chrome. Use this skill for web app testing, debugging with console logs, form automation, data extraction, multi-site workflows, and recording browser interactions as GIFs. Requires Chrome extension. |
Automate browser tasks, test web applications, debug with console logs, and interact with authenticated web apps directly from Claude Code.
Before using browser automation:
--chrome flag or /chrome enabled/chrome to verify connection status# Get current tabs
Use tabs_context_mcp first to see available tabs
# Create new tab for task
Use tabs_create_mcp to create fresh tab
# Navigate to URL
Use navigate tool with tabId
# Read page content
- read_page: Get accessibility tree of elements
- find: Search for elements by natural language
- get_page_text: Extract raw text content
# Interact with elements
- computer (click, type, scroll): Mouse/keyboard actions
- form_input: Set form field values
- javascript_tool: Execute custom JS
# Read console messages
read_console_messages with pattern filter
# Monitor network requests
read_network_requests with urlPattern filter
# Start recording
gif_creator action="start_recording"
# Take screenshot (captures frame)
computer action="screenshot"
# Stop and export
gif_creator action="stop_recording"
gif_creator action="export" download=true
1. tabs_context_mcp → get tab context
2. navigate → go to localhost:PORT
3. read_page filter="interactive" → find form elements
4. form_input → fill form fields
5. computer action="left_click" → submit
6. read_console_messages → check for errors
7. read_page → verify success state
1. navigate → go to page
2. read_console_messages pattern="error|warn"
3. Analyze errors
4. Fix code in terminal
5. navigate → refresh page
6. Verify fix
1. navigate → go to page
2. read_page → get DOM structure
3. javascript_tool → extract structured data
4. Save to local file
1. tabs_create_mcp → create tab for site 1
2. navigate → go to site 1
3. Extract/read data
4. tabs_create_mcp → create tab for site 2
5. navigate → go to site 2
6. Use data from site 1
1. gif_creator action="start_recording"
2. computer action="screenshot" (initial frame)
3. Perform actions (click, type, navigate)
4. computer action="screenshot" (between actions)
5. computer action="screenshot" (final frame)
6. gif_creator action="stop_recording"
7. gif_creator action="export" download=true filename="demo.gif"
| Tool | Purpose |
|---|---|
tabs_context_mcp | Get available tabs (call first!) |
tabs_create_mcp | Create new empty tab |
navigate | Go to URL or back/forward |
read_page | Get accessibility tree |
find | Find elements by description |
get_page_text | Extract text content |
form_input | Set form field values |
computer | Click, type, scroll, screenshot |
javascript_tool | Execute JS in page |
read_console_messages | Read console output |
read_network_requests | Monitor network |
resize_window | Change window size |
gif_creator | Record/export GIFs |
upload_image | Upload images to forms |
shortcuts_list | List saved workflows |
shortcuts_execute | Run saved workflow |
tabs_context_mcp first - Required to get valid tab IDscomputer action="wait" for page loadpattern parameter| Issue | Solution |
|---|---|
| Tab not found | Call tabs_context_mcp to get fresh IDs |
| Actions not working | Check for modal dialogs, try new tab |
| Console empty | Refresh page after enabling tool |
| Extension not detected | Restart Chrome, run /chrome |
User: Test the signup form on localhost:8080
Claude:
1. Get tab context
2. Create new tab
3. Navigate to localhost:8080/signup
4. Wait 2 seconds
5. Find "email" input
6. Enter invalid email "notanemail"
7. Click submit button
8. Read page for error message
9. Report findings
Cloudflare platform hub — Workers, Pages, Wrangler CLI, D1/R2/KV, Durable Objects, Workers AI, Agents SDK, AI Gateway, Vectorize, Workflows, Tunnel, WAF, Terraform/Pulumi, and production Workers best practices. Use whenever the user mentions Cloudflare, Workers, wrangler, edge functions, Durable Objects, AI agents on Workers, `@cloudflare/workers-types`, `wrangler.jsonc`, Hyperdrive, or iPix Cloudflare tasks under `tasks/cloudflare/` — even if they do not say "Cloudflare" explicitly. NOT for Cloudinary media (→ cloudinary) or Supabase Postgres/RLS (→ ipix-supabase).
iPix / FashionOS domain hub. Routes to the fashion shoot-production toolkit and operator platform skills. Use for garment/product shoots, shot lists, lighting/call sheets, or iPix-specific platform workflows.
Five-phase orchestrator for iPix / FashionOS Linear team IPI — plan, research, implement, test, ship (worktrees, verify matrix, PR workflow, Linear state). Use whenever implementing or shipping IPI-NNN, wiring plans in docs/linear/issues, forensic verify before Done, MVP/P0 queue from tasks/plan/todo.md, multi-file platform work across app/supabase/edge, or user says "implement IPI-", "ship IPI-", "/task IPI", "close out Linear", "next P0 task", "forensic verify", "wiring plan", "open PR with verify". Always use for multi-step iPix delivery. Do NOT use for one-line typo fixes, explain-only questions, isolated copilotkit/ supabase/migration/lean/release-notes tasks without full lifecycle, or non-iPix repos.
Draft a changelog.md entry from git log + closed Linear IPI issues since the last entry. Use after a batch of commits lands or before tagging a release, when you need human-readable release notes rather than the /release gate checklist (which checks readiness, not prose). Triggers: "write release notes", "update the changelog", "draft changelog entry", "summarize what shipped". Do NOT use for the pre-merge gate check — that's `/release`.
Set up and operate git worktrees for isolated, parallel development — running multiple branches or Claude sessions at once without stashing or branch-switching, reviewing a PR while developing, comparing implementations side by side, or giving a risky change its own clean checkout. Use this whenever the user mentions worktrees, "isolated workspace", "parallel branches", "work on two things at once", `git worktree`, `--worktree`, or before executing a multi-step implementation plan that should not touch the current working tree. Also use when you (the agent) need an isolated checkout to make file changes that must not collide with the user's working tree.
Mastra framework: docs lookup (links.md, mastraDocs MCP, embedded docs), agents, workflows, streaming, browser, tools, memory, RAG, processors, CopilotKit guide. Verify from installed docs — never trust training-data APIs. NOT for: product intent routing (mastra-routing), Managed Agents API harness (mde-agents), non-Mastra frameworks. Load when editing src/mastra/**, Mastra tools/workflows, memory, streaming/events, browser automation, or Mastra doc URLs.