Playwright MCP Server について
Playwright MCP Serverは、構造化されたアクセシビリティスナップショットを通じてLLMにPlaywrightのブラウザー自動化機能を提供します。スクリーンショットに頼らない操作やテストに使えます。
主な機能
- 01アクセシビリティツリーのページスナップショット
- 02ブラウザーの移動と操作
- 03フォーム入力とファイルアップロード
- 04コンソールとネットワークの確認
- 05オプションの座標ベース操作
活用シーン
- 01ページ移動とフォーム入力
- 02構造化されたページデータの抽出
- 03LLMによるブラウザーテスト
- 04AIエージェントのブラウザー操作自動化
MCP 対応
MCPクライアントにブラウザー自動化ツールを提供するMCPサーバーです。クライアントはApifyトークンを使い、ホストされたエンドポイントに接続します。
設定
ローカルサーバーの設定はどのクライアントでも共通です。コピーしてクライアントの MCP 設定ファイルに貼り付けてください。
このサーバーのパッケージやリモートエンドポイントはまだ取得できていません。プロジェクトの README の手順に従ってください。
ツール
ローカルサーバーのツールはマシン上で起動して初めて取得できます。メンテナーはまだツール一覧を提供していません。
詳細
Playwright MCP サーバー
Playwright を使用したブラウザー自動化機能を提供する Model Context Protocol(MCP)サーバーです。このサーバーを使うと、LLM は構造化されたアクセシビリティスナップショットを通じてウェブページを操作できるため、スクリーンショットや視覚調整されたモデルは不要です。
この MCP サーバーについて: この MCP サーバーへの接続方法と利用方法については、mcp.apify.com にある公式の Model Context Protocol ドキュメントを参照してください。
接続 URL
MCP クライアントは次の URL でこのサーバーに接続できます。
https://jiri-spilka--playwright-mcp-server.apify.actor/mcp
クライアントの設定
この MCP サーバーに接続するには、MCP クライアントで次の設定を使用します。
{
"mcpServers": {
"playwright": {
"url": "https://jiri-spilka--playwright-mcp-server.apify.actor/mcp",
"headers": {
"Authorization": "Bearer YOUR_APIFY_TOKEN"
}
}
}
}
注: YOUR_APIFY_TOKEN を実際の Apify API トークンに置き換えてください。トークンは Apify Console で確認できます。
リンク
- GitHub リポジトリ:https://github.com/microsoft/playwright-mcp
- Actor リポジトリ:https://github.com/apify/actor-playwright-mcp
- Apify MCP ドキュメント:https://mcp.apify.com
🚩 この MCP サーバーの権利を申請する
https://github.com/microsoft/playwright-mcp の原作者にすべてのクレジットを帰属します。 このサーバーの権利を申請するには、[email protected] までご連絡ください。
主な機能
- 🚀 ピクセルベースの入力の代わりに Playwright のアクセシビリティツリーを使用し、高速かつ軽量に動作します
- 📊 構造化データのみを扱うため、ビジョンモデルは不要です
- 🎯 ツールを決定論的に適用し、スクリーンショットを使う方法の曖昧さを回避します
- 🌐 Apify Proxy(データセンター、住宅用、カスタム)やその他の Apify 機能に対応しています
ユースケース
- 🌐 ウェブのナビゲーションとフォームへの入力
- 📋 構造化データの抽出
- 🧪 LLM 主導の自動テスト
- 🤖 AI エージェント向けのブラウザー自動化
ツール(ソース)
ツール
コア自動化
-
browser_click
- タイトル:クリック
- 説明:ウェブページ上でクリックを実行します
- パラメーター:
element(string):要素とのインタラクション許可を得るために使用する、人が理解できる要素の説明ref(string):ページスナップショットにある正確な対象要素の参照doubleClick(boolean, optional):シングルクリックではなくダブルクリックを実行するかどうかbutton(string, optional):クリックするボタン。デフォルトは左ボタンです
- 読み取り専用:false
-
browser_close
- タイトル:ブラウザーを閉じる
- 説明:ページを閉じます
- パラメーター:なし
- 読み取り専用:true
-
browser_console_messages
- タイトル:コンソールメッセージを取得
- 説明:すべてのコンソールメッセージを返します
- パラメーター:なし
- 読み取り専用:true
-
browser_drag
- タイトル:マウスをドラッグ
- 説明:2 つの要素間でドラッグ&ドロップを実行します
- パラメーター:
startElement(string):要素とのインタラクション許可を得るために使用する、人が理解できる始点要素の説明startRef(string):ページスナップショットにある正確な始点要素の参照endElement(string):要素とのインタラクション許可を得るために使用する、人が理解できる終点要素の説明endRef(string):ページスナップショットにある正確な終点要素の参照
- 読み取り専用:false
-
browser_file_upload
- タイトル:ファイルをアップロード
- 説明:1 つまたは複数のファイルをアップロードします
- パラメーター:
paths(array):アップロードするファイルの絶対パス。単一ファイルまたは複数のファイルを指定できます。
- 読み取り専用:false
-
browser_fill_form
- タイトル:フォームに入力
- 説明:複数のフォームフィールドに入力します
- パラメーター:
fields(array):入力するフィールド
- 読み取り専用:false
-
browser_handle_dialog
- タイトル:ダイアログを操作
- 説明:ダイアログを操作します
- パラメーター:
accept(boolean):ダイアログを受け入れるかどうか。promptText(string, optional):プロンプトダイアログの場合に入力するテキスト。
- 読み取り専用:false
-
browser_hover
- タイトル:マウスをホバー
- 説明:ページ上の要素にマウスカーソルを合わせます
- パラメーター:
element(string):要素との操作許可を得るために使用する、人が理解しやすい要素の説明ref(string):ページスナップショットに含まれる、対象要素の正確な参照
- 読み取り専用:true
-
browser_navigate
- タイトル:URL に移動
- 説明:URL に移動します
- パラメーター:
url(string):移動先の URL
- 読み取り専用:false
-
browser_navigate_back
- タイトル:戻る
- 説明:前のページに戻ります
- パラメーター:なし
- 読み取り専用:true
-
browser_network_requests
- タイトル:ネットワークリクエストを一覧表示
- 説明:ページの読み込み後に発生したすべてのネットワークリクエストを返します
- パラメーター:なし
- 読み取り専用:true
-
browser_press_key
- タイトル:キーを押す
- 説明:キーボードのキーを押します
- パラメーター:
key(string):押すキーの名前、または入力する文字(ArrowLeftやaなど)
- 読み取り専用:false
-
browser_resize
- タイトル:ブラウザーウィンドウのサイズを変更
- 説明:ブラウザーウィンドウのサイズを変更します
- パラメーター:
width(number):ブラウザーウィンドウの幅height(number):ブラウザーウィンドウの高さ
- 読み取り専用:true
-
browser_select_option
- タイトル:オプションを選択
- 説明:ドロップダウンからオプションを選択します
- パラメーター:
element(string):要素との操作許可を得るために使用する、人が理解しやすい要素の説明ref(string):ページスナップショットに含まれる、対象要素の正確な参照values(array):ドロップダウンで選択する値の配列。単一の値または複数の値を指定できます。
- 読み取り専用:false
-
browser_snapshot
- タイトル:ページスナップショット
- 説明:現在のページのアクセシビリティスナップショットを取得します。スクリーンショットよりも適しています
- パラメーター:なし
- 読み取り専用:true
-
browser_take_screenshot
- タイトル:スクリーンショットを撮影
- 説明:現在のページのスクリーンショットを撮影します。スクリーンショットを基に操作することはできません。操作には browser_snapshot を使用してください。
- パラメーター:
type(string, optional):スクリーンショットの画像形式です。デフォルトは png です。filename(string, optional):スクリーンショットの保存先ファイル名です。指定しない場合、デフォルトはpage-{timestamp}.{png|jpeg}です。element(string, optional):対象の要素をスクリーンショットに撮る許可を得るために使用する、人が読める要素の説明です。指定しない場合、ビューポートのスクリーンショットが撮影されます。element を指定する場合は、ref も指定する必要があります。ref(string, optional):ページスナップショットに含まれる、対象要素の正確な参照です。指定しない場合、ビューポートのスクリーンショットが撮影されます。ref を指定する場合は、element も指定する必要があります。fullPage(boolean, optional):true の場合、現在表示されているビューポートではなく、スクロール可能なページ全体のスクリーンショットを撮影します。要素のスクリーンショットと同時には使用できません。
- 読み取り専用:true
-
browser_type
- タイトル:テキストを入力
- 説明:編集可能な要素にテキストを入力します
- パラメーター:
element(string):要素との対話許可を得るために使用する、人が読める要素の説明ですref(string):ページスナップショットに含まれる、対象要素の正確な参照ですtext(string):要素に入力するテキストですsubmit(boolean, optional):入力したテキストを送信するかどうか(送信後に Enter を押します)slowly(boolean, optional):1 文字ずつ入力するかどうかを指定します。ページ内のキー操作ハンドラーをトリガーする場合に便利です。デフォルトでは、テキスト全体を一度に入力します。
- 読み取り専用:false
-
browser_wait_for
- タイトル:待機
- 説明:テキストが表示または非表示になるまで、あるいは指定した時間が経過するまで待機します
- パラメーター:
time(number, optional):待機する時間(秒)ですtext(string, optional):表示されるまで待機するテキストですtextGone(string, optional):非表示になるまで待機するテキストです
- 読み取り専用:true
タブ管理
- browser_tabs
- タイトル:タブを管理
- 説明:ブラウザータブの一覧表示、作成、閉じる、または選択を行います。
- パラメーター:
action(string):実行する操作ですindex(number, optional):閉じる/選択するタブのインデックスです。閉じる操作で省略した場合は、現在のタブが閉じられます。
- 読み取り専用:false
ブラウザーのインストール
- browser_install
- タイトル:設定で指定されたブラウザーをインストール
- 説明:設定で指定されたブラウザーをインストールします。ブラウザーがインストールされていないというエラーが表示された場合に呼び出してください。
- パラメーター:なし
- 読み取り専用:false
座標ベース(--caps=vision でオプトイン)
-
browser_mouse_click_xy
- タイトル:クリック
- 説明:指定した位置でマウスの左ボタンをクリックします
- パラメーター:
element(string):要素との対話許可を得るために使用する、人が読める要素の説明ですx(number):X 座標ですy(number):Y 座標です
- 読み取り専用:false
-
browser_mouse_drag_xy
- タイトル:マウスをドラッグ
- 説明:指定した位置までマウスの左ボタンをドラッグします
- パラメーター:
element(string):要素との対話許可を得るために使用する、人が読める要素の説明ですstartX(number):開始 X 座標ですstartY(number):開始 Y 座標ですendX(number):終了 X 座標ですendY(number):終了 Y 座標です
- 読み取り専用:false
PDF 生成(--caps=pdf でオプトイン)
- browser_pdf_save
- タイトル:PDF として保存
- 説明:ページを PDF として保存します
- パラメーター:
filename(string, optional):PDF の保存先ファイル名です。指定しない場合は、デフォルトでpage-{timestamp}.pdfになります。
- 読み取り専用:true
検証(--caps=verify でオプトイン)
-
browser_verify_element_visible
- タイトル:要素の表示を検証
- 説明:ページ上に要素が表示されていることを検証します
- パラメーター:
role(string):要素の ROLE です。スナップショットでは次のように確認できます:- {ROLE} "Accessible Name":accessibleName(string):要素の ACCESSIBLE_NAME です。スナップショットでは次のように確認できます:- role "{ACCESSIBLE_NAME}"
- 読み取り専用:true
-
browser_verify_list_visible
- タイトル:リストの表示を検証
- 説明:ページ上にリストが表示されていることを検証します
- パラメーター:
element(string):人が読んで理解できるリストの説明ref(string):リストを指す、対象要素の正確な参照items(array):検証する項目
- 読み取り専用:true
-
browser_verify_text_visible
- タイトル:テキストの表示を検証
- 説明:テキストがページ上に表示されていることを検証します。可能な場合は browser_verify_element_visible を優先してください。
- パラメーター:
text(string):検証する TEXT です。スナップショットでは次のように確認できます:- role "Accessible Name": {TEXT}または- text: {TEXT}
- 読み取り専用:true
-
browser_verify_value
- タイトル:値を検証
- 説明:要素の値を検証します
- パラメーター:
type(string):要素のタイプelement(string):人が読んで理解できる要素の説明ref(string):要素を指す、対象要素の正確な参照value(string):検証する値です。チェックボックスの場合は、"true" または "false" を使用します。
- 読み取り専用:true
コメント
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。