io.github.serkan-ozal/browser-devtools-mcp

السجل الرسمي أدوات المطورين

Playwright browser & Node.js MCP. ARIA refs, screenshots, ref-based interactions.

التثبيت

أضف هذا إلى إعدادات MCP في عميلك (Claude Desktop: claude_desktop_config.json، وCursor: ‏.cursor/mcp.json، ويستخدم VS Code وغيره الصيغة نفسها «mcpServers»).

Remote (streamable-http)
Claude Code
claude mcp add --transport http browser-devtools-mcp 'https://{your_mcp_server_host}/mcp'
إعداد JSON (Claude Desktop وCursor وVS Code)
{
    "mcpServers": {
        "browser-devtools-mcp": {
            "type": "http",
            "url": "https://{your_mcp_server_host}/mcp"
        }
    }
}
NPM package browser-devtools-mcp
Claude Code
claude mcp add browser-devtools-mcp -e 'PLATFORM=<PLATFORM>' -e 'PORT=<PORT>' -e 'SESSION_IDLE_SECONDS=<SESSION_IDLE_SECONDS>' -e 'SESSION_IDLE_CHECK_SECONDS=<SESSION_IDLE_CHECK_SECONDS>' -e 'SESSION_CLOSE_ON_SOCKET_CLOSE=<SESSION_CLOSE_ON_SOCKET_CLOSE>' -e 'CONSOLE_MESSAGES_BUFFER_SIZE=<CONSOLE_MESSAGES_BUFFER_SIZE>' -e 'HTTP_REQUESTS_BUFFER_SIZE=<HTTP_REQUESTS_BUFFER_SIZE>' -e 'BROWSER_SERVER_INSTRUCTIONS_ENABLE=<BROWSER_SERVER_INSTRUCTIONS_ENABLE>' -e 'BROWSER_POLICY_UI_DEBUGGING_ENABLE=<BROWSER_POLICY_UI_DEBUGGING_ENABLE>' -e 'BROWSER_HEADLESS_ENABLE=<BROWSER_HEADLESS_ENABLE>' -e 'BROWSER_PERSISTENT_ENABLE=<BROWSER_PERSISTENT_ENABLE>' -e 'BROWSER_CDP_ENDPOINT_URL=<BROWSER_CDP_ENDPOINT_URL>' -e 'BROWSER_CDP_ENABLE=<BROWSER_CDP_ENABLE>' -e 'BROWSER_CDP_OPEN_INSPECT=<BROWSER_CDP_OPEN_INSPECT>' -e 'BROWSER_PERSISTENT_USER_DATA_DIR=<BROWSER_PERSISTENT_USER_DATA_DIR>' -e 'BROWSER_USE_INSTALLED_ON_SYSTEM=<BROWSER_USE_INSTALLED_ON_SYSTEM>' -e 'BROWSER_EXECUTABLE_PATH=<BROWSER_EXECUTABLE_PATH>' -e 'BROWSER_CHROMIUM_SANDBOX=<BROWSER_CHROMIUM_SANDBOX>' -e 'BROWSER_LAUNCH_ARGS=<BROWSER_LAUNCH_ARGS>' -e 'BROWSER_ALLOWED_DOMAINS=<BROWSER_ALLOWED_DOMAINS>' -e 'BROWSER_LOCALE=<BROWSER_LOCALE>' -e 'OTEL_ENABLE=<OTEL_ENABLE>' -e 'OTEL_SERVICE_NAME=<OTEL_SERVICE_NAME>' -e 'OTEL_SERVICE_VERSION=<OTEL_SERVICE_VERSION>' -e 'OTEL_ASSETS_DIR=<OTEL_ASSETS_DIR>' -e 'OTEL_INSTRUMENTATION_USER_INTERACTION_EVENTS=<OTEL_INSTRUMENTATION_USER_INTERACTION_EVENTS>' -e 'OTEL_EXPORTER_TYPE=<OTEL_EXPORTER_TYPE>' -e 'OTEL_EXPORTER_HTTP_URL=<OTEL_EXPORTER_HTTP_URL>' -e 'OTEL_EXPORTER_HTTP_HEADERS=<your otel_exporter_http_headers>' -e 'AWS_REGION=<AWS_REGION>' -e 'AWS_PROFILE=<AWS_PROFILE>' -e 'AMAZON_BEDROCK_ENABLE=<AMAZON_BEDROCK_ENABLE>' -e 'AMAZON_BEDROCK_IMAGE_EMBED_MODEL_ID=<AMAZON_BEDROCK_IMAGE_EMBED_MODEL_ID>' -e 'AMAZON_BEDROCK_TEXT_EMBED_MODEL_ID=<AMAZON_BEDROCK_TEXT_EMBED_MODEL_ID>' -e 'AMAZON_BEDROCK_VISION_MODEL_ID=<AMAZON_BEDROCK_VISION_MODEL_ID>' -e 'FIGMA_ACCESS_TOKEN=<your figma_access_token>' -e 'FIGMA_API_BASE_URL=<FIGMA_API_BASE_URL>' -e 'DAEMON_PORT=<DAEMON_PORT>' -e 'DAEMON_SESSION_IDLE_SECONDS=<DAEMON_SESSION_IDLE_SECONDS>' -e 'DAEMON_SESSION_IDLE_CHECK_SECONDS=<DAEMON_SESSION_IDLE_CHECK_SECONDS>' -e 'NODE_SERVER_INSTRUCTIONS_ENABLE=<NODE_SERVER_INSTRUCTIONS_ENABLE>' -e 'NODE_POLICY_DEBUGGING_ENABLE=<NODE_POLICY_DEBUGGING_ENABLE>' -e 'NODE_INSPECTOR_HOST=<NODE_INSPECTOR_HOST>' -e 'TOOL_OUTPUT_SCHEMA_DISABLE=<TOOL_OUTPUT_SCHEMA_DISABLE>' -e 'AVAILABLE_TOOL_DOMAINS=<AVAILABLE_TOOL_DOMAINS>' -e 'WORKING_DIR=<WORKING_DIR>' -e 'SEARCH_STRATEGY=<SEARCH_STRATEGY>' -e 'SCENARIO_SEARCH_STRATEGY=<SCENARIO_SEARCH_STRATEGY>' -- npx -y browser-devtools-mcp@0.9.1
إعداد JSON (Claude Desktop وCursor وVS Code)
{
    "mcpServers": {
        "browser-devtools-mcp": {
            "command": "npx",
            "args": [
                "-y",
                "browser-devtools-mcp@0.9.1"
            ],
            "env": {
                "PLATFORM": "<PLATFORM>",
                "PORT": "<PORT>",
                "SESSION_IDLE_SECONDS": "<SESSION_IDLE_SECONDS>",
                "SESSION_IDLE_CHECK_SECONDS": "<SESSION_IDLE_CHECK_SECONDS>",
                "SESSION_CLOSE_ON_SOCKET_CLOSE": "<SESSION_CLOSE_ON_SOCKET_CLOSE>",
                "CONSOLE_MESSAGES_BUFFER_SIZE": "<CONSOLE_MESSAGES_BUFFER_SIZE>",
                "HTTP_REQUESTS_BUFFER_SIZE": "<HTTP_REQUESTS_BUFFER_SIZE>",
                "BROWSER_SERVER_INSTRUCTIONS_ENABLE": "<BROWSER_SERVER_INSTRUCTIONS_ENABLE>",
                "BROWSER_POLICY_UI_DEBUGGING_ENABLE": "<BROWSER_POLICY_UI_DEBUGGING_ENABLE>",
                "BROWSER_HEADLESS_ENABLE": "<BROWSER_HEADLESS_ENABLE>",
                "BROWSER_PERSISTENT_ENABLE": "<BROWSER_PERSISTENT_ENABLE>",
                "BROWSER_CDP_ENDPOINT_URL": "<BROWSER_CDP_ENDPOINT_URL>",
                "BROWSER_CDP_ENABLE": "<BROWSER_CDP_ENABLE>",
                "BROWSER_CDP_OPEN_INSPECT": "<BROWSER_CDP_OPEN_INSPECT>",
                "BROWSER_PERSISTENT_USER_DATA_DIR": "<BROWSER_PERSISTENT_USER_DATA_DIR>",
                "BROWSER_USE_INSTALLED_ON_SYSTEM": "<BROWSER_USE_INSTALLED_ON_SYSTEM>",
                "BROWSER_EXECUTABLE_PATH": "<BROWSER_EXECUTABLE_PATH>",
                "BROWSER_CHROMIUM_SANDBOX": "<BROWSER_CHROMIUM_SANDBOX>",
                "BROWSER_LAUNCH_ARGS": "<BROWSER_LAUNCH_ARGS>",
                "BROWSER_ALLOWED_DOMAINS": "<BROWSER_ALLOWED_DOMAINS>",
                "BROWSER_LOCALE": "<BROWSER_LOCALE>",
                "OTEL_ENABLE": "<OTEL_ENABLE>",
                "OTEL_SERVICE_NAME": "<OTEL_SERVICE_NAME>",
                "OTEL_SERVICE_VERSION": "<OTEL_SERVICE_VERSION>",
                "OTEL_ASSETS_DIR": "<OTEL_ASSETS_DIR>",
                "OTEL_INSTRUMENTATION_USER_INTERACTION_EVENTS": "<OTEL_INSTRUMENTATION_USER_INTERACTION_EVENTS>",
                "OTEL_EXPORTER_TYPE": "<OTEL_EXPORTER_TYPE>",
                "OTEL_EXPORTER_HTTP_URL": "<OTEL_EXPORTER_HTTP_URL>",
                "OTEL_EXPORTER_HTTP_HEADERS": "<your otel_exporter_http_headers>",
                "AWS_REGION": "<AWS_REGION>",
                "AWS_PROFILE": "<AWS_PROFILE>",
                "AMAZON_BEDROCK_ENABLE": "<AMAZON_BEDROCK_ENABLE>",
                "AMAZON_BEDROCK_IMAGE_EMBED_MODEL_ID": "<AMAZON_BEDROCK_IMAGE_EMBED_MODEL_ID>",
                "AMAZON_BEDROCK_TEXT_EMBED_MODEL_ID": "<AMAZON_BEDROCK_TEXT_EMBED_MODEL_ID>",
                "AMAZON_BEDROCK_VISION_MODEL_ID": "<AMAZON_BEDROCK_VISION_MODEL_ID>",
                "FIGMA_ACCESS_TOKEN": "<your figma_access_token>",
                "FIGMA_API_BASE_URL": "<FIGMA_API_BASE_URL>",
                "DAEMON_PORT": "<DAEMON_PORT>",
                "DAEMON_SESSION_IDLE_SECONDS": "<DAEMON_SESSION_IDLE_SECONDS>",
                "DAEMON_SESSION_IDLE_CHECK_SECONDS": "<DAEMON_SESSION_IDLE_CHECK_SECONDS>",
                "NODE_SERVER_INSTRUCTIONS_ENABLE": "<NODE_SERVER_INSTRUCTIONS_ENABLE>",
                "NODE_POLICY_DEBUGGING_ENABLE": "<NODE_POLICY_DEBUGGING_ENABLE>",
                "NODE_INSPECTOR_HOST": "<NODE_INSPECTOR_HOST>",
                "TOOL_OUTPUT_SCHEMA_DISABLE": "<TOOL_OUTPUT_SCHEMA_DISABLE>",
                "AVAILABLE_TOOL_DOMAINS": "<AVAILABLE_TOOL_DOMAINS>",
                "WORKING_DIR": "<WORKING_DIR>",
                "SEARCH_STRATEGY": "<SEARCH_STRATEGY>",
                "SCENARIO_SEARCH_STRATEGY": "<SCENARIO_SEARCH_STRATEGY>"
            }
        }
    }
}

