@browserbridge/bbx 1.0.0 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -4
- package/package.json +53 -53
- package/packages/agent-client/src/cli-helpers.js +43 -5
- package/packages/agent-client/src/cli.js +176 -171
- package/packages/agent-client/src/client.js +66 -21
- package/packages/agent-client/src/command-registry.js +104 -69
- package/packages/agent-client/src/detect.js +162 -54
- package/packages/agent-client/src/install.js +34 -28
- package/packages/agent-client/src/mcp-config.js +40 -40
- package/packages/agent-client/src/runtime.js +41 -20
- package/packages/agent-client/src/setup-status.js +23 -30
- package/packages/mcp-server/src/bin.js +57 -5
- package/packages/mcp-server/src/handlers.js +573 -256
- package/packages/mcp-server/src/server.js +568 -257
- package/packages/native-host/bin/bridge-daemon.js +39 -6
- package/packages/native-host/bin/install-manifest.js +26 -4
- package/packages/native-host/bin/postinstall.js +4 -2
- package/packages/native-host/src/config.js +142 -13
- package/packages/native-host/src/daemon-process.js +396 -0
- package/packages/native-host/src/daemon.js +350 -150
- package/packages/native-host/src/framing.js +131 -11
- package/packages/native-host/src/install-manifest.js +194 -29
- package/packages/native-host/src/native-host.js +154 -102
- package/packages/protocol/src/budget.js +3 -7
- package/packages/protocol/src/capabilities.js +6 -3
- package/packages/protocol/src/defaults.js +1 -0
- package/packages/protocol/src/errors.js +15 -11
- package/packages/protocol/src/payload-cost.js +19 -6
- package/packages/protocol/src/protocol.js +242 -73
- package/packages/protocol/src/registry.js +311 -45
- package/packages/protocol/src/summary.js +260 -109
- package/packages/protocol/src/types.js +29 -4
- package/skills/browser-bridge/SKILL.md +3 -2
- package/skills/browser-bridge/agents/openai.yaml +3 -3
- package/skills/browser-bridge/references/interaction.md +34 -11
- package/skills/browser-bridge/references/patch-workflow.md +3 -0
- package/skills/browser-bridge/references/protocol.md +127 -71
- package/skills/browser-bridge/references/tailwind.md +12 -11
- package/skills/browser-bridge/references/token-efficiency.md +23 -22
- package/skills/browser-bridge/references/ui-workflows.md +8 -0
- package/CHANGELOG.md +0 -55
- package/assets/banner.jpg +0 -0
- package/assets/logo.png +0 -0
- package/assets/logo.svg +0 -65
- package/docs/api-reference.md +0 -157
- package/docs/cli-guide.md +0 -128
- package/docs/index.md +0 -25
- package/docs/manual-setup.md +0 -140
- package/docs/mcp-vs-cli.md +0 -258
- package/docs/publishing.md +0 -114
- package/docs/quickstart.md +0 -104
- package/docs/troubleshooting.md +0 -59
- package/docs/usage-scenarios.md +0 -136
- package/manifest.json +0 -52
- package/packages/extension/assets/icon-128.png +0 -0
- package/packages/extension/assets/icon-16.png +0 -0
- package/packages/extension/assets/icon-32.png +0 -0
- package/packages/extension/assets/icon-48.png +0 -0
- package/packages/extension/src/background-helpers.js +0 -459
- package/packages/extension/src/background-routing.js +0 -91
- package/packages/extension/src/background.js +0 -3227
- package/packages/extension/src/content-script-helpers.js +0 -281
- package/packages/extension/src/content-script.js +0 -1977
- package/packages/extension/src/debugger-coordinator.js +0 -188
- package/packages/extension/src/sidepanel-helpers.js +0 -102
- package/packages/extension/ui/offscreen.html +0 -6
- package/packages/extension/ui/offscreen.js +0 -61
- package/packages/extension/ui/popup.html +0 -35
- package/packages/extension/ui/popup.js +0 -279
- package/packages/extension/ui/sidepanel.html +0 -102
- package/packages/extension/ui/sidepanel.js +0 -1854
- package/packages/extension/ui/ui.css +0 -1159
package/docs/mcp-vs-cli.md
DELETED
|
@@ -1,258 +0,0 @@
|
|
|
1
|
-
# MCP vs CLI
|
|
2
|
-
|
|
3
|
-
This document compares the two Browser Bridge integration paths:
|
|
4
|
-
**MCP (Model Context Protocol)** and the **CLI skill**.
|
|
5
|
-
|
|
6
|
-
Short version:
|
|
7
|
-
|
|
8
|
-
- Choose MCP when your agent supports it.
|
|
9
|
-
- Choose the CLI skill when shell-native `bbx` control is the point.
|
|
10
|
-
- Do not install both by default unless you have a clear reason.
|
|
11
|
-
|
|
12
|
-
## Overview
|
|
13
|
-
|
|
14
|
-
| Aspect | MCP | CLI Skill |
|
|
15
|
-
|--------|-----|-----------|
|
|
16
|
-
| **Integration Type** | Native tool protocol | Shell command execution |
|
|
17
|
-
| **Primary Use Case** | Agents with MCP support | Shell-capable agents |
|
|
18
|
-
| **Discovery** | Auto-discovered tools | Skill documentation |
|
|
19
|
-
| **Invocation** | Tool calls | `bbx` commands |
|
|
20
|
-
| **Sandbox Compatibility** | Excellent (no shell required) | Variable (requires shell access) |
|
|
21
|
-
|
|
22
|
-
## Capability Matrix
|
|
23
|
-
|
|
24
|
-
### Core Bridge Operations
|
|
25
|
-
|
|
26
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
27
|
-
|------------|----------|-------------|-------|
|
|
28
|
-
| Health check | `browser_status`, `browser_health` | `bbx status`, `bbx doctor` | CLI has separate status/doctor |
|
|
29
|
-
| Request access | `browser_access` | `bbx access-request` | Surfaces Enable prompt in extension UI |
|
|
30
|
-
| Setup status | `browser_setup` | `bbx doctor` | Check MCP/skill installation |
|
|
31
|
-
| Request logs | `browser_logs` | `bbx logs` | Equivalent |
|
|
32
|
-
| Runtime presets | `browser_skill` | `bbx skill` | Equivalent |
|
|
33
|
-
| Heuristic investigation | `browser_investigate` | `bbx batch` / `bbx call` sequence | MCP has a dedicated read-only tool; CLI uses scripted structured reads |
|
|
34
|
-
|
|
35
|
-
### Tab Management
|
|
36
|
-
|
|
37
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
38
|
-
|------------|----------|-------------|-------|
|
|
39
|
-
| List tabs | `browser_tabs` (list) | `bbx tabs` | Equivalent |
|
|
40
|
-
| Create tab | `browser_tabs` (create) | `bbx tab-create [url]` | CLI shortcut |
|
|
41
|
-
| Close tab | `browser_tabs` (close) | `bbx tab-close <tabId>` | CLI shortcut |
|
|
42
|
-
| Tab activation | `browser_tabs` (active param) | `bbx call tabs.create` | CLI needs raw call for `active` param |
|
|
43
|
-
|
|
44
|
-
### DOM Inspection
|
|
45
|
-
|
|
46
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
47
|
-
|------------|----------|-------------|-------|
|
|
48
|
-
| Query DOM | `browser_dom` (query) | `bbx dom-query [selector]` | Equivalent |
|
|
49
|
-
| Describe element | `browser_dom` (describe) | `bbx describe <ref>` | Equivalent |
|
|
50
|
-
| Get text content | `browser_dom` (text) | `bbx text <ref>` | Equivalent |
|
|
51
|
-
| Get HTML | `browser_dom` (html) | `bbx html <ref>` | Equivalent |
|
|
52
|
-
| Get attributes | `browser_dom` (attributes) | `bbx attrs <ref> [attr1,...]` | CLI shortcut |
|
|
53
|
-
| Wait for element | `browser_dom` (wait) | `bbx wait <selector>` | Equivalent |
|
|
54
|
-
| Find by text | `browser_dom` (find_text) | `bbx find <text>` | Equivalent |
|
|
55
|
-
| Find by ARIA role | `browser_dom` (find_role) | `bbx find-role <role>` | Equivalent |
|
|
56
|
-
| Accessibility tree | `browser_dom` (accessibility_tree) | `bbx a11y-tree` | Equivalent |
|
|
57
|
-
|
|
58
|
-
### Styles & Layout
|
|
59
|
-
|
|
60
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
61
|
-
|------------|----------|-------------|-------|
|
|
62
|
-
| Computed styles | `browser_styles_layout` (computed) | `bbx styles <ref> [props]` | Equivalent |
|
|
63
|
-
| Matched CSS rules | `browser_styles_layout` (matched_rules) | `bbx matched-rules <ref>` | CLI shortcut |
|
|
64
|
-
| Box model | `browser_styles_layout` (box_model) | `bbx box <ref>` | Equivalent |
|
|
65
|
-
| Hit test | `browser_styles_layout` (hit_test) | `bbx call layout.hit_test` | CLI uses raw call |
|
|
66
|
-
|
|
67
|
-
### Page State
|
|
68
|
-
|
|
69
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
70
|
-
|------------|----------|-------------|-------|
|
|
71
|
-
| Page state | `browser_page` (state) | `bbx call page.get_state` | CLI uses raw call |
|
|
72
|
-
| JavaScript evaluate | `browser_page` (evaluate) | `bbx eval <expression>` | Equivalent |
|
|
73
|
-
| Console output | `browser_page` (console) | `bbx console [level]` | Equivalent |
|
|
74
|
-
| Wait for load | `browser_page` (wait_for_load) | `bbx call page.wait_for_load_state` | CLI uses raw call |
|
|
75
|
-
| Browser storage | `browser_page` (storage) | `bbx storage [type] [keys]` | Equivalent |
|
|
76
|
-
| Page text | `browser_page` (text) | `bbx page-text [budget]` | Equivalent |
|
|
77
|
-
| Network requests | `browser_page` (network) | `bbx network [limit]` | Equivalent |
|
|
78
|
-
| Performance metrics | `browser_page` (performance) | `bbx perf` | Equivalent |
|
|
79
|
-
|
|
80
|
-
### Navigation
|
|
81
|
-
|
|
82
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
83
|
-
|------------|----------|-------------|-------|
|
|
84
|
-
| Navigate to URL | `browser_navigation` (navigate) | `bbx navigate <url>` | Equivalent |
|
|
85
|
-
| Reload page | `browser_navigation` (reload) | `bbx reload` | CLI shortcut |
|
|
86
|
-
| Go back | `browser_navigation` (go_back) | `bbx back` | CLI shortcut |
|
|
87
|
-
| Go forward | `browser_navigation` (go_forward) | `bbx forward` | CLI shortcut |
|
|
88
|
-
| Scroll viewport | `browser_navigation` (scroll) | `bbx scroll <top> [left]` | CLI shortcut |
|
|
89
|
-
| Resize viewport | `browser_navigation` (resize) | `bbx resize <w> <h>` | Equivalent |
|
|
90
|
-
|
|
91
|
-
### Input & Interaction
|
|
92
|
-
|
|
93
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
94
|
-
|------------|----------|-------------|-------|
|
|
95
|
-
| Click element | `browser_input` (click) | `bbx click <ref> [button]` | Equivalent |
|
|
96
|
-
| Focus element | `browser_input` (focus) | `bbx focus <ref>` | Equivalent |
|
|
97
|
-
| Type text | `browser_input` (type) | `bbx type <ref> <text>` | Equivalent |
|
|
98
|
-
| Press key | `browser_input` (press_key) | `bbx press-key <key> [ref]` | Equivalent |
|
|
99
|
-
| Set checked | `browser_input` (set_checked) | `bbx call input.set_checked` | CLI uses raw call |
|
|
100
|
-
| Select option | `browser_input` (select_option) | `bbx call input.select_option` | CLI uses raw call |
|
|
101
|
-
| Hover | `browser_input` (hover) | `bbx hover <ref>` | Equivalent |
|
|
102
|
-
| Drag | `browser_input` (drag) | `bbx call input.drag` | CLI uses raw call |
|
|
103
|
-
| Scroll target into view | `browser_input` (scroll_into_view) | `bbx call input.scroll_into_view` | CLI uses raw call |
|
|
104
|
-
|
|
105
|
-
### Patching
|
|
106
|
-
|
|
107
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
108
|
-
|------------|----------|-------------|-------|
|
|
109
|
-
| Apply style patch | `browser_patch` (apply_styles) | `bbx patch-style <ref> prop=val...` | Equivalent |
|
|
110
|
-
| Apply DOM patch | `browser_patch` (apply_dom) | `bbx patch-text <ref> <text>` | CLI has text-specific shortcut |
|
|
111
|
-
| List patches | `browser_patch` (list) | `bbx patches` | Equivalent |
|
|
112
|
-
| Rollback patch | `browser_patch` (rollback) | `bbx rollback <patchId>` | Equivalent |
|
|
113
|
-
| Commit baseline | `browser_patch` (commit_baseline) | `bbx call patch.commit_baseline` | CLI uses raw call |
|
|
114
|
-
|
|
115
|
-
### Capture & Screenshots
|
|
116
|
-
|
|
117
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
118
|
-
|------------|----------|-------------|-------|
|
|
119
|
-
| Element screenshot | `browser_capture` (element) | `bbx screenshot <ref> [outPath]` | Equivalent |
|
|
120
|
-
| Region screenshot | `browser_capture` (region) | `bbx call screenshot.capture_region` | CLI uses raw call |
|
|
121
|
-
| Full-page screenshot | `browser_capture` (full_page) | `bbx call screenshot.capture_full_page` | CLI uses raw call |
|
|
122
|
-
| CDP document | `browser_capture` (cdp_document) | `bbx call cdp.get_document` | CLI uses raw call |
|
|
123
|
-
| CDP DOM snapshot | `browser_capture` (cdp_dom_snapshot) | `bbx call cdp.get_dom_snapshot` | CLI uses raw call |
|
|
124
|
-
| CDP box model | `browser_capture` (cdp_box_model) | `bbx call cdp.get_box_model` | CLI uses raw call |
|
|
125
|
-
| CDP computed styles | `browser_capture` (cdp_computed_styles) | `bbx call cdp.get_computed_styles_for_node` | CLI uses raw call |
|
|
126
|
-
|
|
127
|
-
### Advanced & Raw Protocol
|
|
128
|
-
|
|
129
|
-
| Capability | MCP Tool | CLI Command | Notes |
|
|
130
|
-
|------------|----------|-------------|-------|
|
|
131
|
-
| Raw protocol call | `browser_call` | `bbx call <method> '{...}'` | Equivalent |
|
|
132
|
-
| Ordered batch calls | `browser_batch` | `bbx batch '[{...}]'` | Both preserve request order and return per-call `durationMs` / `approxTokens` |
|
|
133
|
-
| Batch parallel reads | N/A (multiple tool calls) | `bbx batch '[{...}]'` | CLI has explicit batch |
|
|
134
|
-
| Install manifest | N/A | `bbx install <ext-id>` | CLI-only (setup) |
|
|
135
|
-
| Install MCP config | N/A | `bbx install-mcp [client]` | CLI-only (setup) |
|
|
136
|
-
| Install skill | N/A | `bbx install-skill [client]` | CLI-only (setup) |
|
|
137
|
-
| Uninstall | N/A | `bbx uninstall` | CLI-only (setup) |
|
|
138
|
-
|
|
139
|
-
## Feature Comparison
|
|
140
|
-
|
|
141
|
-
### MCP Advantages
|
|
142
|
-
|
|
143
|
-
| Feature | Description |
|
|
144
|
-
|---------|-------------|
|
|
145
|
-
| **Auto-discovery** | Tools are automatically registered and discovered by MCP clients |
|
|
146
|
-
| **Schema validation** | Input parameters validated via Zod schemas before execution |
|
|
147
|
-
| **Structured responses** | Consistent tool result format with content blocks |
|
|
148
|
-
| **No shell dependency** | Works in sandboxed environments without shell access |
|
|
149
|
-
| **Tool grouping** | Related actions grouped logically (e.g., `browser_dom` with multiple actions) |
|
|
150
|
-
| **Type safety** | Strong typing via input schemas |
|
|
151
|
-
| **Client-native** | Integrated into agent's tool system natively |
|
|
152
|
-
| **Delegation hints** | `browser_investigate` can tell orchestrators to use a smaller, cheaper subagent first |
|
|
153
|
-
|
|
154
|
-
### CLI Advantages
|
|
155
|
-
|
|
156
|
-
| Feature | Description |
|
|
157
|
-
|---------|-------------|
|
|
158
|
-
| **Batch execution** | `bbx batch` executes multiple calls concurrently via Promise.all and reports per-call duration/token estimates |
|
|
159
|
-
| **Request logging** | `bbx logs` shows recent bridge request history |
|
|
160
|
-
| **Setup commands** | Built-in install, uninstall, doctor commands |
|
|
161
|
-
| **Shell scripting** | Can be used in scripts, pipes, and CI workflows |
|
|
162
|
-
| **Direct output** | JSON output can be piped to other tools |
|
|
163
|
-
| **Shortcut commands** | Convenient aliases for common operations |
|
|
164
|
-
| **Raw protocol access** | Direct `bbx call` for any method with full parameter control |
|
|
165
|
-
| **Interactive flows** | `bbx doctor` for guided troubleshooting |
|
|
166
|
-
| **Stdin support** | `bbx eval -` reads expression from stdin |
|
|
167
|
-
| **Manual investigation loops** | `bbx batch` makes the same structured-first investigation pattern easy to script |
|
|
168
|
-
|
|
169
|
-
## Ergonomics Comparison
|
|
170
|
-
|
|
171
|
-
### MCP Tool Invocation
|
|
172
|
-
|
|
173
|
-
```
|
|
174
|
-
Tool: browser_dom
|
|
175
|
-
Parameters: { "action": "query", "selector": ".sidebar", "maxNodes": 20 }
|
|
176
|
-
```
|
|
177
|
-
|
|
178
|
-
### CLI Command Invocation
|
|
179
|
-
|
|
180
|
-
```bash
|
|
181
|
-
bbx dom-query .sidebar
|
|
182
|
-
# or with full control:
|
|
183
|
-
bbx call dom.query '{"selector": ".sidebar", "maxNodes": 20}'
|
|
184
|
-
```
|
|
185
|
-
|
|
186
|
-
### Open-Ended Investigation
|
|
187
|
-
|
|
188
|
-
MCP has a dedicated `browser_investigate` tool for "find out why this is broken" style requests. It is read-only and can carry delegation metadata for a smaller, cheaper subagent.
|
|
189
|
-
|
|
190
|
-
CLI does not have a separate `bbx investigate` command. The equivalent is a structured-first sequence, usually via one `bbx batch` call:
|
|
191
|
-
|
|
192
|
-
```bash
|
|
193
|
-
bbx batch '[
|
|
194
|
-
{"method":"page.get_state"},
|
|
195
|
-
{"method":"dom.query","params":{"selector":"main","maxNodes":20,"maxDepth":4,"textBudget":600}},
|
|
196
|
-
{"method":"page.get_text","params":{"textBudget":4000}}
|
|
197
|
-
]'
|
|
198
|
-
```
|
|
199
|
-
|
|
200
|
-
Escalate to `bbx screenshot`, `screenshot.capture_region`, or `screenshot.capture_full_page` only when those structured reads are insufficient.
|
|
201
|
-
|
|
202
|
-
### Key Differences
|
|
203
|
-
|
|
204
|
-
| Aspect | MCP | CLI |
|
|
205
|
-
|--------|-----|-----|
|
|
206
|
-
| Parameter format | JSON object | CLI args or JSON string |
|
|
207
|
-
| Output format | Tool result content | `{ok, summary, evidence}` JSON |
|
|
208
|
-
| Error handling | Tool error response | JSON with `ok: false` |
|
|
209
|
-
| Version drift warnings | Returned in health/status output and surfaced automatically after connect | Returned in summaries and raw response metadata after connect |
|
|
210
|
-
| Access routing | Follows active tab in enabled window by default | Follows active tab in enabled window by default |
|
|
211
|
-
| Explicit targeting | `tabId` on grouped tools | `bbx call --tab <tabId> ...` |
|
|
212
|
-
| Concurrency | Multiple tool calls | `batch` command or parallel shells |
|
|
213
|
-
|
|
214
|
-
## Use Case Recommendations
|
|
215
|
-
|
|
216
|
-
### Prefer MCP When:
|
|
217
|
-
|
|
218
|
-
- Your agent has native MCP support (Claude Code, Cursor, Copilot, etc.)
|
|
219
|
-
- Running in sandboxed environments (GitHub Copilot, containerized agents)
|
|
220
|
-
- You want automatic tool discovery and schema validation
|
|
221
|
-
- You prefer grouped, semantic tool interfaces
|
|
222
|
-
- Integration with IDE tool systems is important
|
|
223
|
-
|
|
224
|
-
### Prefer CLI When:
|
|
225
|
-
|
|
226
|
-
- Your agent runs shell commands reliably
|
|
227
|
-
- You need batch execution of multiple reads
|
|
228
|
-
- You want access to setup/install commands
|
|
229
|
-
- You're debugging the bridge itself (`bbx logs`, `bbx doctor`)
|
|
230
|
-
- You're writing scripts or CI workflows
|
|
231
|
-
- You need stdin/stdout piping
|
|
232
|
-
- You prefer direct protocol access
|
|
233
|
-
|
|
234
|
-
## Client Compatibility Matrix
|
|
235
|
-
|
|
236
|
-
| Client | MCP Support | CLI Skill Support | Recommended Path |
|
|
237
|
-
|--------|-------------|-------------------|------------------|
|
|
238
|
-
| OpenAI Codex | Yes (TOML config) | Yes | MCP preferred |
|
|
239
|
-
| Claude Code | Yes | Yes | MCP preferred |
|
|
240
|
-
| Cursor | Yes | Yes | MCP preferred |
|
|
241
|
-
| GitHub Copilot | Yes (VS Code) | Limited (sandbox) | **MCP required** |
|
|
242
|
-
| OpenCode | Yes (local type) | Yes | MCP preferred |
|
|
243
|
-
| Antigravity | Yes | Yes | MCP preferred |
|
|
244
|
-
| Windsurf | Yes | Yes | MCP preferred |
|
|
245
|
-
| Generic agents | Yes (`.agents/mcp.json`) | `.agents/skills/` | MCP preferred when available |
|
|
246
|
-
|
|
247
|
-
## Summary
|
|
248
|
-
|
|
249
|
-
Both MCP and CLI paths provide full access to Browser Bridge capabilities. The choice depends primarily on your agent's architecture:
|
|
250
|
-
|
|
251
|
-
1. **MCP** is the recommended path for agents with native MCP support, offering better integration, validation, and sandbox compatibility.
|
|
252
|
-
|
|
253
|
-
2. **CLI Skill** is ideal for shell-capable agents, scripting scenarios, and when you need batch operations or setup commands.
|
|
254
|
-
|
|
255
|
-
The underlying protocol is identical: both paths communicate with the same
|
|
256
|
-
native host and extension. Use `browser_call` (MCP) or `bbx call` (CLI) when
|
|
257
|
-
you need method-specific fields not exposed by the grouped tools or shortcut
|
|
258
|
-
commands.
|
package/docs/publishing.md
DELETED
|
@@ -1,114 +0,0 @@
|
|
|
1
|
-
# Publishing
|
|
2
|
-
|
|
3
|
-
This is a maintainer document, not an end-user setup guide. End users should
|
|
4
|
-
start with [quickstart](./quickstart.md).
|
|
5
|
-
|
|
6
|
-
This repo has two release artifacts:
|
|
7
|
-
|
|
8
|
-
1. The Chrome extension ZIP for the Chrome Web Store
|
|
9
|
-
2. The npm package for the local CLI and native host
|
|
10
|
-
|
|
11
|
-
The extension is not a standalone product. A store release only becomes usable once the npm package is also published, because the extension depends on the local native host installed by `bbx install <extension-id>`.
|
|
12
|
-
The published npm package now embeds the Browser Bridge store extension ID, so end-user docs for the published build should default to plain `bbx install`. Only unpacked or non-store builds should require `bbx install <extension-id>` or `BROWSER_BRIDGE_EXTENSION_ID=<extension-id>`.
|
|
13
|
-
|
|
14
|
-
## Release Checklist
|
|
15
|
-
|
|
16
|
-
1. Bump the version in [package.json](../package.json) and [manifest.json](../manifest.json) together.
|
|
17
|
-
2. Run `npm install` if dependencies changed.
|
|
18
|
-
3. Run `npm run release:check`.
|
|
19
|
-
4. In npm package settings, add a GitHub Actions trusted publisher for this repository and workflow file `release.yml`.
|
|
20
|
-
5. Push the release tag `v<version>` so GitHub Actions publishes the npm package and uploads the extension ZIP artifact.
|
|
21
|
-
6. After the first successful trusted publish, set npm package publishing access to require 2FA and disallow tokens, then revoke any old automation token.
|
|
22
|
-
7. Upload the extension ZIP from `dist/browser-bridge-extension-v<version>.zip`.
|
|
23
|
-
8. Complete the Chrome Web Store listing, privacy fields, and reviewer instructions.
|
|
24
|
-
9. Smoke-test the published extension against the published CLI using `bbx install`.
|
|
25
|
-
|
|
26
|
-
## Build The Extension ZIP
|
|
27
|
-
|
|
28
|
-
The repo now includes a reproducible packaging step:
|
|
29
|
-
|
|
30
|
-
```bash
|
|
31
|
-
npm run package:extension
|
|
32
|
-
```
|
|
33
|
-
|
|
34
|
-
That stages only the runtime extension files into `dist/browser-bridge-extension/` and writes the upload artifact to:
|
|
35
|
-
|
|
36
|
-
```bash
|
|
37
|
-
dist/browser-bridge-extension-v<version>.zip
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
## Publish The npm Package
|
|
41
|
-
|
|
42
|
-
The package is configured for public publish:
|
|
43
|
-
|
|
44
|
-
```bash
|
|
45
|
-
npm pack --dry-run
|
|
46
|
-
npm publish --provenance --access public
|
|
47
|
-
```
|
|
48
|
-
|
|
49
|
-
The release workflow on tag push now performs this publish automatically through npm trusted publishing (OIDC). Manual publish remains a valid fallback when the GitHub workflow is unavailable.
|
|
50
|
-
|
|
51
|
-
Trusted publishing requires npm CLI `11.5.1+`. The release workflow upgrades npm explicitly before running `npm publish`; if publish fails with `E404` or authentication issues, verify the workflow still prints an npm version at or above that threshold.
|
|
52
|
-
|
|
53
|
-
## Chrome Web Store Submission
|
|
54
|
-
|
|
55
|
-
### Store assets you still need to prepare manually
|
|
56
|
-
|
|
57
|
-
- At least one real product screenshot
|
|
58
|
-
- One 440x280 promotional image
|
|
59
|
-
- A privacy policy URL
|
|
60
|
-
- Support/contact URL or support email in the developer dashboard
|
|
61
|
-
|
|
62
|
-
The manifest now includes packaged extension icons, but the promo image and screenshots are store-listing assets, not files inside the extension ZIP.
|
|
63
|
-
|
|
64
|
-
### Single purpose statement
|
|
65
|
-
|
|
66
|
-
Use one narrow sentence. Suggested draft:
|
|
67
|
-
|
|
68
|
-
`Browser Bridge lets a local developer agent inspect and patch web pages in an explicitly enabled Chrome window through a local native messaging bridge.`
|
|
69
|
-
|
|
70
|
-
### Permission justifications
|
|
71
|
-
|
|
72
|
-
Use reviewer-facing explanations tied to the product purpose:
|
|
73
|
-
|
|
74
|
-
- `activeTab`: used to bootstrap inspection against the tab the user explicitly enables
|
|
75
|
-
- `debugger`: used for Chrome DevTools Protocol reads and page-context evaluation, such as DOM snapshots, computed styles, screenshots, accessibility data, and page inspection helpers
|
|
76
|
-
- `nativeMessaging`: required to communicate with the local Browser Bridge daemon
|
|
77
|
-
- `scripting`: used to inject and coordinate the scoped page instrumentation flow
|
|
78
|
-
- `sidePanel`: provides the side panel control surface
|
|
79
|
-
- `storage`: persists window approvals, session state, and recent UI state for the current browser session
|
|
80
|
-
- `tabs`: enumerates tabs and validates that a request stays inside the enabled window
|
|
81
|
-
- `offscreen`: used for screenshot cropping in the offscreen document
|
|
82
|
-
- `host_permissions` on `<all_urls>`: needed because the tool is designed to inspect whichever site the user explicitly approves, not a fixed site list
|
|
83
|
-
|
|
84
|
-
Reviewers will likely scrutinize `debugger`, `nativeMessaging`, and `<all_urls>`. Keep the listing language narrow and explicit about user approval and local-only operation.
|
|
85
|
-
|
|
86
|
-
### Privacy fields
|
|
87
|
-
|
|
88
|
-
Current expected answers with the code as it exists today:
|
|
89
|
-
|
|
90
|
-
- Remote code: do not default this to `No`. Browser Bridge can execute user-requested expressions in page context through the Chrome Debugger API. Answer this honestly in the dashboard and explain that the extension does not load remote-hosted extension scripts.
|
|
91
|
-
- Data collection: disclose the page data the product can access for the enabled window, including browsing/page content, DOM/style/layout data, console output, network metadata, storage values when requested, and screenshots when requested
|
|
92
|
-
- Data sale: `No`
|
|
93
|
-
- Data handling: Browser Bridge itself routes data locally to the native host and connected local client; a connected agent or IDE may still forward data onward under its own policy
|
|
94
|
-
- Privacy policy: must clearly state what data the extension can access, that approval is window-scoped, and that Browser Bridge itself does not operate a Browser Bridge cloud service
|
|
95
|
-
|
|
96
|
-
If product behavior changes, update the privacy answers before submission.
|
|
97
|
-
|
|
98
|
-
### Reviewer test instructions
|
|
99
|
-
|
|
100
|
-
Google marks the Test Instructions tab as optional, but Browser Bridge should still provide it because the product depends on local CLI/native-host setup. Suggested draft:
|
|
101
|
-
|
|
102
|
-
1. Install the published extension from the draft listing.
|
|
103
|
-
2. Install Node.js 18+ on the same machine.
|
|
104
|
-
3. Run `npm install -g @browserbridge/bbx`.
|
|
105
|
-
4. Run `bbx install`.
|
|
106
|
-
5. If needed, run `bbx-daemon`.
|
|
107
|
-
6. Open any normal web page in Chrome.
|
|
108
|
-
7. Open the Browser Bridge popup or side panel and enable Browser Bridge for the current browser window.
|
|
109
|
-
8. In a terminal, run `bbx status`, `bbx tabs`, and `bbx page-text`.
|
|
110
|
-
|
|
111
|
-
## Post-Publish Follow-Up
|
|
112
|
-
|
|
113
|
-
- Update [README.md](../README.md) and [quickstart.md](./quickstart.md) with the real store listing URL.
|
|
114
|
-
- Re-run a live flow with `bbx install` after the first published build is available.
|
package/docs/quickstart.md
DELETED
|
@@ -1,104 +0,0 @@
|
|
|
1
|
-
# Quickstart
|
|
2
|
-
|
|
3
|
-
Browser Bridge lets your coding agent inspect and patch the real Chrome tab you already have open - DOM, styles, console, network, and more - without screenshots or raw HTML dumps.
|
|
4
|
-
|
|
5
|
-
> **Requires:** Google Chrome and Node.js on the same machine as your agent. Remote-only agents (e.g. GitHub.com Copilot) cannot reach a local Chrome instance.
|
|
6
|
-
>
|
|
7
|
-
> **Privacy:** Browser Bridge itself sends extension data locally to the companion host and connected local client. Your chosen agent or IDE may still forward tool results onward under its own policy. See [`PRIVACY.md`](../PRIVACY.md).
|
|
8
|
-
|
|
9
|
-
## 1. Install the extension
|
|
10
|
-
|
|
11
|
-
Install [Browser Bridge from the Chrome Web Store](https://chrome.google.com/webstore/detail/jjjkmmcdkpcgamlopogicbnnhdgebhie). <!-- TODO: replace with final store link after publishing -->
|
|
12
|
-
|
|
13
|
-
## 2. Install the CLI
|
|
14
|
-
|
|
15
|
-
```bash
|
|
16
|
-
npm install -g @browserbridge/bbx
|
|
17
|
-
```
|
|
18
|
-
|
|
19
|
-
This also installs the native messaging host automatically.
|
|
20
|
-
|
|
21
|
-
If the extension does not connect itself during setup, run:
|
|
22
|
-
|
|
23
|
-
```bash
|
|
24
|
-
bbx install
|
|
25
|
-
```
|
|
26
|
-
|
|
27
|
-
## 3. Connect your agent
|
|
28
|
-
|
|
29
|
-
There are two integration paths. Pick the one that matches how your agent works:
|
|
30
|
-
|
|
31
|
-
Supported clients: `codex` (OpenAI Codex), `claude` (Claude Code), `cursor` (Cursor), `copilot` (GitHub Copilot), `opencode` (OpenCode), `antigravity` (Antigravity), `windsurf` (Windsurf), `agents` (generic `.agents` MCP/skill layout).
|
|
32
|
-
|
|
33
|
-
After installing the extension and CLI, finish the rest from the extension side panel's **Host Setup** section, or use the `bbx install-mcp` / `bbx install-skill` commands below if you prefer terminal setup.
|
|
34
|
-
|
|
35
|
-
> **Recommendation:** MCP and the CLI skill are not meant to be installed together by default. If your agent supports both, start with MCP. The bridge protocol and browser data are the same either way; the difference is integration style. MCP fits agent tool systems better because it is structured, validated, and does not depend on shell access. Choose the CLI skill when you specifically want direct `bbx` control for shell-driven workflows such as setup, debugging, scripting, or raw protocol calls. If CLI mode is unreliable because the agent runs in a sandboxed shell, such as GitHub Copilot, use MCP instead.
|
|
36
|
-
|
|
37
|
-
**MCP** - the default path for agents with native MCP tool support. Prefer this when your agent can use either mode. It gives the agent structured tools without relying on shell execution, and it is the best fallback when CLI mode is blocked by sandboxing. Write the config directly into each client's settings file:
|
|
38
|
-
|
|
39
|
-
```bash
|
|
40
|
-
bbx install-mcp # all supported clients
|
|
41
|
-
bbx install-mcp codex # or pick one: codex, claude, cursor, copilot, opencode, antigravity, windsurf, agents
|
|
42
|
-
bbx install-mcp copilot --local # scope to current project instead of global
|
|
43
|
-
```
|
|
44
|
-
|
|
45
|
-
Configs are written globally by default. For GitHub Copilot, that means `~/.copilot/mcp-config.json`; project installs still use `.vscode/mcp.json`. Browser Bridge also writes the older VS Code `User/mcp.json` locations as compatibility fallbacks.
|
|
46
|
-
|
|
47
|
-
**Skill + CLI** - for agents that can reliably run shell commands and where direct `bbx` control is the better fit than MCP tools. Use this path for shell-driven agent flows, setup and doctor flows, scripting, logs, or raw protocol access. Install the Browser Bridge skill so your agent knows how to drive `bbx`:
|
|
48
|
-
|
|
49
|
-
```bash
|
|
50
|
-
bbx install-skill # all supported clients
|
|
51
|
-
bbx install-skill codex # or pick one: codex, claude, cursor, copilot, opencode, antigravity, windsurf, agents
|
|
52
|
-
bbx install-skill agents --project .
|
|
53
|
-
```
|
|
54
|
-
|
|
55
|
-
The Browser Bridge skill is a CLI path. Use `bbx install-skill` for shell-driven agent flows and generic agent runtimes.
|
|
56
|
-
|
|
57
|
-
Shortcut commands cover the common cases. Advanced protocol fields stay available through `bbx call <method> '{...}'` when you need the full bridge surface, and exact bridge methods can also be invoked directly for the raw path, for example `bbx page.get_state`.
|
|
58
|
-
|
|
59
|
-
If Browser Bridge does not appear immediately after `bbx install-mcp` or `bbx install-skill`, restart the agent so it reloads MCP config or skill definitions.
|
|
60
|
-
|
|
61
|
-
> The paths are independent. MCP clients use MCP tools; CLI skill clients use `bbx`. You do not need both. For normal agent use, start with MCP if it is available; choose the CLI skill when shell-native control is the point.
|
|
62
|
-
|
|
63
|
-
## 4. Enable a window
|
|
64
|
-
|
|
65
|
-
1. Open the page you want your agent to inspect.
|
|
66
|
-
2. Click the Browser Bridge toolbar icon or open the side panel.
|
|
67
|
-
3. If needed, finish MCP or CLI skill setup from **Host Setup**.
|
|
68
|
-
4. Enable agent communication for the current Chrome window.
|
|
69
|
-
|
|
70
|
-
Your agent can now inspect and patch the active tab in that enabled window, or other tabs in the same window when explicitly targeted.
|
|
71
|
-
|
|
72
|
-
## 5. Use it
|
|
73
|
-
|
|
74
|
-
**MCP mode** - tools are auto-discovered by the client. Just ask naturally:
|
|
75
|
-
|
|
76
|
-
You can refer to it as `BB MCP` or `Browser Bridge MCP`; both should work.
|
|
77
|
-
|
|
78
|
-
> *"Why is the sidebar layout broken on this page?"*
|
|
79
|
-
> *"Use BB MCP to inspect why the sidebar layout is broken."*
|
|
80
|
-
> *"Check the CSS on the hero section and fix the spacing."*
|
|
81
|
-
> *"Does my latest change actually render correctly in the browser?"*
|
|
82
|
-
|
|
83
|
-
**Skill + CLI mode** - reference the skill explicitly so the agent knows to use `bbx`:
|
|
84
|
-
|
|
85
|
-
> *"Use the browser-bridge skill to check why the sidebar layout is broken."*
|
|
86
|
-
> *"Using browser-bridge skill, verify the hero section spacing and fix it."*
|
|
87
|
-
|
|
88
|
-
For GitHub Copilot, invoke the skill by name, for example `/browser-bridge`.
|
|
89
|
-
`bbx` is the Browser Bridge CLI command, not a guaranteed Copilot skill alias.
|
|
90
|
-
|
|
91
|
-
In both cases the agent reads live DOM, styles, console, and network state from your real tab. Patches are reversible and session-scoped. When visual confirmation is still needed after structured reads, prefer a partial element screenshot or a tight region crop instead of a larger page capture before writing the fix back to source.
|
|
92
|
-
|
|
93
|
-
For open-ended inspection in MCP mode, start with `browser_investigate`. It is read-only and intended to be delegated to a smaller, lower-cost subagent when the client supports delegation. The CLI-skill equivalent is to start with `bbx batch` or `bbx call` using `page.get_state`, `dom.query`, and `page.get_text` before escalating to screenshots.
|
|
94
|
-
|
|
95
|
-
## 6. Need more detail?
|
|
96
|
-
|
|
97
|
-
Use the focused guides instead of stretching quickstart into a manual:
|
|
98
|
-
|
|
99
|
-
- [Documentation index](./index.md)
|
|
100
|
-
- [Manual setup](./manual-setup.md) for custom agents, exact config locations, and project-local installs
|
|
101
|
-
- [Usage scenarios](./usage-scenarios.md) for concrete debugging and patching workflows
|
|
102
|
-
- [CLI guide](./cli-guide.md) for command-oriented usage
|
|
103
|
-
- [MCP vs CLI](./mcp-vs-cli.md) if you are deciding between integration paths
|
|
104
|
-
- [Troubleshooting](./troubleshooting.md) when setup or access fails
|
package/docs/troubleshooting.md
DELETED
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
# Troubleshooting
|
|
2
|
-
|
|
3
|
-
When Browser Bridge is not working, start with local validation before blaming
|
|
4
|
-
the agent integration:
|
|
5
|
-
|
|
6
|
-
```bash
|
|
7
|
-
bbx status
|
|
8
|
-
bbx doctor
|
|
9
|
-
bbx tabs
|
|
10
|
-
bbx logs
|
|
11
|
-
```
|
|
12
|
-
|
|
13
|
-
## The extension is installed, but `bbx status` says it is disconnected
|
|
14
|
-
|
|
15
|
-
- Run `bbx install` again.
|
|
16
|
-
- Confirm the extension is enabled in Chrome.
|
|
17
|
-
- If you are using a published store build that still needs an explicit ID, run `bbx install <extension-id>`.
|
|
18
|
-
- Restart Chrome after reinstalling the native messaging manifest if the host was missing when Chrome launched.
|
|
19
|
-
|
|
20
|
-
## The agent gets `ACCESS_DENIED`
|
|
21
|
-
|
|
22
|
-
- The first `ACCESS_DENIED` call automatically surfaces an Enable prompt in the extension UI.
|
|
23
|
-
- Alternatively, call `bbx access-request` (CLI) or use the `browser_access` MCP tool to trigger the prompt proactively.
|
|
24
|
-
- Open the Browser Bridge popup or side panel in Chrome and click Enable.
|
|
25
|
-
- Make sure the page you care about is in that enabled window, not a different Chrome window.
|
|
26
|
-
|
|
27
|
-
## The agent keeps using the wrong tab
|
|
28
|
-
|
|
29
|
-
- Browser Bridge defaults to the active tab in the enabled window.
|
|
30
|
-
- Bring the intended tab to the front, then retry.
|
|
31
|
-
- If your workflow needs a specific tab, target it explicitly through MCP parameters or `bbx call --tab <tabId> ...`.
|
|
32
|
-
- Use `bbx tabs` to confirm the tab ID and current active tab.
|
|
33
|
-
|
|
34
|
-
## The CLI works locally, but the agent cannot use it
|
|
35
|
-
|
|
36
|
-
- The agent may be running inside a sandboxed shell.
|
|
37
|
-
- Prefer MCP for Copilot and other sandboxed environments.
|
|
38
|
-
- If you intentionally want CLI mode, confirm the agent can execute `bbx` and read the installed Browser Bridge skill.
|
|
39
|
-
|
|
40
|
-
## `bbx install-skill` or `bbx install-mcp` wrote files, but the client still does not see Browser Bridge
|
|
41
|
-
|
|
42
|
-
- Restart the agent or client after writing config so it reloads MCP config or skill definitions.
|
|
43
|
-
- Check that you installed into the right scope: global vs project-local.
|
|
44
|
-
- For project-local installs, confirm the client is opened in the same repository where the config was written.
|
|
45
|
-
- For managed paths and examples, see [manual-setup.md](./manual-setup.md).
|
|
46
|
-
|
|
47
|
-
## Patches disappear
|
|
48
|
-
|
|
49
|
-
- Patches are session-scoped, not permanent source changes.
|
|
50
|
-
- Navigation, reloads, or session resets can invalidate them.
|
|
51
|
-
- Use patches to prove the fix, then move the result into the codebase.
|
|
52
|
-
|
|
53
|
-
## What to include in a bug report
|
|
54
|
-
|
|
55
|
-
- Output summary from `bbx status`
|
|
56
|
-
- Output summary from `bbx doctor`
|
|
57
|
-
- `bbx tabs` for routing context
|
|
58
|
-
- `bbx logs` if the bridge is failing after connection
|
|
59
|
-
- Whether you are using MCP or the CLI skill
|
package/docs/usage-scenarios.md
DELETED
|
@@ -1,136 +0,0 @@
|
|
|
1
|
-
# Usage Scenarios
|
|
2
|
-
|
|
3
|
-
Browser Bridge is best when you need the state that already exists in a real Chrome tab: logged-in sessions, seeded storage, feature flags, SPA state, and whatever the page actually rendered.
|
|
4
|
-
|
|
5
|
-
If you need repeatable clean-room automation for tests or CI, use Playwright or another browser automation stack instead.
|
|
6
|
-
|
|
7
|
-
## 1. Debug a broken layout in the real page
|
|
8
|
-
|
|
9
|
-
Use this when the bug only reproduces in your current logged-in or feature-flag state.
|
|
10
|
-
|
|
11
|
-
Ask an MCP-capable agent:
|
|
12
|
-
|
|
13
|
-
> Use Browser Bridge MCP to inspect why the sidebar overlaps the main content.
|
|
14
|
-
>
|
|
15
|
-
> If your client supports subagents, delegate the investigation to a smaller low-cost worker first.
|
|
16
|
-
|
|
17
|
-
Ask a CLI-skill agent:
|
|
18
|
-
|
|
19
|
-
> Use the browser-bridge skill to inspect the broken sidebar layout and tell me which computed styles are causing it.
|
|
20
|
-
|
|
21
|
-
Useful direct commands:
|
|
22
|
-
|
|
23
|
-
```bash
|
|
24
|
-
bbx batch '[{"method":"page.get_state"},{"method":"dom.query","params":{"selector":".sidebar","maxNodes":20,"maxDepth":4,"textBudget":600}}]'
|
|
25
|
-
bbx dom-query .sidebar
|
|
26
|
-
bbx box .sidebar
|
|
27
|
-
bbx styles .sidebar display,position,width,left,right,gap
|
|
28
|
-
bbx matched-rules .sidebar
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
## 2. Verify that a local code change actually rendered
|
|
32
|
-
|
|
33
|
-
Use this after editing source, before assuming the fix worked.
|
|
34
|
-
|
|
35
|
-
Typical prompt:
|
|
36
|
-
|
|
37
|
-
> Check whether the latest navbar change rendered correctly in the browser, and compare the live spacing against the intended layout.
|
|
38
|
-
|
|
39
|
-
Useful direct commands:
|
|
40
|
-
|
|
41
|
-
```bash
|
|
42
|
-
bbx call page.get_state
|
|
43
|
-
bbx dom-query nav
|
|
44
|
-
bbx styles nav gap,padding,align-items
|
|
45
|
-
bbx call input.scroll_into_view '{"target":{"selector":"nav"}}'
|
|
46
|
-
bbx screenshot nav ./tmp/navbar.png
|
|
47
|
-
```
|
|
48
|
-
|
|
49
|
-
## 3. Debug a form or interaction issue
|
|
50
|
-
|
|
51
|
-
Use this when a click, keyboard interaction, or form control does not behave as expected.
|
|
52
|
-
|
|
53
|
-
Typical prompt:
|
|
54
|
-
|
|
55
|
-
> Use Browser Bridge to inspect the submit button, confirm whether it is disabled or covered, then try the interaction again.
|
|
56
|
-
|
|
57
|
-
Useful direct commands:
|
|
58
|
-
|
|
59
|
-
```bash
|
|
60
|
-
bbx describe button[type="submit"]
|
|
61
|
-
bbx box button[type="submit"]
|
|
62
|
-
bbx call input.scroll_into_view '{"target":{"selector":"button[type=\"submit\"]"}}'
|
|
63
|
-
bbx click button[type="submit"]
|
|
64
|
-
bbx console error
|
|
65
|
-
bbx network 20
|
|
66
|
-
```
|
|
67
|
-
|
|
68
|
-
## 4. Prove a live CSS or DOM fix before editing source
|
|
69
|
-
|
|
70
|
-
Use this when you want to validate the fix in the page first, then port it into
|
|
71
|
-
the codebase.
|
|
72
|
-
|
|
73
|
-
Typical prompt:
|
|
74
|
-
|
|
75
|
-
> Inspect the hero spacing, patch the live page until it looks correct, then tell me the minimal source change to make.
|
|
76
|
-
|
|
77
|
-
Useful direct commands:
|
|
78
|
-
|
|
79
|
-
```bash
|
|
80
|
-
bbx patch-style .hero gap=24px padding=32px
|
|
81
|
-
bbx patch-text .hero-title "New heading"
|
|
82
|
-
bbx patches
|
|
83
|
-
bbx rollback <patchId>
|
|
84
|
-
```
|
|
85
|
-
|
|
86
|
-
## 5. Collect compact evidence instead of taking full screenshots
|
|
87
|
-
|
|
88
|
-
Use this when you want token-efficient evidence for the agent.
|
|
89
|
-
|
|
90
|
-
Typical prompt:
|
|
91
|
-
|
|
92
|
-
> Read the visible page state, console errors, and the box model for the checkout summary without dumping the whole DOM.
|
|
93
|
-
|
|
94
|
-
Useful direct commands:
|
|
95
|
-
|
|
96
|
-
```bash
|
|
97
|
-
bbx call page.get_state
|
|
98
|
-
bbx console all
|
|
99
|
-
bbx network 20
|
|
100
|
-
bbx box .checkout-summary
|
|
101
|
-
bbx text .checkout-summary medium
|
|
102
|
-
```
|
|
103
|
-
|
|
104
|
-
If `page.get_console` or `page.get_network` returns `dropped`, the page was
|
|
105
|
-
noisy enough to evict older buffered entries. Narrow the repro and re-run the
|
|
106
|
-
read before assuming you saw the full history.
|
|
107
|
-
|
|
108
|
-
## 6. Capture the whole document only when the page-level layout is the issue
|
|
109
|
-
|
|
110
|
-
Use this when a bug spans multiple viewports and tight crops cannot express the
|
|
111
|
-
problem.
|
|
112
|
-
|
|
113
|
-
Typical prompt:
|
|
114
|
-
|
|
115
|
-
> Capture the full page so we can verify how the header, hero, and footer line up across the whole document.
|
|
116
|
-
|
|
117
|
-
Useful direct commands:
|
|
118
|
-
|
|
119
|
-
```bash
|
|
120
|
-
bbx call input.scroll_into_view '{"target":{"selector":"main"}}'
|
|
121
|
-
bbx call screenshot.capture_full_page '{}'
|
|
122
|
-
```
|
|
123
|
-
|
|
124
|
-
## 7. Drop to the raw protocol when shortcuts are not enough
|
|
125
|
-
|
|
126
|
-
Use this when you need a method or parameter that the higher-level commands do
|
|
127
|
-
not expose.
|
|
128
|
-
|
|
129
|
-
```bash
|
|
130
|
-
bbx call page.get_state
|
|
131
|
-
bbx call dom.query '{"selector":".card","maxNodes":10}'
|
|
132
|
-
bbx batch '[{"method":"page.get_state"},{"method":"page.get_console","params":{"level":"error"}}]'
|
|
133
|
-
```
|
|
134
|
-
|
|
135
|
-
For a command-oriented walkthrough, see [cli-guide.md](./cli-guide.md). For
|
|
136
|
-
integration choices, see [mcp-vs-cli.md](./mcp-vs-cli.md).
|