BrowserStack MCP Server

官方

將 BrowserStack 測試平台的完整功能帶入您的 AI 工具，讓團隊中的每位開發者和測試人員都能更快速、更輕鬆地進行測試。

GitHub

145

文件

BrowserStack MCP 伺服器

全方位測試平台

直接在 Cursor、Claude 或任何支援 MCP 的客戶端等工具中，使用簡單的英文來管理測試案例、執行手動或自動化測試、除錯問題，甚至修復程式碼。

隨時隨地進行測試：

輕鬆將 BrowserStack 測試平台連接到您喜愛的 AI 工具，例如 IDE、LLM 或代理工作流程。

使用自然語言進行測試：

使用簡單的英文提示來管理、執行、除錯測試，甚至修復程式碼。

減少情境切換：

保持專注——將所有專案情境集中在一個地方，並直接從您的 IDE 或 LLM 觸發操作。

⚡️ 一鍵 MCP 設定

點擊下方按鈕，在您各自的 IDE 中安裝 MCP：

注意：請確保您使用的 Node 版本 >= `18.0`

使用 node --version 檢查您的 node 版本。建議版本：v22.15.0 (LTS)
升級 Node 的方法：
1. 在 macOS 上 (Homebrew) - brew update && brew upgrade node or if using (nvm) - nvm install 22.15.0 && nvm use 22.15.0 && nvm alias default 22.15.0
1. 在 Windows 上 (nvm-windows) : nvm install 22.15.0 && nvm use 22.15.0
👉 或直接下載 Node.js LTS 安裝程式

💡 使用範例

📱 手動應用程式測試

在搭載最新作業系統版本的真實裝置上測試行動應用程式。無需繁瑣設定即可重現錯誤並除錯崩潰問題。以下是一些在 BrowserStack 廣泛的真實裝置雲端上使用您行動應用程式的範例提示

# Open app on specific device
"open my app on a iPhone 15 Pro Max"

# Debug app crashes
"My app crashed on Android 14 device, can you help me debug?"

與模擬器不同，可在實際裝置上測試您應用程式的真實世界效能。透過先進的應用程式分析功能，您可以即時除錯崩潰和效能問題。
從我們的裝置網格存取所有主要裝置和作業系統版本，我們有嚴格的 SLA，可在上市日為我們的全球資料中心配置新發布的裝置。

🌐 手動網頁測試

與應用程式測試類似，您可以使用以下提示在 BrowserStack 廣泛的真實瀏覽器和裝置雲端上測試您的網站。您的電腦上沒有安裝 Edge 瀏覽器嗎？我們為您準備好了！

# Test your websites
"open my website hosted on localhost:3001 on Edge"
"open browserstack.com on latest version of Chrome"

跨不同瀏覽器和裝置測試網站。我們支援所有主要作業系統上的所有主要瀏覽器。
無縫測試在您本機託管的網站，無需部署到遠端伺服器！

🧪 自動化測試（Playwright、Selenium、A11y 等）

直接在您的 IDE 或 LLM 中自動分析、診斷甚至修復損壞的測試腳本。即時擷取日誌、找出根本原因並套用情境感知修復。不再有除錯迴圈。以下是在 BrowserStack 的測試平台上執行/除錯/修復自動化測試的幾個範例提示。

注意： 擷取測試的根本原因分析 (RCA) 時，伺服器僅將建議的修復作為提案傳回。它永遠不會自動套用程式碼變更——您的助手必須提出建議並等待您明確批准後才能編輯任何檔案。

#Port test suite to BrowserStack
"Setup test suite to run on BrowserStack infra"

#Run tests on BrowserStack
“Run my tests on BrowserStack”

#AI powered debugging of test failures
"My App Automate tests have failed, can you help me fix the new failures?"

利用我們業界領先的測試可觀測性功能，修復 CI/CD 管線回報的測試失敗。在此處尋找更多資訊。
在 BrowserStack 的測試平台上執行以 Jest、Playwright、Selenium 等編寫的測試

🌐 無障礙測試

透過自動化的本地 a11y 掃描，及早發現無障礙問題。取得一鍵式、AI 建議的修復。無需搜尋文件，沒有 CI 意外。使用我們的無障礙測試工具確保符合 WCAG 和 ADA 規範

#Scan accessibility issues while development
"Scan & help fix accessibility issues for my website running locally on localhost:3000"

#Scan accessibility issues on production site
“Run accessibility scan & identify issues on my website - www.bstackdemo.com”

📋 測試管理

使用自然語言建立和管理測試案例、建立測試計劃並觸發測試執行。以下是一些利用 BrowserStack 的測試管理與 MCP 伺服器功能的範例提示。

