BrowserTools MCP logo

BrowserTools MCP

by AgentDeskAI

BrowserTools MCP is a powerful browser monitoring and interaction tool that enables AI-powered applications to capture and analyze browser data through a Chrome extension. It allows AI tools to interact with your browser more effectively.

View on GitHub

Last updated: N/A

What is BrowserTools MCP?

BrowserTools MCP is a toolset comprised of a Chrome extension, a Node server, and an MCP server that allows AI clients to interact with and analyze browser data. It provides standardized tools for AI clients to monitor browser console output, capture network traffic, take screenshots, analyze selected elements, and run various audits.

How to use BrowserTools MCP?

To use BrowserTools MCP, you need to install the Chrome extension, install the MCP server using npx @agentdeskai/browser-tools-mcp@latest in your IDE, and run the Node server using npx @agentdeskai/browser-tools-server@latest in a new terminal. After installation, open the BrowserToolsMCP panel in Chrome DevTools and use example queries to trigger audits and debugging tools.

Key features of BrowserTools MCP

  • Browser monitoring and interaction

  • Chrome extension integration

  • MCP server for AI clients

  • Accessibility audits

  • Performance audits

  • SEO audits

  • Best practices audits

  • NextJS audits

  • Debugger Mode

  • Audit Mode

Use cases of BrowserTools MCP

  • Improving SEO for web pages

  • Identifying accessibility issues

  • Finding performance bottlenecks

  • Debugging web applications

  • Automating browser tasks with AI

  • Integrating browser data with AI models

  • Testing web applications for best practices

  • Auditing NextJS applications

FAQ from BrowserTools MCP

What is MCP?

Model Context Protocol (MCP) is a capability supported by Anthropic AI models that allow you to create custom tools for any compatible client.

Where are logs stored?

All logs are stored locally on your machine and NEVER sent out to any third-party service or API.

What are the core components?

The core components are a Chrome Extension, a Node Server, and an MCP Server.

What kind of audits can I run?

You can run accessibility, performance, SEO, best practices, and NextJS audits.

What if I have issues?

Quit/close down your browser, restart the local node server, and make sure you only have ONE instance of chrome dev tools panel open. If that doesn't work, open an issue ticket on GitHub.