化瀏覽器 QA 與缺陷修復(fù)閉環(huán))
gstack /qa 工作流全解Test → Fix → Verify 的自動(dòng)化瀏覽器 QA 與缺陷修復(fù)閉環(huán)【免費(fèi)下載鏈接】gstackUse Garry Tans exact Claude Code setup: 23 opinionated tools that serve as CEO, Designer, Eng Manager, Release Manager, Doc Engineer, and QA項(xiàng)目地址: https://gitcode.com/GitHub_Trending/gs/gstack本文以 gstack 倉(cāng)庫(kù)的 qa/SKILL.md 為主體完整拆解 gstack 的 QA 技能從觸發(fā)詞、三檔測(cè)試層級(jí)Quick / Standard / Exhaustive、四種運(yùn)行模式diff-aware / Full / Quick / Regression到 11 個(gè)階段的 Test → Fix → Verify 工作流、健康分加權(quán)評(píng)分標(biāo)準(zhǔn)、缺陷分級(jí)分類(lèi)法、原子提交修復(fù)循環(huán)、回歸測(cè)試生成與 WTF-likelihood 自我調(diào)節(jié)機(jī)制。讀完你可以理解一個(gè)AI QA 工程師如何在真實(shí)瀏覽器中像用戶(hù)一樣測(cè)試 Web 應(yīng)用、為每個(gè)修復(fù)做原子提交與前后截圖證據(jù)、并輸出可放入 PR 描述的 ship-readiness 報(bào)告。一、技能定位QA 工程師 缺陷修復(fù)工程師的雙重角色gstack 是 Garry Tan 的 Claude Code 工作流配置集其中 23 個(gè)技能分別扮演 CEO、設(shè)計(jì)師、工程經(jīng)理、發(fā)布經(jīng)理、文檔工程師和 QA 等角色。/qa是其中的 QA 技能其 SKILL.md 頭部qa/SKILL.md聲明了元信息name: qaversion: 2.0.0preamble-tier: 4description: Systematically QA test a web application and fix bugs found. (gstack)允許的工具Bash、Read、Write、Edit、Glob、Grep、AskUserQuestion、WebSearch觸發(fā)詞qa test this、find bugs on site、test the site語(yǔ)音別名包括 quality check、test the app、run QA。技能正文開(kāi)宗明義qa/SKILL.mdYou are a QA engineer AND a bug-fix engineer. Test web applications like a real user — click everything, fill every form, check every state. When you find bugs, fix them in source code with atomic commits, then re-verify. Produce a structured report with before/after evidence.也就是說(shuō)/qa不是只測(cè)不改的報(bào)告工具而是一個(gè)完整閉環(huán)測(cè)試 → 發(fā)現(xiàn)缺陷 → 源碼級(jí)最小修復(fù) → 原子提交 → 瀏覽器復(fù)測(cè)驗(yàn)證 → 結(jié)構(gòu)化報(bào)告。如果只需要報(bào)告而不修改代碼應(yīng)使用配套的 qa-only 技能just report bugs、test but dont fix 觸發(fā)。二、調(diào)用入口與參數(shù)解析/qa啟動(dòng)時(shí)先解析用戶(hù)請(qǐng)求中的 6 個(gè)參數(shù)qa/SKILL.md參數(shù)默認(rèn)值覆蓋示例Target URL自動(dòng)探測(cè)或必填https://myapp.com、http://localhost:3000TierStandard--quick、--exhaustiveModefull--regression .gstack/qa-reports/baseline.jsonOutput dir.gstack/qa-reports/Output to /tmp/qaScope全應(yīng)用或 diff 范圍Focus on the billing pageAuthNoneSign in to userexample.com、Import cookies from cookies.json三檔 Tier 直接決定哪些嚴(yán)重級(jí)別的缺陷會(huì)被修復(fù)Quick只修 critical highStandard再加 medium默認(rèn)檔Exhaustive連 low / 裝飾性問(wèn)題也一并修。另外有一個(gè)自動(dòng)行為如果用戶(hù)沒(méi)給 URL 且當(dāng)前在 feature 分支上自動(dòng)進(jìn)入diff-aware 模式——這是最常見(jiàn)的場(chǎng)景即開(kāi)發(fā)者剛在分支上寫(xiě)完代碼想驗(yàn)證它是否真的能工作。啟動(dòng)前還有兩項(xiàng)環(huán)境檢查1. CDP 模式檢測(cè)——檢查 browse 服務(wù)是否連接到用戶(hù)真實(shí)瀏覽器$B status 2/dev/null | grep -q Mode: cdp echo CDP_MODEtrue || echo CDP_MODEfalse若CDP_MODEtrue則跳過(guò) cookie 導(dǎo)入提示、跳過(guò) user-agent 覆蓋、跳過(guò)無(wú)頭檢測(cè)補(bǔ)丁——因?yàn)檎鎸?shí)瀏覽器里已有真實(shí)的登錄會(huì)話和 user-agent。2. 干凈工作樹(shù)檢查——/qa的每個(gè)修復(fù)都要獨(dú)立原子提交所以要求git status --porcelain輸出非空工作樹(shù)臟時(shí)立即 STOP 并用 AskUserQuestion 提供三個(gè)選項(xiàng)A) 先提交當(dāng)前改動(dòng)再開(kāi)始 QA推薦未提交的工作應(yīng)保留為提交B) stash 后 QA 完成再 popC) 中止用戶(hù)自行清理。三、browse 二進(jìn)制與測(cè)試框架引導(dǎo)3.1 定位 browse 瀏覽器引擎/qa依賴(lài) gstack 的 browse 工具持久化 headless Chromium首次調(diào)用自動(dòng)啟動(dòng)約 3 秒之后每條命令約 100mscookie / 標(biāo)簽頁(yè) / 登錄態(tài)在調(diào)用間持久詳見(jiàn) browse/SKILL.md。定位方式_ROOT$(git rev-parse --show-toplevel 2/dev/null) B [ -n $_ROOT ] [ -x $_ROOT/.claude/skills/gstack/browse/dist/browse ] B$_ROOT/.claude/skills/gstack/browse/dist/browse [ -z $B ] B$HOME/.claude/skills/gstack/browse/dist/browse if [ -x $B ]; then echo READY: $B else echo NEEDS_SETUP fi若為NEEDS_SETUP先征得用戶(hù)同意one-time build (~10 seconds)然后cd SKILL_DIR ./setup若機(jī)器上沒(méi)有bun會(huì)下載固定版本 1.3.10 的安裝腳本并校驗(yàn) SHA-256bab8acfb046aac8c72407bdcce903957665d655d7acaa3e11c7c4616beae68dd不匹配則報(bào)錯(cuò)退出。這段邏輯與 browse/SKILL.md 的 SETUP 小節(jié)完全一致說(shuō)明/qa直接復(fù)用了 browse 技能的構(gòu)建路徑。3.2 測(cè)試框架引導(dǎo)Test Framework Bootstrap修復(fù)循環(huán)要寫(xiě)回歸測(cè)試所以/qa在 Setup 階段先確認(rèn)項(xiàng)目有沒(méi)有可用的測(cè)試命令。規(guī)則的核心是證據(jù)不盲跑先讀項(xiàng)目的 CLAUDE.md以及 TESTING.md。如果其中已寫(xiě)明測(cè)試命令直接采用跳過(guò)全部檢測(cè)與引導(dǎo)。否則運(yùn)行一組 marker 探測(cè)腳本qa/SKILL.md識(shí)別運(yùn)行時(shí)生態(tài)與既有測(cè)試證據(jù)# Definitive ecosystem markers (presence ecosystem, NOT a command to run) [ -f manage.py ] echo RUNTIME:python FRAMEWORK:django MARKER:manage.py { [ -f pyproject.toml ] || [ -f pytest.ini ] || [ -f tox.ini ] || [ -f setup.cfg ] || [ -f requirements.txt ]; } echo RUNTIME:python [ -f Gemfile ] || [ -f Rakefile ] || [ -f .rspec ] echo RUNTIME:ruby [ -f package.json ] echo RUNTIME:node [ -f go.mod ] echo RUNTIME:go [ -f Cargo.toml ] echo RUNTIME:rust [ -f composer.json ] echo RUNTIME:php [ -f mix.exs ] echo RUNTIME:elixir [ -f pom.xml ] echo RUNTIME:jvm BUILD:maven { [ -f build.gradle ] || [ -f build.gradle.kts ]; } echo RUNTIME:jvm BUILD:gradle # 已有測(cè)試路徑配置文件、聲明的腳本、測(cè)試文件 ls jest.config.* vitest.config.* playwright.config.* .rspec pytest.ini tox.ini phpunit.xml* 2/dev/null [ -f package.json ] grep -q test[[:space:]]*: package.json echo SCRIPT:package.json test [ -f Makefile ] grep -qE ^(test|check): Makefile echo TARGET:make test git ls-files | grep -cE (^|/)(tests?|spec|__tests__)/|(^|/)tests?\.py$|...|\.(test|spec)\.[jt]sx?$|_spec\.rb$|Test\.(java|kt)$ | sed s/^/TESTFILES:/ # Rust 單元測(cè)試在 src/ 內(nèi)部?jī)H靠文件名會(huì)漏掉 [ -f Cargo.toml ] git grep -lF #[test] -- src /dev/null 21 echo TESTS:rust in-source # 用戶(hù)此前拒絕過(guò)引導(dǎo) [ -f .gstack/no-test-bootstrap ] echo BOOTSTRAP_DECLINED文檔特別強(qiáng)調(diào)兩個(gè)易錯(cuò)點(diǎn)marker 只是證據(jù)不是可以盲跑的命令在一個(gè)從未用過(guò)該 runner 的項(xiàng)目上探測(cè)性執(zhí)行會(huì)大聲失敗且毫無(wú)信息量沒(méi)有配置文件不等于沒(méi)有測(cè)試——Django 的測(cè)試在app/tests.py、Go 在*_test.go、Rust 在src/內(nèi)的#[test]塊python manage.py test全綠就是已測(cè)試項(xiàng)目絕不引導(dǎo)安裝第二套框架。發(fā)現(xiàn)任何既有測(cè)試證據(jù)配置文件、聲明的 test 腳本、TESTFILES:計(jì)數(shù)非零、TESTS:rust in-source不引導(dǎo)改為通過(guò) AskUserQuestion 把候選命令給用戶(hù)確認(rèn)并持久化到 CLAUDE.md 的## Testing段之后不再詢(xún)問(wèn)再讀 2-3 個(gè)既有測(cè)試文件學(xué)習(xí)命名、導(dǎo)入、斷言風(fēng)格。完全沒(méi)有生態(tài) marker問(wèn)用戶(hù)語(yǔ)言棧Node / Ruby / Python / Go / Rust / PHP / Elixir / 不需要測(cè)試。選不需要?jiǎng)t寫(xiě).gstack/no-test-bootstrap標(biāo)記文件。有生態(tài)但零測(cè)試證據(jù) → 執(zhí)行引導(dǎo)步驟 B2–B8B2 研究最佳實(shí)踐用 WebSearch 查[runtime] best test framework 2025 2026不可用時(shí)回落到內(nèi)置推薦表Ruby/Rails → minitest fixtures capybaraNode.js → vitest testing-libraryNext.js → vitest testing-library/react playwrightPython → pytest pytest-covGo → stdlib testing testifyRust → cargo test mockallPHP → phpunit mockeryElixir → ExUnit ex_machina 等。B3 框架選擇AskUserQuestion 給出 A) 首選方案含理由與包清單、B) 替代方案、C) 跳過(guò)。B4 安裝配置裝包、建最小配置、建目錄、寫(xiě)一個(gè)示例測(cè)試驗(yàn)證 setup安裝失敗則調(diào)試一次仍失敗就git checkout --回滾并繼續(xù)無(wú)測(cè)試流程。B4.5 首批真實(shí)測(cè)試git log --since30.days --name-only --format | sort | uniq -c | sort -rn | head -10找近期改動(dòng)文件按風(fēng)險(xiǎn)排序錯(cuò)誤處理器 帶條件分支的業(yè)務(wù)邏輯 API 端點(diǎn) 純函數(shù)每個(gè)文件寫(xiě)一個(gè)有真實(shí)斷言的測(cè)試禁止expect(x).toBeDefined()這類(lèi)空斷言通過(guò)則保留失敗修一次仍失敗就靜默刪除。測(cè)試文件里永遠(yuǎn)不引入密鑰與憑證。B5 驗(yàn)證跑完整測(cè)試套件失敗則調(diào)試一次仍失敗回滾全部引導(dǎo)改動(dòng)。B5.5 CI 流水線檢測(cè).github/等 CI providerGitHub Actions 則生成.github/workflows/test.ymlruns-on: ubuntu-latest、對(duì)應(yīng) runtimes 的 setup action、B5 驗(yàn)證過(guò)的測(cè)試命令、push pull_request 觸發(fā)非 GitHub CI 則跳過(guò)并提示手動(dòng)添加。B6 寫(xiě) TESTING.md哲學(xué)100% test coverage is the key to great vibe coding、框架與版本、已驗(yàn)證的運(yùn)行命令、Unit/Integration/Smoke/E2E 分層、命名與 setup/teardown 約定。已存在則更新而非覆蓋。B7 更新 CLAUDE.md追加## Testing段已有則跳過(guò)寫(xiě)明運(yùn)行命令、目錄以及測(cè)試預(yù)期新函數(shù)配測(cè)試、修 bug 配回歸測(cè)試、加錯(cuò)誤處理配觸發(fā)該錯(cuò)誤的測(cè)試、加 if/else 時(shí)兩條路徑都測(cè)、絕不提交讓既有測(cè)試變紅的代碼。B8 提交git commit -m chore: bootstrap test framework ({framework name})。最后創(chuàng)建輸出目錄mkdir -p .gstack/qa-reports/screenshots。四、四種運(yùn)行模式/qa支持四種模式qa/SKILL.mdTier 控制修什么Mode 控制測(cè)什么4.1 Diff-aware 模式feature 分支 無(wú) URL 時(shí)自動(dòng)啟用主模式分析分支 diffgit diff main...HEAD --name-only git log main..HEAD --oneline從改動(dòng)文件反推受影響的頁(yè)面/路由controller/route 文件 → 它們服務(wù)的 URL 路徑view/template/component → 渲染它們的頁(yè)面model/service → 使用這些 model 的頁(yè)面查引用它的 controllerCSS → 引入該樣式表的頁(yè)面API 端點(diǎn) → 直接用$B js await fetch(/api/...)測(cè)試靜態(tài)頁(yè)面 → 直接導(dǎo)航。若 diff 推不出任何明確頁(yè)面不跳過(guò)瀏覽器測(cè)試——回落到 Quick 模式首頁(yè) 頂部 5 個(gè)導(dǎo)航目標(biāo) 控制臺(tái)錯(cuò)誤 發(fā)現(xiàn)的交互元素因?yàn)楹蠖?、配置與基礎(chǔ)設(shè)施改動(dòng)同樣影響應(yīng)用行為。探測(cè)本地運(yùn)行中的應(yīng)用依次嘗試常見(jiàn)開(kāi)發(fā)端口$B goto http://localhost:3000 2/dev/null echo Found app on :3000 || \ $B goto http://localhost:4000 2/dev/null echo Found app on :4000 || \ $B goto http://localhost:8080 2/dev/null echo Found app on :8080找不到則查 PR 或環(huán)境里的 staging/preview URL再不行就向用戶(hù)要 URL。逐個(gè)測(cè)試受影響的頁(yè)面導(dǎo)航 → 截圖 → 查控制臺(tái) → 交互類(lèi)改動(dòng)做端到端驗(yàn)證 → 操作前后用snapshot -D對(duì)比確認(rèn)改動(dòng)產(chǎn)生了預(yù)期效果。與提交信息、PR 描述交叉驗(yàn)證意圖——這個(gè)改動(dòng)應(yīng)該做什么驗(yàn)證它確實(shí)做到了。查 TODOS.md若存在與改動(dòng)文件相關(guān)的已知 bug 納入測(cè)試計(jì)劃QA 中發(fā)現(xiàn)的 TODOS.md 之外的新 bug 記入報(bào)告。報(bào)告限定在分支改動(dòng)范圍內(nèi)Changes tested: N pages/routes affected by this branch每頁(yè)給出是否可用 截圖證據(jù) 相鄰頁(yè)面回歸檢查。4.2 其余三種模式Full提供 URL 時(shí)的默認(rèn)系統(tǒng)性探索訪問(wèn)所有可達(dá)頁(yè)面記錄 5-10 個(gè)證據(jù)充分的缺陷產(chǎn)出健康分。耗時(shí) 5-15 分鐘視應(yīng)用規(guī)模而定。Quick--quick30 秒冒煙測(cè)試。首頁(yè) 頂部 5 個(gè)導(dǎo)航目標(biāo)檢查能加載有控制臺(tái)錯(cuò)誤有死鏈產(chǎn)出健康分不做詳細(xì)缺陷記錄。Regression--regression baseline跑完整 Full 模式后加載baseline.jsondiff 出哪些修好了、哪些是新增的、分?jǐn)?shù)變化多少把回歸小節(jié)追加進(jìn)報(bào)告。五、Phase 1-6QA 基線工作流Phase 1初始化找到 browse 二進(jìn)制、建輸出目錄、把報(bào)告模板qa/templates/qa-report-template.md復(fù)制到輸出目錄、啟動(dòng)計(jì)時(shí)器。Phase 2認(rèn)證如需用戶(hù)給了憑據(jù)時(shí)模擬真實(shí)登錄$B goto login-url $B snapshot -i # find the login form $B fill e3 userexample.com $B fill e4 [REDACTED] # NEVER include real passwords in report $B click e5 # submit $B snapshot -D # verify login succeeded提供了 cookie 文件則$B cookie-import cookies.json后直達(dá)目標(biāo) URL遇到 2FA/OTP 向用戶(hù)要驗(yàn)證碼并等待遇到 CAPTCHA 則請(qǐng)用戶(hù)在瀏覽器里手動(dòng)完成后通知繼續(xù)。Phase 3定向Orient先拿應(yīng)用地圖$B goto target-url $B snapshot -i -a -o $REPORT_DIR/screenshots/initial.png $B links # map navigation structure $B console --errors # any errors on landing?同時(shí)探測(cè)前端框架并記入報(bào)告元數(shù)據(jù)HTML 里有__next或_next/data請(qǐng)求 → Next.js有csrf-tokenmeta 標(biāo)簽 → RailsURL 含wp-content→ WordPress客戶(hù)端路由無(wú)整頁(yè)刷新 → SPA。SPA 的links命令可能返回很少導(dǎo)航在客戶(hù)端完成要改用snapshot -i找導(dǎo)航元素。Phase 4探索Explore逐頁(yè)訪問(wèn)每頁(yè)三件套$B goto page-url $B snapshot -i -a -o $REPORT_DIR/screenshots/page-name.png $B console --errors然后執(zhí)行 qa/references/issue-taxonomy.md 定義的逐頁(yè)探索清單1) 視覺(jué)掃描——看標(biāo)注截圖找布局問(wèn)題2) 交互元素——點(diǎn)每個(gè)按鈕/鏈接/控件是否做了它聲稱(chēng)的事3) 表單——空提交、非法數(shù)據(jù)、邊界值長(zhǎng)文本、特殊字符4) 導(dǎo)航——進(jìn)出路徑、面包屑、后退鍵、深鏈、移動(dòng)端菜單5) 狀態(tài)——空態(tài)、加載中、錯(cuò)誤態(tài)、溢出態(tài)6) 控制臺(tái)——交互后再跑console --errors7) 響應(yīng)式——移動(dòng)端視口按需檢查8) 認(rèn)證邊界——登出狀態(tài)、不同角色下行為如何。$B viewport 375x812 $B screenshot $REPORT_DIR/screenshots/page-mobile.png $B viewport 1280x720深度分配原則核心功能首頁(yè)、dashboard、checkout、搜索多花時(shí)間次要頁(yè)面about、terms、privacy少花。Phase 5即時(shí)記錄Document發(fā)現(xiàn)即記錄絕不攢批。證據(jù)分兩檔交互類(lèi) bug壞流程、死按鈕、表單失敗操作前截圖 → 執(zhí)行操作 → 結(jié)果截圖 →snapshot -D展示變化 → 寫(xiě)引用截圖的復(fù)現(xiàn)步驟$B screenshot $REPORT_DIR/screenshots/issue-001-step-1.png $B click e5 $B screenshot $REPORT_DIR/screenshots/issue-001-result.png $B snapshot -D靜態(tài) bug錯(cuò)字、布局問(wèn)題、缺圖一張標(biāo)注截圖 問(wèn)題描述$B snapshot -i -a -o $REPORT_DIR/screenshots/issue-002.png每個(gè)問(wèn)題立即按模板格式寫(xiě)入報(bào)告。Phase 6收尾Wrap Up按評(píng)分標(biāo)準(zhǔn)下一節(jié)計(jì)算健康分2. 寫(xiě) Top 3 Things to Fix3. 匯總所有頁(yè)面看到的控制臺(tái)錯(cuò)誤4. 更新嚴(yán)重級(jí)別計(jì)數(shù)表5. 填充報(bào)告元數(shù)據(jù)日期、耗時(shí)、訪問(wèn)頁(yè)數(shù)、截圖數(shù)、框架6.保存基線baseline.json{ date: YYYY-MM-DD, url: target, healthScore: N, issues: [{ id: ISSUE-001, title: ..., severity: ..., category: ... }], categoryScores: { console: N, links: N } }Regression 模式下再加載基線文件比較分?jǐn)?shù) delta、已修復(fù)項(xiàng)、新增項(xiàng)并追加回歸小節(jié)。六、健康分評(píng)分標(biāo)準(zhǔn)Health Score Rubric每個(gè)類(lèi)別先算 0-100 分再加權(quán)平均qa/SKILL.mdConsole權(quán)重 15%0 錯(cuò)誤 → 1001-3 個(gè)錯(cuò)誤 → 704-10 個(gè) → 4010 個(gè)以上 → 10。Links權(quán)重 10%0 死鏈 → 100每個(gè)死鏈 -15下限 0。其余六類(lèi)Visual、Functional、UX、Content、Performance、Accessibility每類(lèi)從 100 起按發(fā)現(xiàn)扣減——Critical 缺陷 -25、High -15、Medium -8、Low -3每類(lèi)下限 0。權(quán)重表類(lèi)別權(quán)重Console15%Links10%Visual10%Functional20%UX15%Performance10%Content5%Accessibility15%最終分score Σ (category_score × weight)。功能正確性Functional 20%權(quán)重最高內(nèi)容權(quán)重最低這個(gè)分布體現(xiàn)了用戶(hù)能不能用優(yōu)先于文字是否通順的 QA 價(jià)值觀。七、缺陷分級(jí)與分類(lèi)法Issue Taxonomyqa/references/issue-taxonomy.md 定義了四級(jí)嚴(yán)重度級(jí)別定義示例critical阻塞核心工作流、造成數(shù)據(jù)丟失或應(yīng)用崩潰表單提交導(dǎo)致錯(cuò)誤頁(yè)、checkout 流程斷裂、無(wú)確認(rèn)即刪除數(shù)據(jù)high主要功能損壞或不可用且無(wú)繞行方案搜索返回錯(cuò)誤結(jié)果、文件上傳靜默失敗、認(rèn)證重定向死循環(huán)medium功能可用但存在明顯問(wèn)題有繞行方案頁(yè)面加載慢5s、缺表單校驗(yàn)但提交仍可用、僅移動(dòng)端布局破損low輕微外觀或打磨問(wèn)題頁(yè)腳錯(cuò)字、1px 對(duì)齊問(wèn)題、hover 狀態(tài)不一致七個(gè)類(lèi)別Visual/UI布局破損、圖片缺失、z-index 錯(cuò)誤、暗色模式問(wèn)題等、Functional死鏈、死按鈕、表單校驗(yàn)缺失、狀態(tài)不持久、競(jìng)態(tài)條件、UX導(dǎo)航困惑、缺加載指示、500ms 無(wú)反饋、破壞性操作無(wú)確認(rèn)、死胡同、Content錯(cuò)字、lorem ipsum 殘留、截?cái)辔谋?、空態(tài)缺失、Performance3s 加載、布局偏移、單頁(yè) 50 請(qǐng)求、阻塞 JS、Console/ErrorsJS 異常、4xx/5xx、CORS、混合內(nèi)容、CSP 違規(guī)、Accessibility缺 alt 文本、表單無(wú)標(biāo)簽、鍵盤(pán)導(dǎo)航斷裂、焦點(diǎn)陷阱、對(duì)比度不足。八、框架特化測(cè)試指引SKILL.md 為四類(lèi)技術(shù)棧給出專(zhuān)項(xiàng)檢查點(diǎn)qa/SKILL.mdNext.js查 hydration 錯(cuò)誤Hydration failed、Text content did not match監(jiān)控_next/data請(qǐng)求的 404點(diǎn)鏈接做客戶(hù)端導(dǎo)航而不是goto才能抓到路由問(wèn)題動(dòng)態(tài)內(nèi)容頁(yè)查 CLS。Rails查 N1 查詢(xún)警告development 模式驗(yàn)證表單里的 CSRF token測(cè) Turbo/Stimulus 集成——頁(yè)面過(guò)渡是否順滑flash 消息是否正確出現(xiàn)并消失。WordPress查插件沖突來(lái)自不同插件的 JS 錯(cuò)誤登錄用戶(hù)的管理欄可見(jiàn)性測(cè)/wp-json/REST 端點(diǎn)查混合內(nèi)容警告WP 上很常見(jiàn)。通用 SPAReact/Vue/Angular用snapshot -i找導(dǎo)航links會(huì)漏客戶(hù)端路由查陳舊狀態(tài)離開(kāi)再回來(lái)數(shù)據(jù)刷新了嗎測(cè)瀏覽器前進(jìn)/后退history 處理對(duì)嗎長(zhǎng)時(shí)間使用后的內(nèi)存泄漏跡象。九、Phase 7-8分診與修復(fù)循環(huán)Phase 7Triage按嚴(yán)重度排序后按 Tier 決定修哪些Quick 只修 critical highStandard 加 mediumExhaustive 全修。凡無(wú)法從源碼修復(fù)的問(wèn)題第三方 widget 的 bug、基礎(chǔ)設(shè)施問(wèn)題無(wú)論 Tier 一律標(biāo)記 deferred。分診后還要針對(duì)缺陷所在組件刷新 learnings選一個(gè)純字母/連字符的關(guān)鍵詞如checkout-button、signup-form、payment不能帶引號(hào)、斜杠、點(diǎn)、冒號(hào)、空格~/.claude/skills/gstack/bin/gstack-learnings-search --query your-keyword --limit 5 2/dev/null || true若命中歷史學(xué)習(xí)用一句話說(shuō)明哪條適用于即將做的修復(fù)沒(méi)有命中也照常繼續(xù)——無(wú)命中本身就是有用信息。Phase 8Fix Loop每個(gè)可修復(fù)問(wèn)題按嚴(yán)重度順序8a 定位grep 錯(cuò)誤信息、組件名、路由定義glob 匹配受影響頁(yè)面的文件模式只改與該問(wèn)題直接相關(guān)的文件。8b 最小修復(fù)讀懂上下文后做解決該問(wèn)題的最小改動(dòng)不重構(gòu)周邊代碼、不加功能、不順手改進(jìn)無(wú)關(guān)的東西。8c 原子提交一個(gè)修復(fù)一個(gè)提交絕不捆綁git add only-changed-files git commit -m fix(qa): ISSUE-NNN — short description8d 復(fù)測(cè)導(dǎo)航回受影響頁(yè)面拍 before/after 截圖對(duì)查控制臺(tái)用snapshot -D確認(rèn)變化符合預(yù)期$B goto affected-url $B screenshot $REPORT_DIR/screenshots/issue-NNN-after.png $B console --errors $B snapshot -D8e 分類(lèi)verified復(fù)測(cè)確認(rèn)修復(fù)且無(wú)新錯(cuò)誤/best-effort已修但無(wú)法完全驗(yàn)證如需特定認(rèn)證態(tài)或外部服務(wù)/reverted檢測(cè)到回歸 →git revert HEAD→ 標(biāo)記 deferred。8e.5 回歸測(cè)試分類(lèi)非 verified、或純視覺(jué)/CSS 修復(fù)、或無(wú)測(cè)試框架且用戶(hù)拒絕引導(dǎo)時(shí)跳過(guò)。五步流程研究項(xiàng)目既有測(cè)試模式讀 2-3 個(gè)離修復(fù)最近的測(cè)試文件精確匹配文件命名、導(dǎo)入、斷言風(fēng)格、describe/it 嵌套、setup/teardown——回歸測(cè)試要看起來(lái)是同一個(gè)開(kāi)發(fā)者寫(xiě)的。追蹤 bug 代碼路徑后寫(xiě)測(cè)試什么輸入/狀態(tài)觸發(fā)了 bug精確前置條件走了哪條代碼路徑斷在哪一行/哪個(gè)條件還有哪些輸入會(huì)撞同一條路徑修復(fù)周?chē)倪吔鏽ull、空數(shù)組、邊界值測(cè)試必須構(gòu)造觸發(fā) bug 的前置條件、執(zhí)行暴露 bug 的動(dòng)作、斷言正確行為而不是它渲染了或沒(méi)拋異常。并附完整歸因注釋// Regression: ISSUE-NNN — {what broke} // Found by /qa on {YYYY-MM-DD} // Report: .gstack/qa-reports/qa-report-{domain}-{date}.md測(cè)試類(lèi)型決策控制臺(tái)錯(cuò)誤/JS 異常/邏輯 bug → 單元或集成測(cè)試表單斷裂/API 失敗/數(shù)據(jù)流 bug → 帶請(qǐng)求/響應(yīng)的集成測(cè)試帶 JS 行為的視覺(jué) bug壞下拉、動(dòng)畫(huà)→ 組件測(cè)試純 CSS → 跳過(guò)靠 QA 重跑兜底。mock 掉全部外部依賴(lài)DB、API、Redis、文件系統(tǒng)用自增命名{name}.regression-*.test.{ext}避免沖突。 3.只跑新測(cè)試文件{detected test command} {new-test-file}。 4.評(píng)估通過(guò) → 提交test(qa): regression test for ISSUE-NNN — {desc}失敗 → 修一次仍失敗刪測(cè)試并 defer探索超 2 分鐘 → 跳過(guò)并 defer。 5.WTF-likelihood 排除測(cè)試提交不計(jì)入下面的啟發(fā)式計(jì)分。8f 自我調(diào)節(jié)STOP AND EVALUATE每 5 次修復(fù)或任何一次 revert 后計(jì)算WTF-LIKELIHOOD: Start at 0% Each revert: 15% Each fix touching 3 files: 5% After fix 15: 1% per additional fix All remaining Low severity: 10% Touching unrelated files: 20%WTF 20% 立即停止向用戶(hù)展示已做的工作并詢(xún)問(wèn)是否繼續(xù)。硬上限50 次修復(fù)之后無(wú)論還有多少遺留問(wèn)題都停止。這套機(jī)制防止 AI 在長(zhǎng)會(huì)話里越修越離譜——修復(fù)率失控本身就是回歸風(fēng)險(xiǎn)信號(hào)。十、Phase 9-11最終驗(yàn)證、報(bào)告與學(xué)習(xí)沉淀Phase 9 Final QA所有修復(fù)完成后對(duì)受影響頁(yè)面重跑 QA計(jì)算最終健康分。若最終分比基線更差顯著 WARN——說(shuō)明引入了回歸。Phase 10 Report報(bào)告雙寫(xiě)——本地.gstack/qa-reports/qa-report-{domain}-{YYYY-MM-DD}.md文件名用域名 日期如qa-report-myapp-com-2026-03-12.md以及項(xiàng)目作用域的~/.gstack/projects/{slug}/{user}-{branch}-test-outcome-{datetime}.md跨會(huì)話上下文。每個(gè)問(wèn)題額外記錄 Fix Statusverified / best-effort / reverted / deferred、Commit SHA、改動(dòng)文件、before/after 截圖。匯總段給出總?cè)毕輸?shù)、修復(fù)數(shù)verified: X, best-effort: Y, reverted: Z、deferred 數(shù)、健康分 deltabaseline → final以及一行可粘貼進(jìn) PR 的總結(jié)QA found N issues, fixed M, health score X → Y.Phase 11 TODOS.md 更新若倉(cāng)庫(kù)有 TODOS.md新的 deferred bug 按嚴(yán)重度/類(lèi)別/復(fù)現(xiàn)步驟寫(xiě)成 TODOTODOS.md 里被本次修掉的條目標(biāo)注 Fixed by /qa on {branch}, {date}。輸出目錄結(jié)構(gòu).gstack/qa-reports/ ├── qa-report-{domain}-{YYYY-MM-DD}.md # 結(jié)構(gòu)化報(bào)告 ├── screenshots/ │ ├── initial.png # 落地頁(yè)標(biāo)注截圖 │ ├── issue-001-step-1.png # 逐問(wèn)題證據(jù) │ ├── issue-001-result.png │ ├── issue-001-before.png # 修復(fù)前若已修 │ ├── issue-001-after.png # 修復(fù)后若已修 │ └── ... └── baseline.json # 回歸模式用報(bào)告本體由 qa/templates/qa-report-template.md 定義元數(shù)據(jù)表Date/URL/Branch/Commit/PR/Tier/Scope/Duration/訪問(wèn)頁(yè)數(shù)/截圖數(shù)/Framework、Health Score 分類(lèi)表、Top 3 Things to Fix、Console Health 聚合表錯(cuò)誤信息/次數(shù)/首次出現(xiàn) URL、按嚴(yán)重度匯總的 Summary 表、每個(gè) ISSUE 的 Severity/Category/URL/描述/帶截圖的復(fù)現(xiàn)步驟、Fixes Applied 表Issue/Fix Status/Commit/Files Changed、Before/After Evidence、Regression Tests 表含 Deferred Tests 的 Precondition/Action/Expected/Why deferred、Ship Readiness 表health score before → after、issues found、fixes applied、deferred與 PR Summary、Regression 對(duì)比表。流程結(jié)束前還有學(xué)習(xí)沉淀把本次發(fā)現(xiàn)的非顯而易見(jiàn)的模式、陷阱或架構(gòu)洞見(jiàn)寫(xiě)入 learningsgstack-learnings-log類(lèi)型分pattern/pitfall/preference/architecture/tool/operational來(lái)源分observed/user-stated/inferred/cross-model置信度 1-10代碼里驗(yàn)證過(guò)的模式 8-9不確定的推斷 4-5用戶(hù)明確說(shuō)出的偏好 10并附上 learning 引用的文件路徑以便后續(xù)陳舊檢測(cè)。十一、十二條 QA 鐵律SKILL.md 用 Important Rules 固化了執(zhí)行紀(jì)律qa/SKILL.md這些是理解該技能設(shè)計(jì)哲學(xué)的關(guān)鍵復(fù)現(xiàn)就是一切——每個(gè)問(wèn)題至少一張截圖無(wú)例外記錄前先驗(yàn)證——重試一次確認(rèn)可復(fù)現(xiàn)排除偶發(fā)絕不包含憑據(jù)——復(fù)現(xiàn)步驟里密碼一律寫(xiě)[REDACTED]增量寫(xiě)入——發(fā)現(xiàn)即追加進(jìn)報(bào)告不攢批絕不讀源碼測(cè)試階段——像用戶(hù)一樣測(cè)不是像開(kāi)發(fā)者一樣測(cè)每次交互后查控制臺(tái)——不表現(xiàn)為視覺(jué)問(wèn)題的 JS 錯(cuò)誤也是 bug像用戶(hù)一樣測(cè)——真實(shí)數(shù)據(jù)、完整工作流端到端走一遍深度優(yōu)于廣度——5-10 個(gè)有證據(jù)的缺陷好過(guò) 20 條含糊描述絕不刪除輸出文件——截圖與報(bào)告只增不減這是有意的棘手 UI 用snapshot -C——能發(fā)現(xiàn)可訪問(wèn)性樹(shù)漏掉的 cursor:pointer / onclick / tabindex div對(duì)應(yīng) browse 技能的 Core QA Patterns 第 5 條每次截圖后必須用 Read 工具把圖片讀給會(huì)話看——否則截圖對(duì)用戶(hù)不可見(jiàn)responsive產(chǎn)生 3 張就全讀絕不拒絕使用瀏覽器——用戶(hù)調(diào) /qa 就是要求基于瀏覽器的測(cè)試哪怕 diff 看起來(lái)沒(méi)有 UI 改動(dòng)也不得建議用 evals、單測(cè)等替代方案。qa 專(zhuān)屬補(bǔ)充規(guī)則11-15干凈工作樹(shù)是前置條件臟則 AskUserQuestion 三選一一修復(fù)一提交只在 8e.5 生成回歸測(cè)試時(shí)改測(cè)試——絕不改 CI 配置、絕不改既有測(cè)試只新建測(cè)試文件回歸就立刻git revert HEAD遵循 WTF-likelihood 啟發(fā)式拿不準(zhǔn)就停下問(wèn)。十二、測(cè)試佐證與延伸閱讀gstack 倉(cāng)庫(kù)用 E2E 測(cè)試驗(yàn)證該技能的行為邊界test/skill-e2e-qa-workflow.test.ts 中qa-quick用例把 qa 目錄拷入臨時(shí)工作區(qū)、啟動(dòng)本地測(cè)試服務(wù)器后讓會(huì)話讀取qa/SKILL.md并跑 Quick 檔測(cè)試跳過(guò) preamble / telemetry 等運(yùn)維段落直接走 QA 工作流qa-only-no-fix用例則驗(yàn)證 report-only 路徑——值得注意的是它會(huì)專(zhuān)門(mén)把 qa/templates/qa-report-template.md 復(fù)制進(jìn)沙箱因?yàn)?qa-only 技能引用的正是 qa 目錄下的模板印證了兩個(gè)技能共享同一份報(bào)告模板資產(chǎn)。另有 test/skill-e2e-qa-bugs.test.ts 專(zhuān)門(mén)驗(yàn)證缺陷發(fā)現(xiàn)行為。延伸資料缺陷分級(jí)與逐頁(yè)清單qa/references/issue-taxonomy.md報(bào)告模板qa/templates/qa-report-template.md瀏覽器引擎全部命令goto/snapshot/fill/click/console/viewport/upload/dialog等browse/SKILL.mdreport-only 變體qa-only/SKILL.md技能模板源文件SKILL.md 由它自動(dòng)生成勿直接編輯qa/SKILL.md.tmpl小結(jié)gstack 的/qa把測(cè)試 → 修復(fù) → 驗(yàn)證壓進(jìn)一條可執(zhí)行的流程Setup 階段解決瀏覽器引擎、工作樹(shù)清潔度與測(cè)試命令三個(gè)前置問(wèn)題四種模式覆蓋驗(yàn)分支diff-aware、全量體檢Full、冒煙Quick和趨勢(shì)對(duì)比RegressionPhase 1-6 用標(biāo)注截圖 控制臺(tái)證據(jù) 加權(quán)健康分建立基線Phase 7-8 在 Tier 約束下做最小修復(fù)、原子提交fix(qa): ISSUE-NNN、before/after 復(fù)測(cè)與回歸測(cè)試生成并用 WTF-likelihood 計(jì)分和 50 次硬上限給 AI 修復(fù)行為上保險(xiǎn)Phase 9-11 重跑驗(yàn)證、雙寫(xiě)報(bào)告、回寫(xiě) TODOS.md最終產(chǎn)出一行可直接進(jìn) PR 的 QA found N issues, fixed M, health score X → Y。整條鏈路的設(shè)計(jì)重心非常清晰每個(gè)結(jié)論都要有截圖與控制臺(tái)證據(jù)每個(gè)修復(fù)都要有獨(dú)立提交與復(fù)測(cè)每個(gè)循環(huán)都要有自我剎車(chē)。【免費(fèi)下載鏈接】gstackUse Garry Tans exact Claude Code setup: 23 opinionated tools that serve as CEO, Designer, Eng Manager, Release Manager, Doc Engineer, and QA項(xiàng)目地址: https://gitcode.com/GitHub_Trending/gs/gstack創(chuàng)作聲明:本文部分內(nèi)容由AI輔助生成(AIGC),僅供參考