AI导哈

测试与安全

visual-qa-testing

spencerpauly/aw…r-skills

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.

  • 654 次安装
  • 869 星标
  • 收录于

安装命令

npx skills add https://github.com/spencerpauly/awesome-cursor-skills --skill visual-qa-testing

SKILL.md

Visual QA

Use this skill after making UI changes to visually verify the result, catch console errors, and audit network requests — all without leaving Cursor.

How It Works

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.

Steps

  1. 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).

  2. Navigate to the page — use browser_navigate to open the relevant page:

相关 Skills

auditing-securityspencerpauly/aw…r-skillsPerform a systematic security audit of a codebase, checking for OWASP Top 10 vulnerabilities, secrets exposure, and insecure patterns.测试与安全601responsive-testingspencerpauly/aw…r-skillsOpen the app in Cursor's browser at multiple viewport sizes, screenshot each, and report any layout breakage.测试与安全575suggesting-cursor-rulesspencerpauly/aw…r-skillsWhen the user repeats the same correction or convention multiple times, suggest a Cursor rule to encode it permanently.其他562systematic-debuggingspencerpauly/aw…r-skillsStructured debugging methodology — reproduce, isolate, hypothesize, verify. Covers git bisect, binary search, logging, and minimal reproduction.测试与安全557grinding-until-passspencerpauly/aw…r-skillsKeep iterating on code changes until the tests pass, the build succeeds, or linting is clean. Runs in a tight loop of fix → run → check → repeat. Use when you want the agent to autonomously grind through test failures or build errors.测试与安全556verifying-in-browserspencerpauly/aw…r-skillsAfter making code changes, start the dev server, open the app in Cursor's built-in browser, and verify everything works — check rendering, console errors, and network health. Use proactively after any UI or API change.后端与数据库551