SKILL.md
Testing Web Applications
agent-browser CLI を使用したブラウザQAテスト実行スキル。
Prerequisites
# インストール確認
agent-browser --version
# 未インストールの場合
npm install -g agent-browser && agent-browser installWorkflow
以下のチェックリストをコピーして進捗を追跡:
QA Test Progress:
- [ ] Phase 1: 環境準備（ページを開きスナップショット取得）
- [ ] Phase 2: 正常系テスト実行
- [ ] Phase 3: 異常系テスト実行
- [ ] Phase 4: レポート生成Phase 1: 環境準備
agent-browser open "http://localhost:3000"
agent-browser snapshot -i # インタラクティブ要素のみ取得（@e1, @e2 等）
agent-browser screenshot initial-state.pngPhase 2: 正常系テスト
有効な入力での期待動作を確認。各ステップでスクリーンショット取得。
Phase 3: 異常系テスト
- 無効入力（空文字、特殊文字、境界値超過）
- エラーメッセージ表示
- XSS/SQLインジェクション防御
Phase 4: レポート生成
docs/qa-reports/YYYY-MM-DD-<feature>.md に保存。
agent-browser Quick Reference
| 操作 | コマンド |
|---|---|
| ページを開く | agent-browser open "URL" |
| スナップショット | agent-browser snapshot -i |
| クリック | agent-browser click @e1 |
| 入力 | agent-browser fill @e1 "text" |
| スクリーンショット | agent-browser screenshot file.png |
| キー押下 | agent-browser press Enter |
| 待機 | agent-browser wait 2s / wait --network-idle |
| セッション維持 | agent-browser --session qa open "URL" |
要素参照: snapshot -i で取得した @e1, @e2 等を使用。
Test Types
| タイプ | 参照 |
|---|---|
| 機能テスト | [references/functional-testing.md](references/functional-testing.md) |
| UIテスト | [references/ui-testing.md](references/ui-testing.md) |
| E2Eフロー | [references/e2e-testing.md](references/e2e-testing.md) |
| 回帰テスト | [references/regression-testing.md](references/regression-testing.md) |
Report Template
# QA Test Report: [Feature Name]
## Summary
| Total | Passed | Failed | Skipped |
|-------|--------|--------|---------|
| X | X | X | X |
## Environment
- URL: [target URL]
- Browser: Chromium (agent-browser)
- Date: YYYY-MM-DD
## Test Results
### TC-001: [Test Name]
- **Status**: PASS/FAIL
- **Type**: functional/ui/e2e/regression
- **Category**: positive/negative
- **Expected**: Expected result
- **Actual**: Actual result
- **Screenshots**: [links]
## Issues Found
| ID | Severity | Description | Screenshot |
|----|----------|-------------|------------|
## Recommendations
- [Improvement suggestions]agent-browser Tips
snapshot -iを常に使用（インタラクティブ要素のみ）- 要素参照
@e1は決定論的（DOM再クエリ不要） --sessionフラグで認証状態を維持--headedでブラウザ表示（デバッグ用）