AgentSkillsCN

browser-testing

适用于测试 Web 应用、调试浏览器控制台错误、自动化表单交互或验证 UI 实现时。可用于本地测试、认证应用测试(Gmail、Notion)或录制演示 GIF。需 Chrome 扩展 1.0.36+、Claude Code 2.0.73+ 或付费计划。

SKILL.md
--- frontmatter
name: browser-testing
description: "Use when testing web applications, debugging browser console errors, automating form interactions, or verifying UI implementations. Load for localhost testing, authenticated app testing (Gmail, Notion), or recording demo GIFs. Requires Chrome extension 1.0.36+, Claude Code 2.0.73+, paid plan."
keywords: browser, chrome, testing, console, debug, forms, ui, gif, localhost

Browser Testing

Test and debug web applications via Chrome integration.

Prerequisites

RequirementMinimum
Chrome extension1.0.36+
Claude Code CLI2.0.73+
PlanPro/Team/Enterprise

Instructions

  1. Enable Chrome: claude --chrome or /chrome
  2. Get tab context: tabs_context_mcp
  3. Navigate: navigate to URL
  4. Interact: find, form_input, computer
  5. Verify: read_console_messages, read_page
  6. Evidence: computer(action="screenshot")

Quick Commands

bash
# Check for console errors
scripts/check-console-errors.sh TAB_ID

# Verify page loaded
scripts/verify-page-load.sh TAB_ID URL

# Run smoke test
scripts/smoke-test.sh URL

MCP Tools

ToolPurpose
tabs_context_mcpGet tab IDs (call first)
navigateGo to URL
computerClick, type, screenshot
findFind element by description
form_inputFill form fields
read_console_messagesDebug with pattern filter
read_pageGet DOM/accessibility tree
gif_creatorRecord interactions

References

FileLoad When
references/patterns.mdDesigning test scenarios
references/examples.mdNeed concrete examples