劇作家-MCP

MCP（モデルコンテキストプロトコル）用のPlaywrightラッパー。このサーバーにより、LLM対応クライアントはブラウザを制御でき、自動化タスクを実行できます。

コンポーネント

リソース

サーバーはブラウザのスクリーンショットにアクセスするためのリソースを公開します。

スクリーンショットリソースURI: screenshot://{page_id}
スクリーンショットリソースは、開いているすべてのページで自動的に利用可能になります。

プロンプト

サーバーは、クライアントが Web ページを解釈できるようにプロンプトを提供します。

interpret-page : 現在のウェブページのコンテンツと構造を分析します
- 解釈するページを選択するためのオプションのpage_id引数
- 特定の側面（フル、フォーム、ナビゲーション、テキスト）に焦点を当てるためのオプションのfocus引数
- テキスト分析とページのスクリーンショットの両方を返します

ツール

サーバーは包括的なブラウザ自動化ツールのセットを実装します。

ブラウザナビゲーション
- navigate : 特定のURLに移動する
- new_page : 特定のIDで新しいブラウザページを作成する
- switch_page : 別のブラウザページに切り替える
- get_pages : 利用可能なすべてのブラウザページを一覧表示する
ページインタラクション
- click : CSSセレクターを使用して要素をクリックする
- type : 入力要素にテキストを入力する
- wait_for_selector : 要素がページに表示されるまで待つ
コンテンツ抽出
- get_text : 要素からテキストコンテンツを取得する
- get_page_content : ページ全体のHTMLを取得する
- take_screenshot : ページまたは要素の視覚的な状態をキャプチャします

構成

依存関係をインストールする

uv add playwright
playwright install chromium

クイックスタート

インストール

クロードデスクトップ

MacOSの場合: ~/Library/Application\ Support/Claude/claude_desktop_config.json
Windows の場合: %APPDATA%/Claude/claude_desktop_config.json

"mcpServers": {
  "playwright-mcp": {
    "command": "uv",
    "args": [
      "--directory",
      "/Users/shannon/Workspace/artivus/playwright-mcp",
      "run",
      "playwright-mcp"
    ]
  }
}

"mcpServers": {
  "playwright-mcp": {
    "command": "uvx",
    "args": [
      "playwright-mcp"
    ]
  }
}

発達

建築と出版

配布用のパッケージを準備するには:

依存関係を同期し、ロックファイルを更新します。

uv sync

パッケージディストリビューションをビルドします。

uv build

これにより、 dist/ディレクトリにソースとホイールのディストリビューションが作成されます。

PyPI に公開:

uv publish

注: 環境変数またはコマンドフラグを使用して PyPI 資格情報を設定する必要があります。

トークン: --tokenまたはUV_PUBLISH_TOKEN
またはユーザー名/パスワード: --username / UV_PUBLISH_USERNAMEおよび--password / UV_PUBLISH_PASSWORD

デバッグ

MCPサーバーはstdio経由で実行されるため、デバッグが困難になる場合があります。最適なデバッグ環境を実現するには、 MCP Inspectorの使用を強くお勧めします。

次のコマンドを使用して、 npm経由で MCP Inspector を起動できます。

npx @modelcontextprotocol/inspector uv --directory /Users/shannon/Workspace/artivus/playwright-mcp run playwright-mcp

起動すると、ブラウザでアクセスしてデバッグを開始できる URL がインスペクタに表示されます。