ryryo agent-browser CLIブラウザ検証（dev:agent-browser）
禁止事項（最優先）
- mcpclaude-in-chrome*** ツールは絶対に使用しない**
- agent-browser は Bash で実行する CLI ツール。MCP ツールではない
Step 0: 環境セットアップ
セットアップスクリプトを実行する。CLI インストール、ブラウザバイナリ修復（既存バイナリ流用 → ダウンロード試行）、URL疎通確認を自動処理する。
# SKILL_DIR はこの SKILL.md と同じディレクトリ
bash "${SKILL_DIR}/setup-agent-browser.sh" [--check-url URL]
- 最終行が
SUCCESS:<prefix>→ PREFIX を取得して Step 1 へ - 最終行が
FAIL:<reason>→ AskUserQuestion で<reason>を報告して中断
URL疎通確認
対象URLがある場合は --check-url オプションで渡す。スクリプトが疎通結果をログ出力する。
サーバーが起動していない場合は AskUserQuestion で「開発サーバーを起動しますか？」と確認する。
Step 1: レポートフォーマット選択
ユーザーの検証指示を分析し、適切なフォーマットを1つ選択する。
| フォーマット | ファイル | 選択基準 |
|---|---|---|
| ui-layout | references/formats/ui-layout.md |
表示崩れ、レイアウト、デザイン確認が目的 |
| interaction | references/formats/interaction.md |
フォーム入力、ボタン操作、画面遷移が目的 |
| api-integration | references/formats/api-integration.md |
API通信、SSE、エラーハンドリングが目的 |
| responsive | references/formats/responsive.md |
デバイスサイズ別の表示確認が目的 |
複数の目的がある場合は、最も重要な目的に合うフォーマットを選ぶ。
Read で該当フォーマットファイルを読み込む。
Step 2: スクリーンショットディレクトリ作成
mkdir -p .tmp/agent-browser/{YYYYMMDD}-{slug}
{YYYYMMDD}: 実行日（例: 20260219）{slug}: 検証内容を英語で短く表現（例: tarot-ui, login-form）
Step 3: Task サブエージェント起動
Readでreferences/subagent-prompt.mdを読み込むテンプレートのプレースホルダを置換：
{PREFIX}→ Step 0-1 で確定した PREFIX{ユーザーの指示}→ ユーザーの検証指示{SCREENSHOT_DIR}→ Step 2 で作成したディレクトリパス{レポートフォーマット}→ Step 1 で選択したフォーマット定義
Task を起動：
Task(
subagent_type: "general-purpose",
model: "haiku",
description: "ブラウザ検証実行",
prompt: <<置換済みテンプレート>>
)
Step 4: 結果報告
サブエージェントの結果をユーザーに報告。
- サブエージェントのレポートをそのまま提示（省略しない）
- スクリーンショットがある場合は Read で画像を表示
- 検証 OK/NG/未実行 のサマリーを最後に添える