متغيرات البيئة

  • PLATFORM Platform: browser (default) or node for Node.js backend debugging.
  • PORT Port for HTTP transport.
  • SESSION_IDLE_SECONDS Idle session timeout (seconds).
  • SESSION_IDLE_CHECK_SECONDS Interval for checking idle sessions (seconds).
  • SESSION_CLOSE_ON_SOCKET_CLOSE Close session when socket closes.
  • CONSOLE_MESSAGES_BUFFER_SIZE Maximum console messages to buffer.
  • HTTP_REQUESTS_BUFFER_SIZE Maximum HTTP requests to buffer.
  • BROWSER_SERVER_INSTRUCTIONS_ENABLE When true, include server instructions in MCP server info (browser platform). Default: true.
  • BROWSER_POLICY_UI_DEBUGGING_ENABLE When true, include UI_DEBUGGING_POLICY in server policies (browser platform). Default: false.
  • BROWSER_HEADLESS_ENABLE Run browser in headless mode.
  • BROWSER_PERSISTENT_ENABLE Use persistent browser context (preserves cookies, localStorage, extensions).
  • BROWSER_CDP_ENDPOINT_URL CDP attach: http(s) root or ws(s) URL. Resolves via /json/version, /json/list, or ws /devtools/browser (Chrome 136+). Mutually exclusive with BROWSER_PERSISTENT_ENABLE.
  • BROWSER_CDP_ENABLE When true and no BROWSER_CDP_ENDPOINT_URL: probe 127.0.0.1:9222 then :9229 for CDP. Else use BROWSER_CDP_ENDPOINT_URL or default http://127.0.0.1:9222.
  • BROWSER_CDP_OPEN_INSPECT On loopback CDP failure, if Chrome is running, open chrome://inspect/#remote-debugging. Default true. Set false to disable.
  • BROWSER_PERSISTENT_USER_DATA_DIR Directory for persistent browser context user data.
  • BROWSER_USE_INSTALLED_ON_SYSTEM Use system-installed Chrome browser instead of Playwright's bundled browser.
  • BROWSER_EXECUTABLE_PATH Custom browser executable path.
  • BROWSER_CHROMIUM_SANDBOX When false, launches Chromium with --no-sandbox. Required for Docker/Lambda/CI.
  • BROWSER_LAUNCH_ARGS Extra Chromium launch args (comma-separated).
  • BROWSER_ALLOWED_DOMAINS Comma-separated list of allowed hostnames. When set, all requests to non-matching hosts are aborted. Subdomains match automatically.
  • BROWSER_LOCALE Browser locale (e.g., "en-US", "tr-TR").
  • OTEL_ENABLE Enable OpenTelemetry integration.
  • OTEL_SERVICE_NAME OpenTelemetry service name.
  • OTEL_SERVICE_VERSION OpenTelemetry service version.
  • OTEL_ASSETS_DIR Directory containing OpenTelemetry bundle files.
  • OTEL_INSTRUMENTATION_USER_INTERACTION_EVENTS User interaction events to instrument (comma-separated, e.g., "click,submit").
  • OTEL_EXPORTER_TYPE OpenTelemetry exporter type: "otlp/http", "console", or "none".
  • OTEL_EXPORTER_HTTP_URL OpenTelemetry collector base URL (e.g., "http://localhost:4318").
  • OTEL_EXPORTER_HTTP_HEADERS سري OpenTelemetry exporter HTTP headers (comma-separated key=value pairs).
  • AWS_REGION AWS region for Bedrock usage.
  • AWS_PROFILE AWS profile name for Bedrock usage.
  • AMAZON_BEDROCK_ENABLE Enable Amazon Bedrock usage.
  • AMAZON_BEDROCK_IMAGE_EMBED_MODEL_ID Amazon Bedrock image embedding model ID.
  • AMAZON_BEDROCK_TEXT_EMBED_MODEL_ID Amazon Bedrock text embedding model ID.
  • AMAZON_BEDROCK_VISION_MODEL_ID Amazon Bedrock vision model ID.
  • FIGMA_ACCESS_TOKEN سري Figma API access token for design comparison.
  • FIGMA_API_BASE_URL Figma API base URL.
  • DAEMON_PORT Daemon mode port (CLI).
  • DAEMON_SESSION_IDLE_SECONDS Daemon mode idle session timeout (seconds).
  • DAEMON_SESSION_IDLE_CHECK_SECONDS Daemon mode idle session check interval (seconds).
  • NODE_SERVER_INSTRUCTIONS_ENABLE When true, include server instructions in MCP server info (node platform). Default: true.
  • NODE_POLICY_DEBUGGING_ENABLE When true, include NODE_DEBUGGING_POLICY in server policies (node platform). Default: false.
  • NODE_INSPECTOR_HOST Inspector host for debug_connect when MCP runs in Docker (e.g. host.docker.internal). Default: 127.0.0.1.
  • TOOL_OUTPUT_SCHEMA_DISABLE When true, omit tool output schema from MCP tool registration (can reduce token usage for some clients).
  • AVAILABLE_TOOL_DOMAINS Comma-separated tool domains to enable (e.g. navigation,interaction,a11y,scenario). Unset = all tools. Browser: a11y, content, debug, figma, interaction, navigation, o11y, react, scenario, run, stub, sync. Node: debug, run.
  • WORKING_DIR Working directory for project-level config (.browser-devtools-mcp/). Default: process.cwd().
  • SEARCH_STRATEGY Search strategy: SIMPLE (default, minisearch + stemmer) or FTS5 (better-sqlite3, optional dep).
  • SCENARIO_SEARCH_STRATEGY Override SEARCH_STRATEGY for scenario search only.

