Mcpplaywright

注意： 目前 Docker 實現僅支持無頭 Chromium。

{
  "mcpServers": {
    "playwright": {
      "command": "docker",
      "args": ["run", "-i", "--rm", "--init", "--pull=always", "mcr.microsoft.com/playwright/mcp"]
    }
  }
}

你可以自己構建 Docker 鏡像。

docker build -t mcr.microsoft.com/playwright/mcp .

import { createConnection } from '@playwright/mcp'; import { SSEServerTransport } from '@modelcontextprotocol/sdk/server/sse.js';

http.createServer(async (req, res) => { // ...

// 創建一個具有 SSE 傳輸的無頭 Playwright MCP 服務器 const connection = await createConnection({ browser: { launchOptions: { headless: true } } }); const transport = new SSEServerTransport('/messages', res); await connection.sever.connect(transport);

// ... });

</details>

### 工具
#### 核心自動化
<details>
<summary><b>核心自動化</b></summary>
- **browser_click**
  - 標題：點擊
  - 描述：在網頁上執行點擊操作
  - 參數：
    - `element` (字符串)：用於獲取與元素交互權限的人類可讀元素描述
    - `ref` (字符串)：頁面快照中確切的目標元素引用
    - `doubleClick` (布爾值，可選)：是否執行雙擊而不是單擊
    - `button` (字符串，可選)：要點擊的按鈕，默認為左鍵
  - 只讀：**否**

- **browser_close**
  - 標題：關閉瀏覽器
  - 描述：關閉頁面
  - 參數：無
  - 只讀：**是**

- **browser_console_messages**
  - 標題：獲取控制檯消息
  - 描述：返回所有控制檯消息
  - 參數：無
  - 只讀：**是**

- **browser_drag**
  - 標題：拖動鼠標
  - 描述：在兩個元素之間執行拖放操作
  - 參數：
    - `startElement` (字符串)：用於獲取與源元素交互權限的人類可讀元素描述
    - `startRef` (字符串)：頁面快照中確切的源元素引用
    - `endElement` (字符串)：用於獲取與目標元素交互權限的人類可讀元素描述
    - `endRef` (字符串)：頁面快照中確切的目標元素引用
  - 只讀：**否**

- **browser_evaluate**
  - 標題：評估 JavaScript
  - 描述：在頁面或元素上評估 JavaScript 表達式
  - 參數：
    - `function` (字符串)：() => { /* 代碼 */ } 或 (element) => { /* 代碼 */ }（當提供元素時）
    - `element` (字符串，可選)：用於獲取與元素交互權限的人類可讀元素描述
    - `ref` (字符串，可選)：頁面快照中確切的目標元素引用
  - 只讀：**否**

- **browser_file_upload**
  - 標題：上傳文件
  - 描述：上傳一個或多個文件
  - 參數：
    - `paths` (數組)：要上傳文件的絕對路徑。可以是單個文件或多個文件。
  - 只讀：**否**

- **browser_handle_dialog**
  - 標題：處理對話框
  - 描述：處理對話框
  - 參數：
    - `accept` (布爾值)：是否接受對話框。
    - `promptText` (字符串，可選)：在提示對話框的情況下輸入的文本。
  - 只讀：**否**

- **browser_hover**
  - 標題：懸停鼠標
  - 描述：在頁面上懸停在元素上
  - 參數：
    - `element` (字符串)：用於獲取與元素交互權限的人類可讀元素描述
    - `ref` (字符串)：頁面快照中確切的目標元素引用
  - 只讀：**是**

- **browser_navigate**
  - 標題：導航到 URL
  - 描述：導航到指定 URL
  - 參數：
    - `url` (字符串)：要導航到的 URL
  - 只讀：**否**

- **browser_navigate_back**
  - 標題：返回上一頁
  - 描述：返回上一個頁面
  - 參數：無
  - 只讀：**是**

- **browser_navigate_forward**
  - 標題：前進到下一頁
  - 描述：前進到下一個頁面
  - 參數：無
  - 只讀：**是**

- **browser_network_requests**
  - 標題：列出網絡請求
  - 描述：返回自頁面加載以來的所有網絡請求
  - 參數：無
  - 只讀：**是**

- **browser_press_key**
  - 標題：按下鍵
  - 描述：在鍵盤上按下一個鍵
  - 參數：
    - `key` (字符串)：要按下的鍵的名稱或要生成的字符，例如 `ArrowLeft` 或 `a`
  - 只讀：**否**

- **browser_resize**
  - 標題：調整瀏覽器窗口大小
  - 描述：調整瀏覽器窗口大小
  - 參數：
    - `width` (數字)：瀏覽器窗口的寬度
    - `height` (數字)：瀏覽器窗口的高度
  - 只讀：**是**

- **browser_select_option**
  - 標題：選擇選項
  - 描述：在下拉菜單中選擇一個選項
  - 參數：
    - `element` (字符串)：用於獲取與元素交互權限的人類可讀元素描述
    - `ref` (字符串)：頁面快照中確切的目標元素引用
    - `values` (數組)：要在下拉菜單中選擇的值的數組。可以是單個值或多個值。
  - 只讀：**否**

- **browser_snapshot**
  - 標題：頁面快照
  - 描述：捕獲當前頁面的無障礙快照，這比截圖更好
  - 參數：無
  - 只讀：**是**

- **browser_take_screenshot**
  - 標題：截圖
  - 描述：對當前頁面進行截圖。你不能基於截圖執行操作，請使用 browser_snapshot 進行操作。
  - 參數：
    - `raw` (布爾值，可選)：是否返回未壓縮的圖像（PNG 格式）。默認為 false，返回 JPEG 圖像。
    - `filename` (字符串，可選)：保存截圖的文件名。如果未指定，默認為 `page-{timestamp}.{png|jpeg}`。
    - `element` (字符串，可選)：用於獲取對元素進行截圖權限的人類可讀元素描述。如果未提供，將對視口進行截圖。如果提供了元素，也必須提供 ref。
    - `ref` (字符串，可選)：頁面快照中確切的目標元素引用。如果未提供，將對視口進行截圖。如果提供了 ref，也必須提供元素。
    - `fullPage` (布爾值，可選)：當為 true 時，對整個可滾動頁面進行截圖，而不是當前可見的視口。不能與元素截圖一起使用。
  - 只讀：**是**

- **browser_type**
  - 標題：輸入文本
  - 描述：在可編輯元素中輸入文本
  - 參數：
    - `element` (字符串)：用於獲取與元素交互權限的人類可讀元素描述
    - `ref` (字符串)：頁面快照中確切的目標元素引用
    - `text` (字符串)：要輸入到元素中的文本
    - `submit` (布爾值，可選)：是否提交輸入的文本（之後按 Enter 鍵）
    - `slowly` (布爾值，可選)：是否逐個字符輸入。對於觸發頁面中的按鍵處理程序很有用。默認情況下，整個文本一次性填充。
  - 只讀：**否**

- **browser_wait_for**
  - 標題：等待
  - 描述：等待文本出現或消失，或等待指定時間過去
  - 參數：
    - `time` (數字，可選)：要等待的時間（秒）
    - `text` (字符串，可選)：要等待出現的文本
    - `textGone` (字符串，可選)：要等待消失的文本
  - 只讀：**是**
</details>

#### 標籤管理
<details>
<summary><b>標籤管理</b></summary>
- **browser_tab_close**
  - 標題：關閉標籤
  - 描述：關閉一個標籤
  - 參數：
    - `index` (數字，可選)：要關閉的標籤的索引。如果未提供，則關閉當前標籤。
  - 只讀：**否**

- **browser_tab_list**
  - 標題：列出標籤
  - 描述：列出瀏覽器標籤
  - 參數：無
  - 只讀：**是**

- **browser_tab_new**
  - 標題：打開新標籤
  - 描述：打開一個新標籤
  - 參數：
    - `url` (字符串，可選)：在新標籤中要導航到的 URL。如果未提供，新標籤將為空。
  - 只讀：**是**

- **browser_tab_select**
  - 標題：選擇標籤
  - 描述：按索引選擇一個標籤
  - 參數：
    - `index` (數字)：要選擇的標籤的索引
  - 只讀：**是**
</details>

#### 瀏覽器安裝
<details>
<summary><b>瀏覽器安裝</b></summary>
- **browser_install**
  - 標題：安裝配置中指定的瀏覽器
  - 描述：安裝配置中指定的瀏覽器。如果遇到瀏覽器未安裝的錯誤，請調用此工具。
  - 參數：無
  - 只讀：**否**
</details>

#### 基於座標的操作（通過 --caps=vision 啟用）
<details>
<summary><b>基於座標的操作（通過 --caps=vision 啟用）</b></summary>
- **browser_mouse_click_xy**
  - 標題：點擊
  - 描述：在給定位置點擊鼠標左鍵
  - 參數：
    - `element` (字符串)：用於獲取與元素交互權限的人類可讀元素描述
    - `x` (數字)：X 座標
    - `y` (數字)：Y 座標
  - 只讀：**否**

- **browser_mouse_drag_xy**
  - 標題：拖動鼠標
  - 描述：將鼠標左鍵拖動到給定位置
  - 參數：
    - `element` (字符串)：用於獲取與元素交互權限的人類可讀元素描述
    - `startX` (數字)：起始 X 座標
    - `startY` (數字)：起始 Y 座標
    - `endX` (數字)：結束 X 座標
    - `endY` (數字)：結束 Y 座標
  - 只讀：**否**

- **browser_mouse_move_xy**
  - 標題：移動鼠標
  - 描述：將鼠標移動到給定位置
  - 參數：
    - `element` (字符串)：用於獲取與元素交互權限的人類可讀元素描述
    - `x` (數字)：X 座標
    - `y` (數字)：Y 座標
  - 只讀：**是**
</details>

#### PDF 生成（通過 --caps=pdf 啟用）
<details>
<summary><b>PDF 生成（通過 --caps=pdf 啟用）</b></summary>
- **browser_pdf_save**
  - 標題：保存為 PDF
  - 描述：將頁面保存為 PDF
  - 參數：
    - `filename` (字符串，可選)：保存 PDF 的文件名。如果未指定，默認為 `page-{timestamp}.pdf`。
  - 只讀：**是**
</details>