● コミュニティ
browserwing
⚡ 即起動
BrowserWing
作者 browserwing · browserwing/browserwing
ブラウザ操作を録画してClaudeのskillまたはMCPコマンドとして出力 — 手作業フローをエージェントが呼び出せるルーティンに変換します。
BrowserWingはブラウザを監視し、操作の意図（クリック、入力、ナビゲーション）をキャプチャし、エージェントが呼び出せるアーティファクト（Claude SkillまたはMCPツール）を出力します。Playwrightを手書きせずに反復的なブラウザフローをエージェントに教えるために使います。
なぜ使うのか
主な機能
- アクションレコーダー
- Claude SkillまたはMCPツールとして出力
- セレクターの耐障害性（CSS + role + テキスト）
- キャプチャしたフローをパラメータ化
- Chromium / Firefoxで実行
ユースケース
実用的な使い方： BrowserWing
使うタイミング： Claudeにやってほしい繰り返しのブラウザ作業がある場合。
フロー
-
録画
BrowserWingを起動し、フローを実行します。✓ コピーしました
→ トレースがキャプチャされている
-
精緻化
可変入力をアノテーションします。✓ コピーしました
→ フローがパラメータ化されている
-
出力
skill / MCPツールとしてエクスポートします。✓ コピーしました
→ エージェントから呼び出せる状態
結果： Claudeが呼び出せる再現可能なブラウザルーティンが完成します。
組み合わせ
他のMCPと組み合わせて10倍の力を
基盤にPlaywright MCPを使い、BrowserWingはキャプチャUXを担当する
browserwing-skillとplaywright-mcpを組み合わせる：基盤にPlaywright MCPを使い、BrowserWingはキャプチャUXを担当する✓ コピーしました
コストと制限
運用コスト
- APIクォータ
- ローカルブラウザ
- 呼び出しあたりのトークン
- 呼び出しごとに小さい
- 金額
- OSS無料
- ヒント
- サイトのレイアウトが変わったら再録画する
セキュリティ
権限、シークレット、影響範囲
最小スコープ： browser-control
認証情報の保管： キャプチャされたフローをディスクに保存
データ送信先： フローが向かう先に依存
絶対に付与しない： 銀行/医療サイトを無闇に録画すること
トラブルシューティング
よくあるエラーと対処法
セレクターのずれ
レコーダーはrole + テキストを優先します — サイトが再設計されたら再録画してください
代替案
BrowserWing 他との比較
| 代替案 | 代わりに使う場面 | トレードオフ |
|---|
| 手書きPlaywright | コードレベルのコントロールが必要な場合 | 作成に時間がかかる |