> ## Documentation Index
> Fetch the complete documentation index at: https://extension.js.org/llms.txt
> Use this file to discover all available pages before exploring further.

# Chrome DevTools MCP with Extension.js

> Use Google's chrome-devtools-mcp beside an Extension.js dev session: what it adds, the activeTab gesture caveat, and where the two-server setup is documented.

[chrome-devtools-mcp](https://github.com/ChromeDevTools/chrome-devtools-mcp) gives an AI agent raw control of a live Chrome instance. Recent versions added extension tools: `install`, `list`, `reload`, `trigger` and `uninstall`, plus service worker logs. It is a Google project, and it does not know about your build. It pairs well with an Extension.js dev session, which owns the build, the reload and the generated manifest.

## What it adds to a dev session

* Driving arbitrary pages: click, scroll, fill forms.
* Performance traces, Lighthouse audits and network inspection.
* Inspecting an extension that you did not build.
* Triggering the toolbar action with a real user gesture.

Everything that touches your project stays with Extension.js: `extension dev` for the build and the reload, and `extension logs`, `extension eval`, `extension storage` and `extension open` for observation and control. See [Debugging](/docs/debugging).

## The gesture caveat

`extension open action` replays your `chrome.action.onClicked` handler without a user gesture. It is scriptable and headless, and it works on Chromium and Firefox, but it does not grant `activeTab`. When a handler depends on that grant, use chrome-devtools-mcp's `trigger_extension_action`, which clicks the real button through Puppeteer. It is Chromium only and needs a visible window. The replay is described in [Trigger actions and keyboard commands](/docs/debugging/trigger-actions-and-commands).

<Note>
  The chrome-devtools-mcp extension tools (`--categoryExtensions`) need a pipe
  connection. Attaching to an already running browser over a WebSocket endpoint
  is not supported for that category before Chrome 149.
</Note>

## Run it beside the extension.dev MCP server

extension.dev ships an MCP server that exposes the same session to an agent as tools. They are namespaced `extension_*`, so the two servers never collide. The two-server config, the capability map and the "when to use which" table live on [docs.extension.dev/tools/chrome-devtools-mcp](https://docs.extension.dev/tools/chrome-devtools-mcp).

## Next steps

* [extension.dev MCP server](/docs/integrations/extension-mcp): the pointer page for the server and the skill.
* [AI access via MCP and llms.txt](/docs/ai-access): give your assistant the docs.
* [CI templates](/docs/workflows/ci-templates): wire the checks into CI.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.