Playwright Plus

🚀 Playwright サーバー MCP サービス

MCP ツール付きの Playwright サーバー

✨ 主な機能

リソース

このサーバーは、以下の機能を持つシンプルなノート保存システムを実装しています。

• 単一のノートにアクセスするためのカスタム note:// URI スキーム
• 各ノートリソースには、名前、説明、text/plain MIME タイプが含まれています。

プロンプト

このサーバーは以下のプロンプトを提供しています。

• summarize-notes：保存されたすべてのノートの要約を生成します。
  • 詳細度を制御するためのオプションパラメータ "style"（簡潔/詳細）
  • 現在のすべてのノートに基づいてプロンプトを生成し、スタイルの嗜好を優先します。

ツール

このサーバーは以下のツールを実装しています。

• playwright_navigate：指定された URL に移動します。アクティブなセッションがない場合、この操作は自動的に新しいセッションを作成します。
  • url パラメータ（文字列）が必要です。
• playwright_screenshot：現在のページまたは特定の要素のスクリーンショットを撮ります。
  • スクリーンショットのファイル名として name パラメータ（文字列）が必要です。
  • 特定の要素をスクリーンショットするための CSS セレクタを指定するオプションパラメータ selector（文字列）。セレクタが指定されていない場合は、全ページのスクリーンショットが撮られます。
• playwright_click：CSS セレクタを使用してページ上の要素をクリックします。
  • クリックする要素の CSS セレクタを指定する selector パラメータ（文字列）が必要です。
• playwright_fill：入力フィールドに内容を入力します。
  • 入力フィールドの CSS セレクタを指定する selector パラメータ（文字列）が必要です。
  • 入力する値を指定する value パラメータ（文字列）が必要です。
• playwright_evaluate：ブラウザのコンソールで JavaScript コードを実行します。
  • 実行する JavaScript スクリプトを指定する script パラメータ（文字列）が必要です。
• playwright_click_text：テキスト内容を使用してページ上の要素をクリックします。
  • クリックする要素のテキスト内容を指定する text パラメータ（文字列）が必要です。
• playwright_get_element_attribute：要素の属性値を取得します。
  • 要素の CSS セレクタを指定する selector パラメータ（文字列）と、取得する属性名を指定する attribute_name パラメータ（文字列）が必要です。
  • 指定された要素の属性値を返します。

📚 ドキュメント

MCP Desktop 設定パス

Windows：%APPDATA%\MCP\config.json  
Linux：~/.config/MCP/config.json  

🔧 技術詳細

リリース手順

1. uv build コマンドを実行してビルドします。
2. uv package を実行してリリースパッケージを生成します。
3. uv install を使用してサービスをインストールします。

デバッグ方法

以下のコマンドを実行してデバッグを開始します。

npm run dev

💻 使用例

MCP Desktop 設定例

{
  "playwright_server": {
    "enabled": true,
    "path": "C:/Users/Administrator/AppData/MCP/config.json"
  }
}

MCP Inspector コマンド例

npm run dev -- --port 9234