webapp-testing：用 Playwright 測本地 Web 應用

適合誰

當你要用 Playwright 與本地 Web 應用互動並做測試時，使用 webapp-testing。它支援核驗前端功能、除錯介面行為、抓瀏覽器截圖，以及查看瀏覽器日誌。對象是本地應用，不是未點名的遠端站點掃描。

更合適的前提是：你準備寫原生 Python Playwright 腳本，並用輔助腳本管理伺服器生命週期。資料沒有給出代理產品名單或安裝器，不要編造倉庫路徑。官方說明頁是

https://raw.githubusercontent.com/anthropics/skills/main/skills/webapp-testing/SKILL.md

3 分鐘完成第一次嘗試

推薦的第一條路徑是先看輔助腳本用法，而不是先開瀏覽器。資料點名 scripts/with_server.py 負責管理伺服器生命週期（支援多伺服器），並要求：Always run scripts with --help first。

前置：目前環境能執行該 helper。低風險第一次：

scripts/with_server.py --help

成功訊號：列印出用法，伺服器尚未被拉起。這是唯讀說明。不要先讀 helper 原始碼來猜參數——摘要寫明先 --help，而不是先讀原始碼。

若說明能看懂，並且你確認要測一個本地應用，再寫 Playwright 腳本。必須用 sync_playwright，並以 headless 啟動 chromium：browser = p.chromium.launch(headless=True)。啟動伺服器和開啟頁面都會改環境、也可能寫日誌，先確認目標就是你的本地應用，再執行。摘要提到 helper 啟動後再對著 localhost 測，但摘錄沒有寫出埠號，因此不要編造位址。

使用案例

案例一：用 helper 帶著本地伺服器跑一次唯讀查看。先 --help，確認參數後再呼叫 scripts/with_server.py。腳本裡用 sync_playwright 開啟 headless chromium。完成標準是瀏覽器在無頭模式啟動，並且你還沒有對頁面執行破壞性操作。資料支援截圖和看日誌，這兩項相對可逆；寫檔案前先確認截圖落盤路徑。

案例二：動態應用按「先偵察再操作」。順序是：導覽並等待 networkidle；截圖或檢查 DOM；從渲染結果識別選擇器；再用發現的選擇器執行操作。資料明確不要在動態應用上、在等到 networkidle 之前就檢查 DOM；正確做法是等待 page.wait_for_load_state('networkidle') 後再檢查。完成標準是你能指出等待發生在檢查之前。不要在未等到網路空閒時點擊未確認的選擇器。

使用邊界

只涵蓋本地 Web 應用的 Playwright 測試。chromium 始終 headless。helper 先 --help。動態應用必須先 networkidle 再看 DOM。

不要編造安裝器、倉庫路徑或未寫出的 localhost 埠。資料沒有給出用戶端名單，也沒有寫如何對非本地站點使用。超出這些已寫明的 helper、無頭啟動和偵察順序，這份說明涵蓋不到。