Browser Daemon

Browser Daemon - 持久化浏览器自动化

持久化浏览器守护进程，可保持 Chrome 打开，并通过基于文件的 IPC 接收命令。

快速开始

启动守护进程（每个会话启动一次）

cd ~/.claude/skills/playwright-skill
node browser-daemon.js

或者询问：“在后台启动浏览器守护进程”

浏览器窗口会打开并保持打开状态。

发送命令

使用绝对路径（更简洁，无需切换目录）：

# Navigate
~/.claude/skills/playwright-skill/browser-client.js navigate "http://localhost:8080/..."

# Execute JavaScript
~/.claude/skills/playwright-skill/browser-client.js exec "document.title"
~/.claude/skills/playwright-skill/browser-client.js exec "document.querySelectorAll('div').length"

# Console logs
~/.claude/skills/playwright-skill/browser-client.js console
~/.claude/skills/playwright-skill/browser-client.js console-clear

# Status
~/.claude/skills/playwright-skill/browser-client.js status

# Resize viewport
~/.claude/skills/playwright-skill/browser-client.js resize 1920 1080

两个脚本都带有 shebang 且可执行，因此可以直接调用。

架构

Claude (Bash tool)
    ↓
browser-client.js (writes .browser-command)
    ↓
browser-daemon.js (polls, executes, writes .browser-result)
    ↓
Chrome Browser (Playwright-controlled)

IPC 文件：

• .browser-command - 命令输入（JSON）
• .browser-result - 命令输出（JSON）
• .browser-ready - 就绪信号（守护进程运行时存在）

运行期间会自动创建和删除文件。

命令

navigate

导航到 URL 并等待页面加载。

node browser-client.js navigate "http://localhost:8080/page"

返回：{ success: true, url: string, title: string }

exec

在浏览器上下文中执行 JavaScript。

node browser-client.js exec "document.querySelectorAll('div').length"

返回：{ success: true, result: any }

console

获取所有已捕获的控制台日志。

node browser-client.js console

返回：{ success: true, logs: [{ type, text, location }] }

console-clear

清除控制台日志缓冲区。

node browser-client.js console-clear

返回：{ success: true }

status

检查守护进程状态和当前页面信息。

node browser-client.js status

返回：{ success: true, url, title, consoleLogsCount }

resize

调整浏览器视口大小。

node browser-client.js resize 1920 1080

返回：{ success: true, width, height }

守护进程行为

• 启动 Chrome（而非 Chromium）以支持 H.264 编解码器
• 启动时将视口设为可用屏幕的完整尺寸
• 自动捕获所有控制台输出（log、warn、error、debug、pageerror）
• 每 100ms 轮询一次命令
• 延迟重启：浏览器关闭后收到命令时，守护进程会检测到关闭状态，重启浏览器，恢复上次访问的 URL，然后执行命令

浏览器配置

chromium.launch({
  channel: 'chrome',      // Use Google Chrome, not Chromium
  headless: false,        // Visible window
  args: ['--start-maximized']
})

重要注意事项

无法手动调整窗口大小：

• Playwright 独立控制视口和窗口
• 手动调整浏览器窗口大小不会改变视口
• 调整窗口大小不会触发 JavaScript resize 事件
• 请改用 resize 命令：node browser-client.js resize 1024 768

DevTools 覆层：

• 打开 DevTools 不会调整视口大小，而是覆盖在视口上方
• 不会触发 resize 事件
• 不会改变 window.innerWidth/Height

视口与窗口：

• window.innerWidth/Height - 视口（由 Playwright 控制）
• window.outerWidth/Height - 窗口大小
• 只能通过 resize 命令更改视口

使用场景

交互式开发： 测试更改时保持浏览器打开，无需手动操作即可重新加载并检查控制台。

调试控制台日志： 借助自动捕获的来源位置，追踪日志来源。

检查页面状态： 通过执行 JavaScript 查询 DOM、检查元素数量和计算样式。

测试工作流： 自动执行多步骤浏览器交互（导航、填写表单、提交、检查结果）。

故障排除

守护进程无响应：

ls ~/.claude/skills/playwright-skill/.browser-ready
cd ~/.claude/skills/playwright-skill && node browser-daemon.js

命令超时：

• 检查浏览器窗口是否仍处于打开状态
• 终止守护进程并重新启动
• 清理卡住的文件：rm -f .browser-command .browser-result

浏览器窗口已关闭：

• 终止守护进程（Ctrl+C）
• 重新启动：node browser-daemon.js
• 或发送任意命令——将自动触发延迟重启

设置（首次使用）

cd ~/.claude/skills/playwright-skill
npm install

这会安装 Playwright 并下载 Chrome 浏览器。

高级功能

请参阅 META_COMMANDS.md，了解 Playwright 基础测试之外元级功能的完整参考：

• 页面事件（控制台、网络、对话框、工作线程、框架、生命周期）
• 内容捕获（截图、PDF、HTML、视频）
• 网络控制（拦截、模拟、HAR 重放、WebSockets）
• 脚本注入和 Node.js 函数公开
• 性能指标和垃圾回收
• Chrome DevTools Protocol（CDP）访问，用于底层浏览器控制
• 浏览器上下文事件和元方法

集成说明

当用户请求浏览器交互时：

1. 检查守护进程是否正在运行（.browser-ready 文件是否存在）
2. 如果没有运行，询问是否要将其作为后台任务启动
3. 使用 browser-client.js 命令执行操作
4. 向用户报告结果

用户可以请求其他功能——代码库结构简单，且文档完善，便于扩展。