ホーム チュートリアル カテゴリ Skills サイトについて
ZH EN JA KO
🎭

Playwright

ブラウザ自動化 ブラウザ・自動化

インストールコマンド

npx clawhub@latest install playwright

インストール手順

1
環境確認

Node.js 22以上とOpenClawがインストール済みであることを確認してください。ターミナルでopenclaw --versionを実行して確認できます。

2
インストール実行

上記のインストールコマンドをターミナルで実行します。ClawHubが自動的にPlaywrightを~/.openclaw/skills/ディレクトリにダウンロード・インストールします。

3
インストール確認

openclaw skills listを実行してインストール済みスキル一覧を確認し、Playwrightが表示されていることを確かめてください。

4
パラメータ設定(任意)

下記の紹介にある設定手順に従い、~/.config/openclaw/openclaw.json5にスキルの設定項目を追加してください。

手動インストール方法:Skillフォルダを~/.openclaw/skills/またはプロジェクトのskills/ディレクトリにコピーしてください。フォルダ内にSKILL.mdファイルが必要です。
アクセシビリティスナップショットによるページ理解 クロスブラウザ自動化テスト フォーム操作とナビゲーション

詳細紹介

Playwright MCPサーバーはMicrosoft公式が提供するブラウザ自動化ソリューションです。スクリーンショットではなくアクセシビリティスナップショットを使用してページ構造を理解する独自のアプローチにより、AIがページ要素を正確に操作できます。

コア機能

  • ページナビゲーション(browser_navigate):指定したURLにナビゲートし、ページの読み込み完了を自動的に待機します
  • アクセシビリティスナップショット(browser_snapshot):ページのアクセシビリティツリー構造を取得します。すべてのインタラクティブ要素とそのref識別子が含まれ、AIは視覚認識ではなくテキスト理解でページを把握します
  • 要素インタラクション:クリック(browser_click)、フォーム入力(browser_type)、ドロップダウン選択(browser_select_option)、ホバー(browser_hover)などの操作に対応します
  • タブ管理:マルチタブ管理に対応し、タブの作成、切り替え、クローズが可能です
  • JavaScript実行:ページコンテキスト内でカスタムJavaScriptコードを実行します

設定方法

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["-y", "@anthropic/playwright-mcp"]
      // オプション:--browser chromium/firefox/webkit
    }
  }
}

活用シーン

  • E2Eテスト:Webアプリケーションの機能テストフローを自動化します
  • データ入力:自動ログインしてフォームを入力し、データを送信します
  • Webページ操作エージェント:AIがユーザーに代わって複雑なWebページ操作を実行します
  • ページコンテンツ抽出:ページにナビゲートして構造化データを抽出します