# Create project & folder structure
"create new Test management project named My Demo Project with two sub folders - Login & Checkout"

# Add test cases
"add invalid login test case in Test Management project named My Demo Project"

# List added test cases 
"list high priority Login test cases from Test Management project - My Demo Project"

# Create test run
"create a test run for Login tests from Test Management project - My Demo Project"

# Update test results
"update test results as passed for Login tests test run from My Demo Project"

🧪 存取 BrowserStack AI 代理

從 PRD 產生測試案例、將手動測試轉換為低程式碼自動化，以及自動修復由 BrowserStack 的 AI 代理驅動的不穩定腳本，無縫整合到您的工作流程中。以下是存取 Browserstack AI 代理的幾個範例提示

#Test case generator agent
"With Browserstack AI, create relevant test cases for my PRD located at /usr/file/location"


#Low code authoring agent
“With Browserstack AI, automate my manual test case X, added in Test Management”


#Self healing agent
“Help fix flaky tests in my test script with Browserstack AI self healing”

🛠️ 安裝

📋 MCP 設定的先決條件

注意：請確保您使用的 Node 版本 >= `18.0`

使用 node --version 檢查您的 node 版本。建議版本：v22.15.0 (LTS)

一鍵 MCP 設定

點擊下方按鈕，在您各自的 IDE 中安裝 MCP：

設定 MCP 伺服器的替代方法

建立 BrowserStack 帳戶
- 如果您還沒有帳戶，請註冊 BrowserStack。
- ℹ️ 如果您有開源專案，我們可以為您提供免費方案。
- 擁有帳戶（並購買適當的方案）後，從帳戶設定記下您的 username 和 access_key。
注意：請確保您使用的 Node 版本 >= 18.0
- 使用 node --version 檢查您的 node 版本。建議版本：v22.15.0 (LTS)
安裝 MCP 伺服器
- VSCode（Copilot - 代理模式）：.vscode/mcp.json：
  - 找到或建立設定檔：在專案的根目錄中，尋找名為 .vscode 的資料夾。此資料夾通常是隱藏的，因此您需要按照展開中的說明找到它。
  - 如果此資料夾不存在，請建立它。
  - 在 .vscode 資料夾內，建立一個名為 mcp.json 的新檔案
  - 新增設定：開啟 mcp.json 檔案，然後新增以下 JSON 內容。
  - 將使用者名稱和 <access_key> 替換為您的 BrowserStack 憑證。
```
{
  "servers": {
    "browserstack": {
      "command": "npx",
      "args": ["-y", "@browserstack/mcp-server@latest"],
      "env": {
        "BROWSERSTACK_USERNAME": "<username>",
        "BROWSERSTACK_ACCESS_KEY": "<access_key>"
      }
    }
  }
}
```
- 在 VSCode 中，請確保點擊 MCP 伺服器中的 Start 按鈕以啟動伺服器。
** 在 VSCode Copilot 上設定 MCP 的替代方法
1. 點擊齒輪圖示以選取工具
2. 頂部中央會出現一個工具選單，向下捲動頂部的選單，然後點擊「新增 MCP 伺服器」

3. 選取 NPM 套件選項（從 NPM 套件安裝）- 清單中的第 3 個

4. 輸入 NPM 套件名稱 (@browserstack/mcp-server)

5. 輸入 browserstack 使用者名稱和存取金鑰
- 對於 Cursor：.cursor/mcp.json：
```
{
  "mcpServers": {
    "browserstack": {
      "command": "npx",
      "args": ["-y", "@browserstack/mcp-server@latest"],
      "env": {
        "BROWSERSTACK_USERNAME": "<username>",
        "BROWSERSTACK_ACCESS_KEY": "<access_key>"
      }
    }
  }
}
```
- Claude Desktop：~/claude_desktop_config.json：
```
{
  "mcpServers": {
    "browserstack": {
      "command": "npx",
      "args": ["-y", "@browserstack/mcp-server@latest"],
      "env": {
        "BROWSERSTACK_USERNAME": "<username>",
        "BROWSERSTACK_ACCESS_KEY": "<access_key>"
      }
    }
  }
}
```
- Cline

點擊導覽列中的「MCP 伺服器」圖示選取「已安裝」索引標籤。點擊窗格底部的「設定 MCP 伺服器」按鈕。

{
  "mcpServers": {
    "browserstack": {
      "command": "npx",
      "args": ["-y", "@browserstack/mcp-server@latest"],
      "env": {
        "BROWSERSTACK_USERNAME": "<username>",
        "BROWSERSTACK_ACCESS_KEY": "<access_key>"
      }
    }
  }
}

💡 BrowserStack MCP 工具清單

截至目前，我們支援 20 個工具。

🧾 測試管理

