$ loading_
Use this skill to automate visual testing and UI interaction verification using browser automation after deploying features.
复制安装指令,让 AI 自动完成配置 · 推荐新手
请帮我安装 askskill 上的 "browser-qa" 技能: 1. 下载 https://raw.githubusercontent.com/affaan-m/ECC/main/skills/browser-qa/SKILL.md 2. 保存为 ~/.claude/skills/browser-qa/SKILL.md 3. 装好后重载技能,告诉我可以用了
Uses the browser automation MCP (claude-in-chrome, Playwright, or Puppeteer) to interact with live pages like a real user.
1. Navigate to target URL
2. Check for console errors (filter noise: analytics, third-party)
3. Verify no 4xx/5xx in network requests
4. Screenshot above-the-fold on desktop + mobile viewport
5. Check Core Web Vitals: LCP < 2.5s, CLS < 0.1, INP < 200ms
1. Click every nav link — verify no dead links
2. Submit forms with valid data — verify success state
3. Submit forms with invalid data — verify error state
4. Test auth flow: login → protected page → logout
5. Test critical user journeys (checkout, onboarding, search)
1. Screenshot key pages at 3 breakpoints (375px, 768px, 1440px)
2. Compare against baseline screenshots (if stored)
3. Flag layout shifts > 5px, missing elements, overflow
4. Check dark mode if applicable
1. Run axe-core or equivalent on each page
2. Flag WCAG AA violations (contrast, labels, focus order)
3. Verify keyboard navigation works end-to-end
4. Check screen reader landmarks
## QA Report — [URL] — [timestamp]
### Smoke Test
- Console errors: 0 critical, 2 warnings (analytics noise)
- Network: all 200/304, no failures
- Core Web Vitals: LCP 1.2s ✓, CLS 0.02 ✓, INP 89ms ✓
### Interactions
- [✓] Nav links: 12/12 working
- [✗] Contact form: missing error state for invalid email
- [✓] Auth flow: login/logout working
### Visual
- [✗] Hero section overflows on 375px viewport
- [✓] Dark mode: all pages consistent
### Accessibility
- 2 AA violations: missing alt text on hero image, low contrast on footer links
### Verdict: SHIP WITH FIXES (2 issues, 0 blockers)
Works with any browser MCP:
mChild__claude-in-chrome__* tools (preferred — uses your actual Chrome)mcp__browserbase__*Pair with /canary-watch for post-deploy monitoring.
帮助处理退货授权、验收判定、退款防欺诈与保修索赔流程。
帮助开发者使用 Bun 进行运行、打包、测试与依赖管理,并评估替代 Node 的时机。
帮助开发者在 Node.js 与 TypeScript 中正确使用以太坊 Keccak-256 哈希。
提供 Nuxt 4 的 SSR 安全、性能优化与数据获取最佳实践模式
通过 fal.ai 一站式生成图片、视频与音频内容,满足多模态创作需求
帮助你设计 Quarkus 3 后端架构模式,覆盖消息、REST、数据访问与异步处理。