npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

chrome-devtools-mcp-bridge

v0.1.1

Published

Bridge TCP <-> chrome-devtools-mcp (auto-launch Chrome outside sandbox) with server/client subcommands.

Readme

English | [简体中文] | 日本語 | 韩国语 | Français | العربية | Русский | Español

chrome-devtools-mcp-bridge

一个轻量桥接工具:让处于沙箱/容器中的 MCP 客户端(如 Codex)与沙箱外运行的 chrome-devtools-mcp 通讯,并由桥接自动启动独立的 Headless Chrome。

它提供两个子命令:

  • chrome-devtools-mcp-bridge host — 在宿主机启动 TCP 服务,每次连接都会拉起 chrome-devtools-mcp 与一个独立的 Headless Chrome,并转发 TCP ↔ MCP stdio。
  • chrome-devtools-mcp-bridge connect — 将当前进程的 stdin/stdout 与桥接服务对接(非常适合需要 stdio 的 MCP 客户端,如 Codex CLI)。

用途(Why)

  1. 解除 Codex 在 Ubuntu/容器里“沙箱”导致 chrome-devtools-mcp 无法正常启动 Chrome 的问题。常见报错(利于搜索):
    • "Some MCP clients allow sandboxing the MCP server ... As a workaround, either disable sandboxing ... or use --connect-url"
    • "Failed to fetch browser webSocket URL from http://localhost:9222/json/version: fetch failed"
    • "The browser is already running for /home/me/.cache/chrome-devtools-mcp/chrome-profile. Use --isolated to run multiple browser instances."
  2. 打通 WSL 与 Windows 宿主机:在 Windows 上运行 host,在 WSL 中运行 connect,即可驱动 Windows 的 Chrome DevTools。

快速开始(npx,免安装)

  1. 在宿主机启动桥接: npx -y chrome-devtools-mcp-bridge@latest host

  2. 在 Codex/WSL(或任何沙箱/容器)中连接: codex mcp add chrome-devtools -- npx -y chrome-devtools-mcp-bridge@latest connect

提示:受限环境建议将 npx 缓存落到仓库目录 XDG_CACHE_HOME=$PWD/.cache NPM_CONFIG_CACHE=$PWD/.npm-cache npx -y chrome-devtools-mcp-bridge@latest host

守护模式与日志

  • 推荐使用内置 --daemon(可写入 PID 与日志): npx -y chrome-devtools-mcp-bridge@latest host --daemon --log-file mcp-bridge.log --pid-file mcp-bridge.pid
  • 或使用 nohup/setsid: nohup npx -y chrome-devtools-mcp-bridge@latest host > mcp-bridge.log 2>&1 & echo $! > mcp-bridge.pid

WSL ↔ Windows

  • 在 Windows 上启动:npx -y chrome-devtools-mcp-bridge@latest host
  • 在 WSL 中连接:codex mcp add chrome-devtools -- npx -y chrome-devtools-mcp-bridge@latest connect --host 127.0.0.1 --port 8211
  • 若 localhost 不通,请改用 Windows 主机 IP 并允许防火墙放行端口。