Browser Devtools MCP Vscode Extension
未认领VSCode Extension for the Browser DevTools MCP Server which is a Playwright-based MCP server that exposes a live browser as a traceable, inspectable, debuggable and controllable execution environment for AI agents.
01 / 选择客户端
03 / 添加配置
claude mcp add --transport stdio 'browser-devtools-mcp-vscode-extension' -- 'npx' '-y' 'vsce' 'package'04 / 在客户端中确认
打开客户端的 MCP 设置，确认服务器已连接并列出工具。复制配置不代表连接成功。
更多Search & Web服务器
浏览完整目录安全概况
已认领和已认证的服务器每周接受一次静态扫描，显示代码能触及的范围（外部服务、环境变量、shell 命令、代理配置目录）以及带有已知公告的依赖。认领此列表即可获得。 安全概况的工作原理
40 个工具中显示 40 个
文档中列出的工具 (40)
内容来自项目文档。服务器握手不会验证每个工具的说明或行为。
a11y_take-aria-snapshot
Get ARIA snapshot (YAML format)
a11y_take-ax-tree-snapshot
Get AX tree with visual diagnostics
content_get-as-html
Get page HTML with filtering options
content_get-as-text
Get visible text content
content_save-as-pdf
Save page as PDF
content_take-screenshot
Take a screenshot (full page or element)
debug_add-watch
Add watch expression (evaluated at every tracepoint hit)
debug_clear-probes
Clear tracepoints, logpoints, and/or watch expressions
debug_list-probes
List tracepoints, logpoints, and/or watches
debug_put-exceptionpoint
Configure exception breakpoints (none, uncaught, all)
debug_put-logpoint
Set a logpoint (evaluates expression)
debug_put-tracepoint
Set a tracepoint (captures call stack)
debug_remove-probe
Remove a tracepoint, logpoint, or watch by type and id
execute
Batch-execute multiple tool calls in one request via JavaScript; use callTool(name, input, returnOutput?) to invoke tools. On browser platform the script has page (Playwright Page) for page.evaluate(), page.locator(), etc. Reduces round-trips and token usage.
figma_compare-page-with-design
Compare page with Figma design
interaction_click
Click an element
interaction_drag
Drag and drop
interaction_fill
Fill an input field
interaction_hover
Hover over an element
interaction_press-key
Press a keyboard key
interaction_resize-viewport
Resize viewport (Playwright emulation)
interaction_resize-window
Resize browser window (OS-level)
interaction_scroll
Scroll page or element
interaction_select
Select dropdown option
navigation_go-back-or-forward
Go back or forward in history (direction: back \
navigation_go-to
Navigate to a URL
navigation_reload
Reload the page
o11y_get-console-messages
Get console logs with filtering
o11y_get-http-requests
Get network requests with filtering
o11y_get-trace-id
Get current OpenTelemetry trace ID
o11y_get-web-vitals
Get Web Vitals (LCP, INP, CLS, TTFB, FCP)
o11y_new-trace-id
Generate new trace ID
o11y_set-trace-id
Set trace ID for distributed tracing
react_get-component-for-element
Get React component for DOM element
react_get-element-for-component
Get DOM element for React component
stub_clear
Clear stubs
stub_intercept-http-request
Intercept and modify requests
stub_list
List installed stubs
stub_mock-http-response
Mock HTTP response
sync_wait-for-network-idle
Wait for network to become idle