createProjectOrFolder — 建立測試管理專案和/或資料夾以組織測試案例。傳回資料夾 ID、專案 ID 和用於存取 TM 專案儀表板的測試管理連結。 提示範例

Create a new Test Management project named 'Shopping App' with two folders - Login and Checkout

createTestCase — 在特定專案/資料夾下新增手動測試案例（使用如 PR-xxxxx 的專案識別碼和資料夾 ID）。 提示範例

Add a test case named 'Invalid Login Scenario' to the Login folder in the 'Shopping App' project with PR-53617, Folder ID: 117869

listTestCases — 列出專案的測試案例（支援優先順序、狀態、標籤等篩選條件）。 提示範例

List all high-priority test cases in the 'Shopping App' project with project_identifier: PR-59457

createTestRun — 為專案中選取的測試案例建立測試執行（套件）。 提示範例

Create a test run for the Login folder in the 'Shopping App' project and name it 'Release v1.0 Login Flow'

listTestRuns — 列出專案的測試執行（按日期、指派者、狀態篩選）。 提示範例

List all test runs from the 'Shopping App' project that were executed last week and are currently marked in-progress

updateTestRun — 部分更新測試執行（狀態、標籤、備註、關聯的測試案例）。 提示範例

Update test run ID 1043 in the 'Shopping App' project and mark it as complete with the note 'Regression cycle done'

addTestResult — 為執行中的測試案例新增手動執行結果（通過/失敗/封鎖/略過）。 提示範例

Mark the test case 'Invalid Login Scenario' as passed in test run ID 1043 of the 'Shopping App' project

createTestCasesFromFile — 從上傳的檔案（例如 PDF）批次建立測試案例。 提示範例

Upload test cases from '/Users/xyz/testcases.pdf' to the 'Shopping App' project in Test Management

⚙️ BrowserStack SDK 設定 / 自動化測試

setupBrowserStackAutomateTests — 整合 BrowserStack SDK 並在 BrowserStack 上執行網頁測試（可選擇啟用 Percy）。 提示範例

Run my Selenium-JUnit5 tests written in Java on Chrome and Firefox. Enable Percy for visual testing.

fetchAutomationScreenshots — 擷取在給定 Automate/App Automate 工作階段期間擷取的螢幕截圖。 提示範例

Get screenshots from Automate session ID abc123xyz for my desktop test run

🔍 可觀測性

getFailureLogs — 擷取 Automate/App Automate 工作階段的錯誤日誌（對於 App Automate，可選擇按建置 ID 擷取）。 提示範例

Get the error logs from the session ID: 21a864032a7459f1e7634222249b316759d6827f, Build ID: dt7ung4wmjittzff8kksrjadjax9gzvbscoyf9qn of App Automate test session

📱 App Live

runAppLiveSession — 在雲端的真實裝置上啟動手動應用程式測試工作階段。 提示範例

Open my app on iPhone 15 Pro Max with iOS 17. App path is /Users/xyz/app.ipa

💻 Live

runBrowserLiveSession — 啟動用於在桌面或行動瀏覽器上進行網站測試的 Live 工作階段。 提示範例

Open www.google.com on the latest version of Microsoft Edge on Windows 11

📲 App Automate

takeAppScreenshot — 在指定裝置上啟動應用程式並擷取快速驗證螢幕截圖。此工具僅用於驗證您的應用程式是否已啟動。 提示範例

Take a screenshot of my app on Google Pixel 6 with Android 12 while testing on App Automate. App file path: /Users/xyz/app-debug.apk

runAppTestsOnBrowserStack — 在真實裝置上執行自動化行動測試（Espresso/XCUITest 等）。 提示範例

Run Espresso tests from /tests/checkout.zip on Galaxy S21 and Pixel 6 with Android 12. App path is /apps/beta-release.apk under project 'Checkout Flow'

♿ 無障礙測試

accessibilityExpert — 詢問 A11y 專家（WCAG 2.0/2.1/2.2、行動/網頁可用性、最佳實務）。 提示範例

What WCAG guidelines apply to form field error messages on mobile web?

startAccessibilityScan — 啟動網頁無障礙掃描並傳回結果連結。 提示範例

Run accessibility scan for "www.example.com"

🤖 BrowserStack AI 代理

fetchSelfHealedSelectors — 擷取 AI 自我修復的選擇器，以修復因 DOM 變更導致的不穩定測試。 提示範例

Fetch and fix flaky test selectors in Automate session ID session_9482 using MCP

createLCASteps — 從測試管理中的手動測試案例產生低程式碼自動化步驟。 提示範例

Convert the manual test case 'Add to Cart' in the 'Shopping App' project into LCA steps