الأسئلة الشائعة

ما هو io.github.serkan-ozal/browser-devtools-mcp؟

Playwright browser & Node.js MCP. ARIA refs, screenshots, ref-based interactions.

كيف أثبّت io.github.serkan-ozal/browser-devtools-mcp؟

يعمل كخادم بعيد. في Claude Code: claude mcp add --transport http browser-devtools-mcp 'https://{your_mcp_server_host}/mcp'. وفي العملاء الآخرين، الصق إعداد JSON من هذه الصفحة في إعدادات MCP الخاصة بهم.

هل يحتاج io.github.serkan-ozal/browser-devtools-mcp إلى مفتاح API؟

نعم. يتطلب OTEL_EXPORTER_HTTP_HEADERS, FIGMA_ACCESS_TOKEN، وتضبطها في إعداداته.

هل io.github.serkan-ozal/browser-devtools-mcp مفتوح المصدر؟

شيفرته علنية على GitHub، لكن المستودع لا يعلن ترخيصًا قياسيًا.

من يصون io.github.serkan-ozal/browser-devtools-mcp؟

ينشره serkan-ozal. يدرجه AI.tn لكنه لا يصونه ولا يوصي به.

من سجل MCP الرسمي. الإدراج ليس توصية: راجع شيفرة الخادم وصلاحياته قبل منحه الوصول إلى بياناتك.