从 Playwright MCP 到 Playwright CLI

一句话版：我把浏览器自动化从 MCP 换成了 CLI，核心目的只有一个，直接复用我当前正在用、已经登录好的 Chrome。

这篇只讲一条我已经跑通的路径：Playwright CLI + 官方 skill + extension attach。不展开 CDP，也不聊复杂原理，照着做就行。

这套方案适合什么场景

你可以先代入一个很常见的场景：

Chrome 里已经登录好了公司后台、GitHub、云平台、各种内部系统。
你不想再开一个全新的浏览器，也不想再重新登录一遍。
你想让 Codex 直接接管你当前正在用的浏览器，帮你查页面、点按钮、填表单、看日志。

如果你的需求是这个，那 playwright-cli 就比 MCP 更贴近实际使用。

为什么我会从 MCP 换到 CLI

还有一个很现实的原因：MCP 这条链路在 Codex App 里我遇到过不少问题，比如内存泄漏、会话失效、偶发不可用，整体稳定性不太让人放心。
我最在意的是复用现有 Chrome 的登录态和使用环境。
CLI 更轻，页面快照、console、截图这些内容都直接写到本地文件里，不会把一大堆页面信息塞进上下文。
对 Codex 这种偏命令行调用的 agent 来说，CLI 更直接，也更容易控。

整体流程其实就 4 步

安装 Playwright CLI
安装官方 skill
放一个配置文件，让它默认走 Chrome 扩展模式
执行 attach，连接你当前打开的 Chrome

1. 安装 Playwright CLI

先全局安装 CLI：

powershell 复制代码

npm install -g @playwright/cli@latest
playwright-cli --version
where.exe playwright-cli

如果最后一条命令指到了 Volta 的路径，也是正常的，不影响使用。

2. 安装官方 skill

如果你是在 Codex 里用，直接装 agents 版 skill：

powershell 复制代码

playwright-cli install --skills=agents

装完以后，重启 Codex。

你可以把这一步理解成：让 Codex 知道以后要怎么调用 playwright-cli。

3. 配置统一目录

这一步的目的很简单：把 Playwright CLI 产生的输出和会话信息，都收口到项目里的同一个目录，别散落到系统目录里。

先在项目根目录新建 .playwright/cli.config.json：

json 复制代码

{
  "extension": true,
  "outputDir": ".playwright-cli",
  "browser": {
    "browserName": "chromium",
    "launchOptions": {
      "channel": "chrome"
    }
  }
}

然后再把运行时目录也指到同一个 .playwright-cli：

powershell 复制代码

setx PLAYWRIGHT_DAEMON_SESSION_DIR "$((Get-Location).Path)\.playwright-cli"

执行完后，重启终端或 Codex。

这里面有两个名字看起来有点像，但你可以先这样理解：

outputDir：放快照、console、截图这些输出文件。
PLAYWRIGHT_DAEMON_SESSION_DIR：放 CLI 的会话和运行时信息。

对于日常使用来说，最简单的做法就是把它们都统一到 .playwright-cli。

4. 连接你当前正在用的 Chrome

先正常打开并登录你的 Chrome，然后在项目根目录执行：

powershell 复制代码

playwright-cli attach --config .playwright\cli.config.json --extension=chrome

第一次连接时，Chrome 扩展会弹出一个连接页，让你选择一个当前已经打开的标签页，然后点 Connect。

这一步完成后，playwright-cli 就不再是新起一个浏览器，而是接到你现在正在用的 Chrome 上。

5. 怎么确认它真的连上了

连上以后，先跑这两条：

powershell 复制代码

playwright-cli list
playwright-cli tab-list

只要 playwright-cli list 里已经出现 chrome (attached)，就说明连接成功了。

6. 日常最常用的几条命令

下面这些基本就是高频动作：

powershell 复制代码

playwright-cli snapshot
playwright-cli --raw eval "document.title + ' | ' + location.href"
playwright-cli goto https://example.com
playwright-cli click e6
playwright-cli fill e53 "Playwright"
playwright-cli press Enter
playwright-cli reload

简单解释一下：

snapshot：抓当前页面结构，拿元素引用。
eval：看当前页面标题、地址，或者读一点页面信息。
goto：跳转到指定网址。
click / fill / press：点、填、按键。
reload：刷新页面。

这些命令跑完后，相关的 page snapshot、console 等文件，都会落到 .playwright-cli/ 目录里。

7. 我现在给 Codex 的默认规范

text 复制代码

涉及浏览器自动化时，默认使用 `playwright-cli attach --config .playwright\cli.config.json --extension=chrome` 复用当前已打开且已登录的 Chrome，会话失败前不要启动新的浏览器实例。

如果你也想把浏览器自动化从 MCP 切到 CLI，我建议先把这条路径跑通：安装 CLI、安装 skill、配好 .playwright/cli.config.json、然后用 attach 接到你现有的 Chrome。先把这条最短路径打通，再慢慢补别的玩法。