This is a Chrome DevTools Protocol wrapper that lets Claude reuse your existing browser sessions instead of starting fresh each time. You launch Chrome in debug mode on port 9222, then use the agent-browser CLI to open pages, extract auth tokens from localStorage or cookies, click buttons, fill forms, and grab screenshots. The main win is skipping login flows by tapping into sessions you've already authenticated. It requires Node.js 16+ and the agent-browser package installed globally. The docs are bilingual Chinese/English and cover the basics well, though you'll need to handle CDP port conflicts and zombie Chrome processes yourself. If you're doing any kind of authenticated scraping or need Claude to interact with sites where you're already logged in, this saves a lot of headache.

skills.sh installs
11.8K
GitHub stars
5.1K
last updated
Aug 21, 2026

Install

$ npx -y skills add worldwonderer/oh-story-claudecode --skill browser-cdp --agent claude-code

Installs into .claude/skills of the current project.

Files

Browser CDP 操作工具

通过 CDP(Chrome DevTools Protocol)连接 Chrome,复用登录态并执行浏览器操作。

前置条件

  • macOS / Linux / Windows(实验性),已安装并使用过 Google Chrome,来源 profile 已存在
  • Node.js 20+
  • agent-browser 已安装:npm install -g agent-browser

启动或重建时,若需结束 Chrome 进程,先按下方流程征得同意;未保存的标签页或草稿可能丢失。


启动流程(每次都按这个顺序)

下文 {SKILL_DIR} 指本 skill(browser-cdp)的目录。

第一步:探测当前状态(无副作用)

node {SKILL_DIR}/scripts/setup-cdp-chrome.js 9222 --detect-only

输出形如:

CDP_STATUS=ready                        # 已就绪,可直接复用
CDP_URL=http://127.0.0.1:9222/json/version
BROWSER=Chrome/148.0.7778.168

或:

CDP_STATUS=needs-setup
CHROME_RUNNING=yes                      # 用户有 Chrome 在跑,启动会杀掉
CHROME_PID_COUNT=3

第二步:根据探测结果分支

  • CDP_STATUS=needs-setup 且 CHROME_INSTALLED=no → 本机没找到 Chrome,告诉用户先安装并用它登录一次需要的网站,不要运行 setup。
  • CDP_STATUS=ready 且本次只需连接 → 直接使用 agent-browser --cdp 9222 ...,不要运行 setup。
  • 明确请求 --reset / --profile → 即使 ready 也走重建,按下方「需要结束 Chrome 时」处理。
  • CDP_STATUS=needs-setup 且 CHROME_RUNNING=no → 安全启动:
    node {SKILL_DIR}/scripts/setup-cdp-chrome.js 9222 --yes
    
  • CDP_STATUS=needs-setup 且 CHROME_RUNNING=yes → 按下方「需要结束 Chrome 时」处理。

Sponsors

Details

Repository
github.com/worldwonderer/oh-story-claudecode
Categories
Backend & APIs, AI & Agent Building, Debugging, Automation & Workflows
First seen
May 16, 2026

More from worldwonderer/oh-story-claudecode

All 13
1wshobson avatargo-concurrency-patternswshobson/agentsMaster Go concurrency with goroutines, channels, sync primitives, and context. Use when building concurrent Go applications, implementing worker pools, or debug11.7Kskills.sh installs
2earthtojake avatarurdfearthtojake/text-to-cadURDF robot description generation and default generation-time validation. Use when creating, editing, regenerating, inspecting, or debugging `.urdf` files, Pyth11.5Kskills.sh installs
3wshobson avatarincident-runbook-templateswshobson/agentsCreate structured incident response runbooks with step-by-step procedures, escalation paths, and recovery actions. Use this skill when building a service outage11.4Kskills.sh installs
4intellectronica avatarcontext7intellectronica/agent-skillsRetrieve up-to-date documentation for software libraries, frameworks, and components via the Context7 API. This skill should be used when looking up documentati11.3Kskills.sh installs
5getcargohq avatarcargo-workspace-managementgetcargohq/cargo-skillsManage workspace users, API tokens, folders, roles, and submit reports to workspace management using the Cargo CLI. Use when the user wants to invite or manage 11.2Kskills.sh installs
6shopify avatarshopify-polaris-app-homeshopify/shopify-ai-toolkitBuild your app's primary user interface embedded in the Shopify admin. If the prompt just mentions `Polaris` and you can't tell based off of the context what AP11Kskills.sh installs