ブラウザ自動化

---
name: browser
description: ブラウザ自動化とスクレイピングのための最小限のChrome DevTools Protocolツール。Chromeの起動、ページ遷移、JavaScript実行、スクリーンショット取得、DOM要素の対話的選択が必要な場合に使用します。
---

# ブラウザツール

共同でのサイト探索とスクレイピングのための最小限のCDPツールです。

**重要**: すべてのスクリプトは`~/.factory/skills/browser/`にあり、完全パスで呼び出す必要があります。

## Chromeを起動

```bash
~/.factory/skills/browser/start.js              # 新しいプロファイル
~/.factory/skills/browser/start.js --profile    # あなたのプロファイルをコピー（クッキー、ログイン）
```

リモートデバッグ付きで`:9222`上にChromeを起動します。

## ナビゲート

```bash
~/.factory/skills/browser/nav.js https://example.com
~/.factory/skills/browser/nav.js https://example.com --new
```

現在のタブをナビゲートするか、新しいタブを開きます。

## JavaScriptを評価

```bash
~/.factory/skills/browser/eval.js 'document.title'
~/.factory/skills/browser/eval.js 'document.querySelectorAll("a").length'
```

アクティブなタブでJavaScriptを実行します（asyncコンテキスト）。

**重要**: コードは単一式にするか、複数文にはIIFEを使用する必要があります:

- 単一式: `'document.title'`
- 複数文: `'(() => { const x = 1; return x + 1; })()'`
- コード文字列内の改行を避け、1行に保つ

## スクリーンショット

```bash
~/.factory/skills/browser/screenshot.js
```

現在のビューポートのスクリーンショットを撮り、一時ファイルパスを返します。

## 要素を選択

```bash
~/.factory/skills/browser/pick.js "送信ボタンをクリック"
```

対話的な要素ピッカーです。クリックで選択、Cmd/Ctrl+クリックで複数選択、Enterで完了します。

## 使用上の注意

- 他のツールを使用する前に、まずChromeを起動する
- `--profile`フラグは実際のChromeプロファイルを同期するため、各サイトにログインした状態になります
- JavaScript評価はページ内のasyncコンテキストで実行されます
- Pickツールでは、クリックしてDOM要素を視覚的に選択できます

```

## ワークフローレシピ

1. **Chromeを開始** - `start.js --profile`で認証状態をミラーリングします。
2. **ナビゲーション操作** - `nav.js https://target.app`でナビゲートするか、`--new`でセカンダリタブを開きます。
3. **DOMを検査** - `eval.js`を使用してクイックカウント、属性チェック、またはJSONペイロードの抽出を行います。
4. **アーティファクトをキャプチャ** - 視覚的証拠のために`screenshot.js`を使用するか、正確なセレクタやテキストスナップショットが必要な場合は`pick.js`を使用します。
5. **収集した証拠を返す** - セッションサマリーまたはPR説明に、ファイルパス、DOMメタデータ、クエリ出力を含めます。

このワークフローにより、エージェントは現在のブラウジングコンテキストに集中し、生の認証情報やクッキーをマシンの外に送信することを回避できます。

## 検証

- `~/.factory/skills/browser/start.js --profile`は`✓ Chrome started on :9222 with your profile`を出力するはずです。
- `~/.factory/skills/browser/nav.js https://example.com`はナビゲーションを確認するはずです。
- `~/.factory/skills/browser/eval.js 'document.title'`は現在のページタイトルを表示するはずです。
- `~/.factory/skills/browser/screenshot.js`はシステム一時ディレクトリ下の有効なPNGパスを出力するはずです。

いずれかのステップが失敗した場合は、`start.js`を再実行し、Chromeが`localhost:9222/json/version`でリッスンしていることを確認し、`puppeteer-core`がインストールされていることを確認してください。
```