From ff3e5c6887b92b60e03e680823d3b0b92105122d Mon Sep 17 00:00:00 2001 From: jackwener Date: Tue, 17 Mar 2026 16:07:38 +0800 Subject: [PATCH] feat: enhance setup with precise token scan errors and auto-verify - When token scan fails, diagnose exact cause via checkExtensionInstalled() (extension not installed vs token not in LevelDB) - Show actionable fix instructions instead of generic warning - Auto-verify browser connectivity after writing configs (Step 7) - Simplify README setup flow to 2 steps (install + setup) --- README.md | 23 +++++++---------------- README.zh-CN.md | 21 ++++++--------------- src/setup.ts | 36 +++++++++++++++++++++++++++++++++--- 3 files changed, 46 insertions(+), 34 deletions(-) diff --git a/README.md b/README.md index 2fe2004..faa4f52 100644 --- a/README.md +++ b/README.md @@ -48,32 +48,23 @@ OpenCLI connects to your browser through the Playwright MCP Bridge extension. ### Playwright MCP Bridge Extension Setup 1. Install **[Playwright MCP Bridge](https://chromewebstore.google.com/detail/playwright-mcp-bridge/mmlmfjhmonkocbjadbfplnigmagldckm)** extension in Chrome. -2. Run `opencli doctor` to verify the extension is installed and its token is discoverable: - -```bash -opencli doctor -``` - -3. Run `opencli setup` to distribute the token to your tools: +2. Run `opencli setup` — discovers the token, distributes it to your tools, and verifies connectivity: ```bash opencli setup ``` -4. Verify end-to-end browser connectivity: - -```bash -opencli doctor --live -``` - -The `setup` TUI will: +The interactive TUI will: - 🔍 Auto-discover `PLAYWRIGHT_MCP_EXTENSION_TOKEN` from Chrome (no manual copy needed) - ☑️ Show all detected tools (Codex, Cursor, Claude Code, Gemini CLI, etc.) - ✏️ Update only the files you select (Space to toggle, Enter to confirm) +- 🔌 Auto-verify browser connectivity after writing configs -> **Tip**: If configs get out of sync later, use `opencli doctor --fix` to repair them: +> **Tip**: Use `opencli doctor` for ongoing diagnosis and maintenance: > ```bash -> opencli doctor --fix # Fix mismatched configs (interactive confirmation) +> opencli doctor # Read-only token & config diagnosis +> opencli doctor --live # Also test live browser connectivity +> opencli doctor --fix # Fix mismatched configs (interactive) > opencli doctor --fix -y # Fix all configs non-interactively > ``` diff --git a/README.zh-CN.md b/README.zh-CN.md index 5a6d038..c994183 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -47,31 +47,22 @@ OpenCLI 通过 Playwright MCP Bridge 扩展与你的浏览器通信。 ### Playwright MCP Bridge 扩展配置 1. 安装 **[Playwright MCP Bridge](https://chromewebstore.google.com/detail/playwright-mcp-bridge/mmlmfjhmonkocbjadbfplnigmagldckm)** 扩展 -2. 运行 `opencli doctor` 确认扩展已安装、Token 可被发现： - -```bash -opencli doctor -``` - -3. 运行 `opencli setup` 将 Token 分发到各工具配置： +2. 运行 `opencli setup` — 自动发现 Token、分发到各工具、验证连通性： ```bash opencli setup ``` -4. 验证浏览器端到端连通性： - -```bash -opencli doctor --live -``` - -`setup` 的交互式 TUI 会： +交互式 TUI 会： - 🔍 从 Chrome 自动发现 `PLAYWRIGHT_MCP_EXTENSION_TOKEN`（无需手动复制） - ☑️ 显示所有支持的工具（Codex、Cursor、Claude Code、Gemini CLI 等） - ✏️ 只更新你选中的文件（空格切换，回车确认） +- 🔌 完成后自动验证浏览器连通性 -> **Tip**：如果后续配置不一致，可用 `opencli doctor --fix` 修复： +> **Tip**：后续诊断和维护用 `opencli doctor`： > ```bash +> opencli doctor # 只读 Token 与配置诊断 +> opencli doctor --live # 额外测试浏览器连通性 > opencli doctor --fix # 修复不一致的配置（交互确认） > opencli doctor --fix -y # 无交互直接修复所有配置 > ``` diff --git a/src/setup.ts b/src/setup.ts index c32c1d7..3a49e5c 100644 --- a/src/setup.ts +++ b/src/setup.ts @@ -11,6 +11,8 @@ import { stdin as input, stdout as output } from 'node:process'; import { type DoctorReport, PLAYWRIGHT_TOKEN_ENV, + checkExtensionInstalled, + checkTokenConnectivity, discoverExtensionToken, fileExists, getDefaultShellRcPath, @@ -60,11 +62,24 @@ export async function runSetup(opts: { cliVersion?: string; token?: string } = { } if (!token) { - console.log(` ${chalk.yellow('!')} No token found. Please enter it manually.`); - console.log(chalk.dim(' (Find it in the Playwright MCP Bridge extension → Status page)')); + // Give precise diagnosis of why token scan failed + const extInstall = checkExtensionInstalled(); + + console.log(` ${chalk.red('✗')} Browser token scan failed\n`); + if (!extInstall.installed) { + console.log(chalk.dim(' Cause: Playwright MCP Bridge extension is not installed')); + console.log(chalk.dim(' Fix: Install from https://chromewebstore.google.com/detail/')); + console.log(chalk.dim(' playwright-mcp-bridge/mmlmfjhmonkocbjadbfplnigmagldckm')); + } else { + console.log(chalk.dim(` Cause: Extension is installed (${extInstall.browsers.join(', ')}) but token not found in LevelDB`)); + console.log(chalk.dim(' Fix: 1) Open the extension popup and verify the token is generated')); + console.log(chalk.dim(' 2) Close Chrome completely, then re-run setup')); + } + console.log(); + console.log(` You can enter the token manually, or fix the above and re-run ${chalk.bold('opencli setup')}.`); console.log(); const rl = createInterface({ input, output }); - const answer = await rl.question(' Token: '); + const answer = await rl.question(' Token (press Enter to abort): '); rl.close(); token = answer.trim(); if (!token) { @@ -161,6 +176,21 @@ export async function runSetup(opts: { cliVersion?: string; token?: string } = { console.log(chalk.yellow(' No files were changed.')); } console.log(); + + // Step 7: Auto-verify browser connectivity + console.log(chalk.dim(' Verifying browser connectivity...')); + try { + const result = await checkTokenConnectivity(); + if (result.ok) { + console.log(` ${chalk.green('✓')} Browser connected in ${(result.durationMs / 1000).toFixed(1)}s`); + } else { + console.log(` ${chalk.yellow('!')} Browser connectivity test failed: ${result.error ?? 'unknown'}`); + console.log(chalk.dim(' Make sure Chrome is running with the extension enabled.')); + } + } catch { + console.log(` ${chalk.yellow('!')} Could not verify connectivity (Chrome may not be running)`); + } + console.log(); } function padRight(s: string, n: number): string {