Debugg AI MCPサーバー

「Debugg AI」MCPサーバーとは？

Debugg AI MCPサーバーは、Model Context Protocol（MCP）を基盤としたAI駆動のブラウザ自動化・エンドツーエンド（E2E）テストサーバーです。AIアシスタントやエージェントが、自然言語コマンドやCLIツールによってUIテストを自動化し、ユーザー行動をシミュレート、稼働中Webアプリケーションのビジュアル出力を解析できます。このサーバーは、Playwrightなどのテストフレームワークやブラウザプロキシなどの手動セットアップを不要にし、完全リモートで管理されたソリューションを提供します。安全なトンネル経由でローカルやリモート開発環境とシームレスに統合でき、開発者はユーザーストーリーに基づくUIテストをトリガーしたり、テスト履歴を追跡したり、これらのワークフローをCI/CDパイプラインに組み込むことで、生産性と信頼性を高めます。

プロンプト一覧

リポジトリにはプロンプトテンプレートに関する情報はありません。

リソース一覧

リポジトリに明示的なリソースの記載はありません。

ツール一覧

• debugg_ai_test_page_changes
  ユーザーストーリーや自然言語記述に基づいてUIテストをトリガーできます。このツールはブラウザ操作やE2Eテストフローを自動化し、進行状況や結果をユーザーに報告します。

本MCPサーバーのユースケース

• UI自動テスト
  自然言語記述を用いてWebアプリのE2E UIテストを即時に実行し、手動によるテストスクリプト作成を削減します。
• ローカルホストWebアプリ統合
  任意のローカルホストポートで稼働する開発アプリに対し、追加設定不要で実際のユーザー操作やフローをシミュレートしてテストします。
• CI/CD（継続的インテグレーション/デプロイメント）
  CI/CDパイプラインにE2E自動テストを組み込み、新しいコード変更のデプロイ前にバリデーションします。
• ビジュアル出力解析
  テストワークフローの一部としてUIのビジュアル変更やリグレッションを自動解析します。
• テスト履歴追跡
  Debugg.AIダッシュボードで過去すべてのテスト結果を確認・レビューし、監査や改善に役立てます。

導入方法

Windsurf

1. Node.jsなどの前提条件がインストールされていることを確認します。
2. Windsurfの設定ファイルを開きます。
3. MCPサーバーリストに下記JSONを追加します:

   {
     "mcpServers": {
       "debugg-ai-mcp": {
         "command": "npx",
         "args": ["@debugg-ai/mcp-server@latest"]
       }
     }
   }
   

4. 設定を保存してWindsurfを再起動します。
5. サーバーが稼働しアクセス可能であることを確認します。

Claude

1. Node.jsが未インストールの場合はインストールします。
2. ClaudeのMCP設定セクションを探します。
3. Debugg AI MCPサーバーを追加します:

   {
     "mcpServers": {
       "debugg-ai-mcp": {
         "command": "npx",
         "args": ["@debugg-ai/mcp-server@latest"]
       }
     }
   }
   

4. 保存してClaudeを再起動します。
5. MCPツールが利用可能か確認してサーバー統合を確認します。

Cursor

1. システムにNode.jsをセットアップします。
2. CursorのMCP設定ファイルを編集します。
3. サーバーエントリを挿入します:

   {
     "mcpServers": {
       "debugg-ai-mcp": {
         "command": "npx",
         "args": ["@debugg-ai/mcp-server@latest"]
       }
     }
   }
   

4. 保存してCursorをリロードします。
5. Debugg AIサーバーツールがツールレジストリに登録されていることを確認します。

Cline

1. Node.jsがインストールされていることを確認します。
2. ClineのMCP設定ファイルを開きます。
3. 下記の設定を追加します:

   {
     "mcpServers": {
       "debugg-ai-mcp": {
         "command": "npx",
         "args": ["@debugg-ai/mcp-server@latest"]
       }
     }
   }
   

4. ファイルを保存してClineを再起動します。
5. サーバーの利用可能性を検証します。

APIキーの安全な管理

APIキーを安全に管理するには、設定で環境変数を利用してください:

{
  "mcpServers": {
    "debugg-ai-mcp": {
      "command": "npx",
      "args": ["@debugg-ai/mcp-server@latest"],
      "env": {
        "DEBUGG_AI_API_KEY": "${DEBUGG_AI_API_KEY}"
      },
      "inputs": {
        "apiKey": "${DEBUGG_AI_API_KEY}"
      }
    }
  }
}

フロー内でのMCP利用方法

FlowHuntでのMCP利用

MCPサーバーをFlowHuntワークフローに統合するには、最初にMCPコンポーネントをフローに追加し、AIエージェントと接続してください。

MCPコンポーネントをクリックして設定パネルを開き、システムMCP設定セクションに以下のJSON形式でMCPサーバー情報を入力します:

{
  "debugg-ai-mcp": {
    "transport": "streamable_http",
    "url": "https://yourmcpserver.example/pathtothemcp/url"
  }
}

設定後、AIエージェントはこのMCPの全機能・能力をツールとして利用できるようになります。“debugg-ai-mcp"は実際の名称に、URLは自身のMCPサーバーURLに置き換えてください。

概要

AI駆動のE2Eテスト向けに堅実なMCPサーバーですが、ドキュメント化されたプロンプトテンプレートや明示的なリソースがないため、高度なMCPワークフローへの拡張性は制限されます。ツールやセットアップは直感的かつ基本的な自動化ユースケースをしっかりカバーしています。評価: 6/10

MCPスコア