@browserbridge/bbx 1.0.0 → 1.0.1

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.
Files changed (52) hide show
  1. package/README.md +3 -1
  2. package/docs/api-reference.md +33 -33
  3. package/docs/mcp-vs-cli.md +104 -104
  4. package/docs/publishing.md +1 -3
  5. package/docs/quickstart.md +6 -6
  6. package/docs/unpacked-extension.md +72 -0
  7. package/manifest.json +3 -17
  8. package/package.json +44 -42
  9. package/packages/agent-client/src/cli-helpers.js +10 -5
  10. package/packages/agent-client/src/cli.js +65 -135
  11. package/packages/agent-client/src/client.js +37 -17
  12. package/packages/agent-client/src/command-registry.js +101 -69
  13. package/packages/agent-client/src/detect.js +3 -6
  14. package/packages/agent-client/src/install.js +10 -27
  15. package/packages/agent-client/src/mcp-config.js +11 -30
  16. package/packages/agent-client/src/runtime.js +41 -20
  17. package/packages/agent-client/src/setup-status.js +13 -28
  18. package/packages/extension/src/background-helpers.js +51 -36
  19. package/packages/extension/src/background-routing.js +11 -13
  20. package/packages/extension/src/background.js +562 -299
  21. package/packages/extension/src/content-script-helpers.js +17 -16
  22. package/packages/extension/src/content-script.js +175 -109
  23. package/packages/extension/src/sidepanel-helpers.js +3 -1
  24. package/packages/extension/ui/popup.js +39 -20
  25. package/packages/extension/ui/sidepanel.js +108 -191
  26. package/packages/extension/ui/ui.css +2 -1
  27. package/packages/mcp-server/src/handlers.js +546 -250
  28. package/packages/mcp-server/src/server.js +558 -257
  29. package/packages/native-host/bin/bridge-daemon.js +6 -2
  30. package/packages/native-host/bin/install-manifest.js +2 -2
  31. package/packages/native-host/bin/postinstall.js +4 -2
  32. package/packages/native-host/src/config.js +11 -7
  33. package/packages/native-host/src/daemon.js +143 -92
  34. package/packages/native-host/src/install-manifest.js +73 -22
  35. package/packages/native-host/src/native-host.js +55 -40
  36. package/packages/protocol/src/budget.js +3 -7
  37. package/packages/protocol/src/capabilities.js +3 -3
  38. package/packages/protocol/src/errors.js +11 -11
  39. package/packages/protocol/src/protocol.js +104 -71
  40. package/packages/protocol/src/registry.js +300 -45
  41. package/packages/protocol/src/summary.js +249 -106
  42. package/packages/protocol/src/types.js +1 -1
  43. package/skills/browser-bridge/SKILL.md +1 -1
  44. package/skills/browser-bridge/agents/openai.yaml +3 -3
  45. package/skills/browser-bridge/references/interaction.md +33 -11
  46. package/skills/browser-bridge/references/patch-workflow.md +3 -0
  47. package/skills/browser-bridge/references/protocol.md +125 -70
  48. package/skills/browser-bridge/references/tailwind.md +12 -11
  49. package/skills/browser-bridge/references/token-efficiency.md +23 -22
  50. package/skills/browser-bridge/references/ui-workflows.md +8 -0
  51. package/packages/extension/ui/offscreen.html +0 -6
  52. package/packages/extension/ui/offscreen.js +0 -61
package/README.md CHANGED
@@ -2,6 +2,8 @@
2
2
 