uploadProductRequirementFile — 上傳 PRD/螢幕截圖/PDF 並取得檔案對應 ID（與 createTestCasesFromFile 搭配使用）。 提示範例

Upload PRD from /Users/xyz/Desktop/login-flow.pdf and use BrowserStack AI to generate test cases

🚀 遠端 MCP 伺服器

遠端 MCP 具備 MCP 伺服器的所有功能，而無需複雜設定或本機安裝的麻煩。

主要優點：

✅ 在企業網路中無縫運作，無需擔心防火牆、二進位檔案或本機安裝不被允許的情況。
✅ 安全的 OAuth 整合 – 無需密碼共享或手動處理憑證。

限制：

❌ 不支援本機測試（無法測試 VPN、防火牆或 localhost 後面的應用程式）。如果需要進行本機測試，則必須使用 BrowserStack 本機 MCP 伺服器。
❌ 延遲可能會稍高，但不明顯——在正常使用中通常不會注意到。

安裝步驟：

在 VSCode（Copilot - 代理模式）上：.vscode/mcp.json：
- 找到或建立設定檔：
- 在專案的根目錄中，尋找名為 .vscode 的資料夾。此資料夾通常是隱藏的，因此您需要按照展開中的說明找到它。
- 如果此資料夾不存在，請建立它。
- 在 .vscode 資料夾內，建立一個名為 mcp.json 的新檔案
- 若要設定遠端 BrowserStack MCP 而非本機 BrowserStack MCP，您可以新增以下 JSON 內容：
  
  設定遠端 MCP 的替代方法
- 步驟 1. 點擊齒輪圖示以選取工具
- 步驟 2. 頂部中央會出現一個工具選單，向下捲動頂部的選單，然後點擊「新增 MCP 伺服器」
- 步驟 3. 點擊 HTTP 選項
- 步驟 4. 貼上遠端 MCP 伺服器 URL：https://mcp.browserstack.com/mcp
- 步驟 5. 將伺服器 ID 設為：browserstack
- 步驟 6. 在 VSCode 中點擊啟動 MCP 伺服器，然後點擊「允許」

🤝 推薦的 MCP 客戶端

對於自動化測試 + 除錯使用案例，我們建議使用 Github Copilot 或 Cursor。
對於手動測試使用案例（Live 測試），我們建議使用 Claude Desktop。

⚠️ 重要注意事項

BrowserStack MCP 伺服器正在積極開發中，目前支援 MCP 規範的一個子集。更多功能即將推出。
工具調用依賴於 MCP 客戶端，而 MCP 客戶端又依賴於 LLM，因此可能會出現一些非確定性行為，導致意外結果。如果您有任何建議或回饋，請開啟一個 issue 進行討論。

📝 貢獻

我們歡迎貢獻！請開啟一個 issue 來討論您想進行的任何變更。 👉 點擊此處查看我們的貢獻指南

📞 支援

如需支援，請：

如果您遇到任何與 MCP 伺服器相關的問題，請在我們的 GitHub 儲存庫中開啟一個 issue。
如有任何其他疑問，請聯絡我們的支援團隊。

🚀 更多功能即將推出

敬請期待令人興奮的更新！有任何建議嗎？請開啟一個 issue 進行討論。

BrowserStack MCP Server

文件

BrowserStack MCP 伺服器

隨時隨地進行測試：

使用自然語言進行測試：

減少情境切換：

⚡️ 一鍵 MCP 設定

注意：請確保您使用的 Node 版本 >= 18.0

💡 使用範例

📱 手動應用程式測試

🌐 手動網頁測試

🧪 自動化測試（Playwright、Selenium、A11y 等）

🌐 無障礙測試

📋 測試管理

🧪 存取 BrowserStack AI 代理

🛠️ 安裝

📋 MCP 設定的先決條件

注意：請確保您使用的 Node 版本 >= 18.0

一鍵 MCP 設定

設定 MCP 伺服器的替代方法

注意：請確保您使用的 Node 版本 >= 18.0

** 在 VSCode Copilot 上設定 MCP 的替代方法

💡 BrowserStack MCP 工具清單

🧾 測試管理

⚙️ BrowserStack SDK 設定 / 自動化測試

🔍 可觀測性

📱 App Live

💻 Live

📲 App Automate

♿ 無障礙測試

🤖 BrowserStack AI 代理

🚀 遠端 MCP 伺服器

主要優點：

限制：

安裝步驟：

設定遠端 MCP 的替代方法

🤝 推薦的 MCP 客戶端

⚠️ 重要注意事項

📝 貢獻

📞 支援

🚀 更多功能即將推出

注意：請確保您使用的 Node 版本 >= `18.0`

注意：請確保您使用的 Node 版本 >= `18.0`

注意：請確保您使用的 Node 版本 >= `18.0`