Signal Collective
Asia & the West Book a call
Signal Collective The Library Building
Built from zero · Without ad spend · Yours to run

Building · For anyone building their own product with an AI. · a tool

Your AI checks your site actually works

The open-source project chrome-devtools-mcp, by ChromeDevTools

“Chrome DevTools for coding agents” — the project's own words, on GitHub

What it does
This gives your AI a real Chrome browser it can drive itself, instead of guessing whether the page you asked for actually works. It opens your site, clicks through it, and reads back exactly what a browser sees: console errors, failed network requests, how long the page took to load, and a screenshot of the result. So when you ask your AI to build a feature, it can check its own work — open the page, try the button, read the error — instead of you copying and pasting screenshots and error messages back and forth every time something breaks.
Replaces
manually screenshotting your app and pasting console errors back to your AI by hand
For
Someone building their own web product with an AI who wants that AI to actually look at the running page instead of guessing whether it works.
Not for
Not for someone without a current Chrome install on this machine, or for checking a site you don't control — it drives a browser, and it should only be pointed at pages you're allowed to open.
Setup
15 min · Claude Code, Kimi, Gemini CLI or Codex · node, npm, Chrome (current stable or newer)
You ask It works the list Green before it ships > add the sign-up > and the tests BEFORE IT SHIPS it never pushes on its own

Get it running

Paste this into the AI that runs on your computer. It does the install, checks it works, and tells you what to type first. If anything fails, paste the error back to it.

Haven't got one of these running yet? The Kit sets one up on your computer — a guided install your assistant does for you, and five workflows to start with. 12 min to read, 15 min to set up

Paste into Claude Code
Install chrome-devtools-mcp (https://github.com/ChromeDevTools/chrome-devtools-mcp) on this computer and get it working for me. I am not a developer; explain each step in one line as you go and never skip one. You are Claude Code, running on my machine.

1. Check what this machine already has (git, Python or Node as the project needs, Docker if the README says so). Tell me anything missing and install it, asking me before anything that needs my password.
2. Add it to the MCP config as `npx -y chrome-devtools-mcp@latest` — there is nothing to clone and no separate install step.
3. Configure it. If it needs an API key or a login, stop and ask me for it; never guess one and never store it anywhere except where the README says.
   Tool-specific notes: Add it to the MCP config as `npx -y chrome-devtools-mcp@latest` — no separate install step first.
It needs a current stable Chrome (or Chrome for Testing) already on this machine; other Chromium browsers aren't supported and behave unpredictably.
It sends usage statistics by default — pass `--no-usage-statistics` or set `CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS` if the reader doesn't want that.
Confirm it's connected with the README's own check: ask it to "Check the performance of https://developers.chrome.com" and see a real trace come back.
4. Run the smallest test the README gives, and show me the output.
5. When it works, tell me what to type first, in one line, for this job: Check your own site's console for errors.
If anything fails, show me the exact error and fix it before going on.

What to point it at first

1

Check your own site's console for errors

Point it at a page you're building and ask it to open the page and read back any console errors or failed requests — that's the first honest signal something's broken.

2

Check page load performance

Ask it to check the performance of a page you built; it traces the load and tells you what's actually slow, not what you assume is slow.

3

Click through a flow and watch what breaks

Have it click a button or fill a form on your own app and report exactly what happened — a screenshot and the console output — before you trust that a change worked.

What it must never do unattended

  • Never let it push to production or change a public interface on its own.
  • Never past a login or a CAPTCHA. Public pages only; respect robots.txt and the site's terms.

Who made it

ChromeDevTools/chrome-devtools-mcp on GitHub, under the Apache-2.0 licence. 51,386 stars, checked 9 September 2026. Last change 8 September 2026. We did not write it; we checked it, and wrote this page so you can use it.

Also in Building

You ask It works the list Green before it ships > add the sign-up > and the tests BEFORE IT SHIPS it never pushes on its own
Tool · Building · github-mcp-server

Your AI works on your real code, not a copy

This connects your AI to your actual GitHub account, so it can work from your real repositories instead of a file you copied in.

15 min · your AI on your computer · docker, a GitHub personal access tokenOpen
You ask It works the list Green before it ships > add the sign-up > and the tests BEFORE IT SHIPS it never pushes on its own
Tool · Building · magic-mcp

Drop finished screens into what your AI is building

This connects your coding AI to a catalogue of ready-made interface pieces — buttons, forms, navigation, whole page sections — so when you ask for a settings screen or a signup form, it can search for a working version, read the real code, and bring it into your project with everything it depends on, instead of writing it from scratch and guessing at the styling.

10 min · your AI on your computer · node, an API key from 21st.devOpen
You ask It works the list Green before it ships > add the sign-up > and the tests BEFORE IT SHIPS it never pushes on its own
Tool · Building · playwright-mcp

Your AI tests your product before customers do

This gives your AI a browser it can operate directly — Chrome, Firefox, or Safari's engine — so it can test whatever you're building the way a real visitor would, not just read the code.

15 min · your AI on your computer · node (18 or newer)Open

What's in the library is how we work.

If you're launching or growing a brand across Asia and the West, a call is where we work out whether it's a fit.