browser-cdp
Chrome DevTools Protocol(CDP)を使用してChromeブラウザを操作し、既存のログインセッションを再利用したい場合に使用するスキルです。デバッグモードでのChrome起動、URLを開く、ページ読み込み待機、JavaScript実行、スナップショット取得、認証トークンの抽出などをカバーします。ブラウザ自動化やログイン状態の再利用、トークン取得が必要なシーンで活用できます。
description の原文を見る
Use this skill when you need to control a Chrome browser via CDP (Chrome DevTools Protocol) to reuse existing login sessions. Covers: launching Chrome in debug mode, opening URLs, waiting for page load, evaluating JavaScript, taking snapshots, and extracting auth tokens. Trigger phrases: browser automation, CDP, agent-browser, 浏览器操作, 操作浏览器, Chrome CDP, 复用登录态, extract token from browser.
SKILL.md 本文
Browser CDP 操作ツール
CDPプロトコル経由でChromeを制御し、既存のログイン状態を再利用してブラウザ自動化操作を実行します。
前提条件
- Windows(実験的)/ macOS / Linux にGoogle Chrome がインストール済み
- Node.js 16+(Atomics.wait + SharedArrayBuffer)
agent-browserコマンドラインツールがインストール済み(npm install -g agent-browser)
ステップ1:CDP Chrome環境を起動
node {SKILL_DIR}/scripts/setup-cdp-chrome.js 9222
成功後、すべての agent-browser コマンドで --cdp 9222 を付与します。
よく使う操作
ページを開いて読み込み完了を待つ
agent-browser --cdp 9222 open "<URL>"
agent-browser --cdp 9222 wait 3000
ページテキストコンテンツを抽出
agent-browser --cdp 9222 eval 'document.body.innerText.substring(0, 8000)'
認証トークンを抽出
# localStorage または cookie から抽出
agent-browser --cdp 9222 eval 'localStorage.getItem("token") || document.cookie'
ページスクリーンショット / インタラクティブスナップショット
# ページ要素を検索(ログインボタンなどのインタラクション用)
agent-browser --cdp 9222 snapshot -i
要素をクリック
agent-browser --cdp 9222 click "<CSS selector>"
フォームに入力
agent-browser --cdp 9222 type "<CSS selector>" "<text>"
よくある質問
| 問題 | 解決方法 |
|---|---|
| CDPポートがリッスンしていない | setup-cdp-chrome.js を再実行 |
| ページがログインページにリダイレクト | snapshot -i でログインボタンを探して操作 |
| eval が null を返す | localStorage のキー名を確認、または document.cookie に変更 |
| Chromeプロセスが残存 | macOS/Linux: pkill -9 -x 'Google Chrome' / Windows: taskkill /F /IM chrome.exe、その後スクリプトを再実行 |
ライセンス: MIT(寛容ライセンスのため全文を引用しています) · 原本リポジトリ
詳細情報
- 作者
- worldwonderer
- ライセンス
- MIT
- 最終更新
- 不明
Source: https://github.com/worldwonderer/oh-story-claudecode / ライセンス: MIT
関連スキル
agent-browser
AI エージェント向けのブラウザ自動化 CLI です。ウェブサイトとの対話が必要な場合に使用します。ページ遷移、フォーム入力、ボタンクリック、スクリーンショット取得、データ抽出、ウェブアプリのテスト、ブラウザ操作の自動化など、あらゆるブラウザタスクに対応できます。「ウェブサイトを開く」「フォームに記入する」「ボタンをクリックする」「スクリーンショットを取得する」「ページからデータを抽出する」「このウェブアプリをテストする」「サイトにログインする」「ブラウザ操作を自動化する」といった要求や、プログラマティックなウェブ操作が必要なタスクで起動します。
anyskill
AnySkill — あなたのプライベート・スキルクラウド。GitHubを基盤としたリポジトリからエージェントスキルを管理、同期、動的にロードできます。自然言語でクラウドスキルを検索し、オンデマンドでプロンプトを自動ロード、カスタムスキルのアップロードと共有、スキルバンドルの一括インストールが可能です。OpenClaw、Antigravity、Claude Code、Cursorに対応しています。
engram
AIエージェント向けの永続的なメモリシステムです。バグ修正、意思決定、発見、設定変更の後はmem_saveを使用してください。ユーザーが「覚えている」「記憶している」と言及した場合、または以前のセッションと重複する作業を開始する際はmem_searchを使用します。セッション終了前にmem_session_summaryを使用して、コンテキストを保持してください。
skyvern
AI駆動のブラウザ自動化により、任意のウェブサイトを自動化できます。フォーム入力、データ抽出、ファイルダウンロード、ログイン、複数ステップのワークフロー実行など、ユーザーがウェブサイトと連携する必要があるときに使用します。Skyvernは、LLMとコンピュータビジョンを活用して、未知のサイトも自動操作可能です。Python SDK、TypeScript SDK、REST API、MCPサーバー、またはCLIを通じて統合できます。
pinchbench
PinchBenchベンチマークを実行して、OpenClawエージェントの実世界タスクにおけるパフォーマンスを評価できます。モデルの機能テスト、モデル間の比較、ベンチマーク結果のリーダーボード提出、またはOpenClawのセットアップがカレンダー、メール、リサーチ、コーディング、複数ステップのワークフローにどの程度対応しているかを確認する際に使用します。
openui
OpenUIとOpenUI Langを使用してジェネレーティブUIアプリを構築できます。これらはLLM生成インターフェースのためのトークン効率的なオープン標準です。OpenUI、@openuidev、ジェネレーティブUI、LLMからのストリーミングUI、AI向けコンポーネントライブラリ、またはjson-render/A2UIの置き換えについて述べる際に使用します。スキャフォルディング、defineComponent、システムプロンプト、Renderer、およびOpenUI Lang出力のデバッグに対応しています。