菜单
Visually QA a web application by launching it in Cursor's built-in browser, taking screenshots, checking console errors, and auditing network requests. Use after making UI changes to verify they look correct.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | visual-qa-testing |
| description | Visually QA a web application by launching it in Cursor's built-in browser, taking screenshots, checking console errors, and auditing network requests. Use after making UI changes to verify they look correct. |
On-demand loading: Read this skill only when the task clearly matches the description above or trigger phrases below. Do not load for unrelated work.
Routing: This skill is for a broader exploratory QA sweep (screenshots, console, network, interaction passes). For post-change verification of your own edits, prefer verifying-in-browser.
Use this skill after making UI changes to visually verify the result, catch console errors, and audit network requests — all without leaving Cursor.
Cursor has a built-in browser (cursor-ide-browser MCP) that can navigate to URLs, take screenshots, read console messages, inspect network requests, and interact with page elements. This skill uses those tools to do a quick visual QA pass.
Ensure the dev server is running — check if there's already a terminal running the dev server. If not, start one in the background:
npm run dev
Wait for the server to be ready (watch for the "ready" or localhost URL in the output).
Navigate to the page — use browser_navigate to open the relevant page:
Tool: browser_navigate
Arguments: { "url": "http://localhost:3000", "take_screenshot_afterwards": true }
If the change is on a specific route, navigate directly to it (e.g., /settings, /dashboard).
Take a screenshot — capture the current state:
Tool: browser_take_screenshot
Arguments: { "fullPage": true }
Review the screenshot for visual issues: layout breaks, missing content, wrong colors, misaligned elements.
Check console for errors — look for JavaScript errors or warnings:
Tool: browser_console_messages
Report any errors, especially TypeError, ReferenceError, failed imports, or React hydration mismatches.
Audit network requests — check for failed API calls or unexpected requests:
Tool: browser_network_requests
Look for: 4xx/5xx status codes, CORS errors, excessively large responses, unnecessary duplicate requests.
Interact if needed — if the change involves interactive elements (buttons, forms, modals), use browser_click, browser_fill, or browser_hover to test the interaction, then take another screenshot to verify.
Report findings — summarize:
browser_snapshot before clicking elements to get the correct element refs.browser_resize to check different viewport sizes.browser_navigate with position: "side" to open the browser beside your code.Orchestrate continual learning by delegating transcript mining and AGENTS.md updates to the knowledge-synthesizer subagent. Use when asked to mine prior chats, maintain AGENTS.md, update learned preferences, or run the continual-learning loop.
Security-focused review of code diffs and PRs with surface classification and Semgrep on changed files. Use when reviewing pull requests, branch diffs, or validating security regressions before merge.
Live Notion session log (L4b) — create, incremental updates during work, finalize on CLOSE. Works on any Cursor project workspace.
Bootstrap a new project with Cursor-ready configuration: AGENTS.md, per-project .cursor/rules/project-conventions.mdc, and optional memory_bank/ scaffold. Use at project initialization, when starting a new repo, or when the user says "set up Cursor for this project" / "bootstrap this project" / "init project config".
Phase-1 repo reconnaissance as a standalone skill: stack detection, relevant files, validation commands from repo evidence, workflow hints, and risk flags. Use inside /scout, /ks-conductor pre-flight, or any read-only discovery before planning or implementation.
Validates phase outputs before advancing the SDLC. Defines expected artifacts per phase (intake, scout, plan, critic, build, test, review, document, close) and produces a clear PASS / CONDITIONAL / BLOCK verdict with gaps. Use at orchestrator or command phase boundaries, before expensive work, or when the user asks to verify a gate or "are we ready to proceed".