3
3
  ![Browser Bridge: Connect AI Agent and Browsers](https://raw.githubusercontent.com/koltyakov/browser-bridge/main/assets/banner.jpg)
4
4
 
5
+ > **Chrome Web Store status:** The extension is currently under review. Until the listing is live, use the unpacked install flow in [docs/unpacked-extension.md](https://github.com/koltyakov/browser-bridge/blob/main/docs/unpacked-extension.md).
6
+
5
7
  A local bridge between your coding agent and a real Chrome tab. Browser Bridge gives the agent structured access to DOM, styles, layout, console, network, and reversible patches - starting from the actual tab you already have open, with all its real state intact.
6
8
 
7
9
  See [Quickstart](https://github.com/koltyakov/browser-bridge/blob/main/docs/quickstart.md) to get started in another repo, or browse the rest of the guides in [docs/index.md](https://github.com/koltyakov/browser-bridge/blob/main/docs/index.md).
@@ -105,7 +107,7 @@ Browser Bridge is optimized for the opposite starting point: **inspect the state
105
107
 
106
108
  1. Install [Browser Bridge from the Chrome Web Store](https://chrome.google.com/webstore/detail/jjjkmmcdkpcgamlopogicbnnhdgebhie) <!-- TODO: replace with final store link after publishing -->
107
109
  2. `npm install -g @browserbridge/bbx` - installs the CLI and native host
108
- 3. In the extension side panel, install MCP or CLI (skill) for your agent of choice, or run the `bbx install-mcp` / `bbx install-skill` commands if you prefer terminal setup
110
+ 3. In the extension side panel, install MCP or CLI (skill) for your agent of choice
109
111
  4. Enable Browser Bridge for the Chrome window you want to inspect/control with the AI agent
110
112
  5. Ask your agent to use Browser Bridge via MCP (`BB MCP` or `Browser Bridge MCP`), or invoke the `browser-bridge` / `$bbx` skill in CLI mode
111
113
 
@@ -59,8 +59,8 @@ Send a bridge request and return the response.
59
59
  const response = await client.request({
60
60
  method: 'dom.query',
61
61
  params: { selector: 'h1', maxNodes: 5 },
62
- tabId: 123, // optional - required for tab-bound methods
63
- timeoutMs: 10_000 // optional - overrides defaultTimeoutMs
62
+ tabId: 123, // optional - required for tab-bound methods
63
+ timeoutMs: 10_000, // optional - overrides defaultTimeoutMs
64
64
  });
65
65
 
66
66
  if (response.ok) {
@@ -82,7 +82,7 @@ retry guidance:
82
82
 
83
83
  ```js
84
84
  if (!response.ok && response.error.recovery?.retry) {
85
- await new Promise(r => setTimeout(r, response.error.recovery.retryAfterMs ?? 1000));
85
+ await new Promise((r) => setTimeout(r, response.error.recovery.retryAfterMs ?? 1000));
86
86
  // retry once
87
87
  }
88
88
  ```
@@ -110,39 +110,39 @@ client.on('reconnected', () => {
110
110
 
111
111
  See [`packages/protocol/src/registry.js`](../packages/protocol/src/registry.js) for the full list. Common ones:
112
112
 
113
- | Method | Description |
114
- |--------|-------------|
115
- | `access.request` | Request window access (surfaces Enable prompt) |
116
- | `health.ping` | Check daemon and extension connectivity |
117
- | `tabs.list` | List tabs in the enabled window |
118
- | `page.get_state` | URL, title, readyState of the active tab |
119
- | `dom.query` | Query DOM subtree with CSS selector |
120
- | `dom.find_by_text` | Find elements by visible text |
121
- | `page.evaluate` | Run JavaScript in the page context |
122
- | `page.get_console` | Read buffered console output |
123
- | `page.get_network` | Read intercepted fetch/XHR requests |
124
- | `input.click` | Click an element |
125
- | `input.type` | Type text into an element |
126
- | `navigation.navigate` | Navigate to a URL |
127
- | `screenshot.capture_element` | Capture element as PNG (base64) |
128
- | `patch.apply_styles` | Apply reversible CSS overrides |
113
+ | Method | Description |
114
+ | ---------------------------- | ---------------------------------------------- |
115
+ | `access.request` | Request window access (surfaces Enable prompt) |
116
+ | `health.ping` | Check daemon and extension connectivity |
117
+ | `tabs.list` | List tabs in the enabled window |
118
+ | `page.get_state` | URL, title, readyState of the active tab |
119
+ | `dom.query` | Query DOM subtree with CSS selector |
120
+ | `dom.find_by_text` | Find elements by visible text |
121
+ | `page.evaluate` | Run JavaScript in the page context |
122
+ | `page.get_console` | Read buffered console output |
123
+ | `page.get_network` | Read intercepted fetch/XHR requests |
124
+ | `input.click` | Click an element |
125
+ | `input.type` | Type text into an element |
126
+ | `navigation.navigate` | Navigate to a URL |
127
+ | `screenshot.capture_element` | Capture element as PNG (base64) |
128
+ | `patch.apply_styles` | Apply reversible CSS overrides |
129
129
 
130
130
  ## Error codes
131
131
 
132
- | Code | Retryable | Meaning |
133
- |------|-----------|---------|
134
- | `ACCESS_DENIED` | No | Browser Bridge is disabled for this window |
135
- | `EXTENSION_DISCONNECTED` | Yes (3 s) | Extension not connected to daemon |
136
- | `TIMEOUT` | Yes (1 s) | Extension did not respond in time |
137
- | `RATE_LIMITED` | Yes (2 s) | Too many concurrent requests |
138
- | `ELEMENT_STALE` | No | Element was removed from the DOM |
139
- | `TAB_MISMATCH` | No | Tab closed or not found |
140
- | `INVALID_REQUEST` | No | Malformed method or params |
141
- | `INTERNAL_ERROR` | Yes (1 s) | Unexpected extension-side error |
142
- | `DAEMON_OFFLINE` | No | Daemon not running — start with `bbx-daemon` |
143
- | `CONNECTION_LOST` | Yes | Socket dropped mid-request — retry |
144
- | `BRIDGE_TIMEOUT` | Yes (1 s) | Extension took too long — retry with simpler call |
145
- | `NATIVE_HOST_UNAVAILABLE` | No | Run `bbx doctor` to diagnose |
132
+ | Code | Retryable | Meaning |
133
+ | ------------------------- | --------- | ------------------------------------------------- |
134
+ | `ACCESS_DENIED` | No | Browser Bridge is disabled for this window |
135
+ | `EXTENSION_DISCONNECTED` | Yes (3 s) | Extension not connected to daemon |
136
+ | `TIMEOUT` | Yes (1 s) | Extension did not respond in time |
137
+ | `RATE_LIMITED` | Yes (2 s) | Too many concurrent requests |
138
+ | `ELEMENT_STALE` | No | Element was removed from the DOM |
139
+ | `TAB_MISMATCH` | No | Tab closed or not found |
140
+ | `INVALID_REQUEST` | No | Malformed method or params |
141
+ | `INTERNAL_ERROR` | Yes (1 s) | Unexpected extension-side error |
142
+ | `DAEMON_OFFLINE` | No | Daemon not running — start with `bbx-daemon` |
143
+ | `CONNECTION_LOST` | Yes | Socket dropped mid-request — retry |
144
+ | `BRIDGE_TIMEOUT` | Yes (1 s) | Extension took too long — retry with simpler call |
145
+ | `NATIVE_HOST_UNAVAILABLE` | No | Run `bbx doctor` to diagnose |
146
146
 
147
147
  ## Using `withBridgeClient`
148
148
 
@@ -11,12 +11,12 @@ Short version:
11
11
 
12
12
  ## Overview
13
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 |
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
20
  | **Sandbox Compatibility** | Excellent (no shell required) | Variable (requires shell access) |
21
21
 
22
22
  ## Capability Matrix
@@ -34,95 +34,95 @@ Short version:
34
34
 
35
35
  ### Tab Management
36
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 |
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
43
 
44
44
  ### DOM Inspection
45
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 |
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
57
 
58
58
  ### Styles & Layout
59
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 |
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
66
 
67
67
  ### Page State
68
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 |
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
79
 
80
80
  ### Navigation
81
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 |
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
90
 
91
91
  ### Input & Interaction
92
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 |
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
103
  | Scroll target into view | `browser_input` (scroll_into_view) | `bbx call input.scroll_into_view` | CLI uses raw call |
104
104
 
105
105
  ### Patching
106
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 |
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
114
 
115
115
  ### Capture & Screenshots
116
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 |
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
126
 
127
127
  ### Advanced & Raw Protocol
128
128
 
@@ -140,31 +140,31 @@ Short version:
140
140
 
141
141
  ### MCP Advantages
142
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 |
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
153
 
154
154
  ### CLI Advantages
155
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 |
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
168
 
169
169
  ## Ergonomics Comparison
170
170
 
@@ -233,15 +233,15 @@ Escalate to `bbx screenshot`, `screenshot.capture_region`, or `screenshot.captur
233
233
 
234
234
  ## Client Compatibility Matrix
235
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 |
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
245
  | Generic agents | Yes (`.agents/mcp.json`) | `.agents/skills/` | MCP preferred when available |
246
246
 
247
247
  ## Summary
@@ -13,7 +13,7 @@ The published npm package now embeds the Browser Bridge store extension ID, so e
13
13
 
14
14
  ## Release Checklist
15
15
 
16
- 1. Bump the version in [package.json](../package.json) and [manifest.json](../manifest.json) together.
16
+ 1. Bump [package.json](../package.json) when releasing the CLI/npm package and [manifest.json](../manifest.json) when releasing the extension ZIP. They can advance independently.
17
17
  2. Run `npm install` if dependencies changed.
18
18
  3. Run `npm run release:check`.
19
19
  4. In npm package settings, add a GitHub Actions trusted publisher for this repository and workflow file `release.yml`.
@@ -71,14 +71,12 @@ Use one narrow sentence. Suggested draft:
71
71
 
72
72
  Use reviewer-facing explanations tied to the product purpose:
73
73
 
74
- - `activeTab`: used to bootstrap inspection against the tab the user explicitly enables
75
74
  - `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
75
  - `nativeMessaging`: required to communicate with the local Browser Bridge daemon
77
76
  - `scripting`: used to inject and coordinate the scoped page instrumentation flow
78
77
  - `sidePanel`: provides the side panel control surface
79
78
  - `storage`: persists window approvals, session state, and recent UI state for the current browser session
80
79
  - `tabs`: enumerates tabs and validates that a request stays inside the enabled window
81
- - `offscreen`: used for screenshot cropping in the offscreen document
82
80
  - `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
81
 
84
82
  Reviewers will likely scrutinize `debugger`, `nativeMessaging`, and `<all_urls>`. Keep the listing language narrow and explicit about user approval and local-only operation.
@@ -75,15 +75,15 @@ Your agent can now inspect and patch the active tab in that enabled window, or o
75
75
 
76
76
  You can refer to it as `BB MCP` or `Browser Bridge MCP`; both should work.
77
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?"*
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
82
 
83
83
  **Skill + CLI mode** - reference the skill explicitly so the agent knows to use `bbx`:
84
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."*
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
87
 
88
88
  For GitHub Copilot, invoke the skill by name, for example `/browser-bridge`.
89
89
  `bbx` is the Browser Bridge CLI command, not a guaranteed Copilot skill alias.
@@ -0,0 +1,72 @@
1
+ # Unpacked Extension Install
2
+
3
+ Use this path while the Chrome Web Store listing is still pending, or anytime
4
+ you want to run Browser Bridge without installing it from a marketplace.
5
+
6
+ ## 1. Install the CLI
7
+
8
+ ```bash
9
+ npm install -g @browserbridge/bbx
10
+ ```
11
+
12
+ ## 2. Build the unpacked extension bundle
13
+
14
+ From this repository, stage the extension files into `dist/`:
15
+
16
+ ```bash
17
+ npm run package:extension
18
+ ```
19
+
20
+ That writes the unpacked extension to:
21
+
22
+ ```text
23
+ dist/browser-bridge-extension/
24
+ ```
25
+
26
+ ## 3. Load it into Chrome
27
+
28
+ 1. Open `chrome://extensions`.
29
+ 2. Enable **Developer mode**.
30
+ 3. Click **Load unpacked**.
31
+ 4. Select `dist/browser-bridge-extension`.
32
+
33
+ ## 4. Copy the extension ID
34
+
35
+ After Chrome loads the unpacked extension, copy its extension ID from the
36
+ Extensions page.
37
+
38
+ ## 5. Install the native host for that extension ID
39
+
40
+ Unpacked builds do not use the published store ID, so install the native host
41
+ manifest explicitly for the loaded extension:
42
+
43
+ ```bash
44
+ bbx install <extension-id>
45
+ ```
46
+
47
+ You can also provide the same value through the environment if needed:
48
+
49
+ ```bash
50
+ BROWSER_BRIDGE_EXTENSION_ID=<extension-id> bbx install
51
+ ```
52
+
53
+ ## 6. Verify the local connection
54
+
55
+ ```bash
56
+ bbx status
57
+ bbx doctor
58
+ ```
59
+
60
+ Then open the Browser Bridge side panel in Chrome, enable access for the target
61
+ window, and verify the bridge is responding:
62
+
63
+ ```bash
64
+ bbx call page.get_state
65
+ ```
66
+
67
+ ## Notes
68
+
69
+ - Re-run `bbx install <extension-id>` if you switch to a different unpacked
70
+ extension build with a different ID.
71
+ - For packaged store builds, plain `bbx install` is the intended path once the
72
+ Chrome Web Store release is live.
package/manifest.json CHANGED
@@ -11,19 +11,15 @@
11
11
  "128": "packages/extension/assets/icon-128.png"
12
12
  },
13
13
  "permissions": [
14
- "activeTab",
15
14
  "alarms",
16
15
  "debugger",
17
16
  "nativeMessaging",
18
17
  "scripting",
19
18
  "sidePanel",
20
19
  "storage",
21
- "tabs",
22
- "offscreen"
23
- ],
24
- "host_permissions": [
25
- "<all_urls>"
20
+ "tabs"
26
21
  ],
22
+ "host_permissions": ["<all_urls>"],
27
23
  "background": {
28
24
  "service_worker": "packages/extension/src/background.js",
29
25
  "type": "module"
@@ -38,15 +34,5 @@
38
34
  },
39
35
  "side_panel": {
40
36
  "default_path": "packages/extension/ui/sidepanel.html"
41
- },
42
- "web_accessible_resources": [
43
- {
44
- "resources": [
45
- "packages/extension/ui/ui.css"
46
- ],
47
- "matches": [
48
- "<all_urls>"
49
- ]
50
- }
51
- ]
37
+ }
52
38
  }