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)
This commit is contained in:
jackwener committed 2026-03-17 16:07:38 +08:00
1 parent 2e66e3183c
commit ff3e5c6887
3 files changed
+46 -34

No files matched your search

+7 -16
View File
@@ -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
> ```
+6 -15
View File
@@ -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 # 无交互直接修复所有配置
> ```
+33 -3
View File
@@ -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 {