pi-browser-harness 0.3.2 → 0.4.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/CHANGELOG.md +29 -0
- package/package.json +1 -1
- package/skills/pi-browser-harness/SKILL.md +32 -250
- package/src/cdp/network-buffer.ts +213 -0
- package/src/cdp/ownership.ts +72 -0
- package/src/cdp/session.ts +60 -14
- package/src/cdp/types.ts +1 -0
- package/src/client.ts +75 -4
- package/src/domains/click.ts +6 -5
- package/src/domains/js.ts +65 -6
- package/src/domains/navigate.ts +1 -1
- package/src/domains/network.ts +191 -20
- package/src/domains/screenshot.ts +8 -5
- package/src/domains/snapshot.ts +421 -0
- package/src/domains/tabs.ts +113 -39
- package/src/index.ts +17 -1
- package/src/registry.ts +6 -3
- package/src/state.ts +6 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,35 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to pi-browser-harness will be documented in this file.
|
|
4
4
|
|
|
5
|
+
## 0.4.0 — 2026-05-06
|
|
6
|
+
|
|
7
|
+
### Added
|
|
8
|
+
|
|
9
|
+
- **`browser_snapshot`** — new tool. Returns the structured CDP accessibility tree (roles, names, states, hierarchy) for the current page. For every interactive element (button, link, textbox, checkbox, etc.) the outline includes click coordinates as `@(x,y)`, fetched via `DOM.getBoxModel` per node in parallel under a 1.5s aggregate budget. Pass these straight to `browser_click` — no `browser_screenshot` round-trip needed. `format:"json"` returns the slim structure with `box: {x,y,width,height,cx,cy}` per node. Optional `includeScreenshot:true` attaches a JPEG (q=80) when visual confirmation is also wanted.
|
|
10
|
+
- **`browser_network_requests`** — new tool, replacing the deprecated `browser_get_network_log` placeholder. Lists requests captured on the current tab since attach with filters: `urlPattern` (substring; wrap in slashes for regex), `methodFilter`, `statusFilter`, `resourceTypes`, `sinceMs`, `limit` (default 50, cap 500). `includeResponseBodies:true` fetches `Network.getResponseBody` per matched record under a 5s aggregate budget with a 50 KB per-body cap. Buffer is page-scoped (cleared on tab switch) and bounded at 500 records; `bufferOverflowed` flag in the result reports drops since the last drain.
|
|
11
|
+
- **Tab ownership / harness-window isolation.** New `OwnershipRegistry` tracks which page targets this session opened. The harness now creates a dedicated Chrome window on first attach (`newWindow:true`) instead of grabbing the user's foreground tab; subsequent `browser_new_tab` calls open inside that window via `openerId`. `browser_list_tabs` defaults to `scope:"owned"`; pass `scope:"all"` to see the user's other tabs read-only. `browser_switch_tab` and the new **`browser_close_tab`** refuse non-owned tabs with a clear remediation hint. Ownership is persisted across session reloads via `BrowserState`. The session also subscribes `Target.setDiscoverTargets` and reaps `targetDestroyed` events so the registry stays in sync.
|
|
12
|
+
- **`Accessibility` CDP domain enabled** alongside Page/DOM/Runtime/Network on every attach.
|
|
13
|
+
- **`Ctrl+O` (`app.tools.expand`) expand/collapse on tool output.** Three tools now ship custom `renderResult`:
|
|
14
|
+
- `browser_snapshot` — collapsed: 4-line summary (node count, URL, landmarks/buttons/inputs, screenshot status). Expanded: full indented outline + inline screenshot when `includeScreenshot:true`.
|
|
15
|
+
- `browser_network_requests` — collapsed: header + first 5 rows. Expanded: full markdown table + per-request body sections when bodies were requested.
|
|
16
|
+
- `browser_execute_js` — collapsed: size + first 120-char preview. Expanded: pretty-printed JSON if value parses, otherwise raw value, in a code fence.
|
|
17
|
+
All three append a `keyHint("app.tools.expand", ...)` so the binding label adapts to user remaps.
|
|
18
|
+
|
|
19
|
+
### Changed
|
|
20
|
+
|
|
21
|
+
- **Tool prompts pivoted from screenshot-first to snapshot-first.** `browser_screenshot`'s description now explicitly says "NOT a default exploration tool". `browser_snapshot` is documented as the default for understanding pages; `browser_execute_js` as the default for surgical reads. `browser_click` guidance no longer instructs the agent to screenshot for coordinates — it points at `browser_snapshot`'s `@(x,y)` hints. `browser_open_urls` post-step flipped from screenshot to snapshot.
|
|
22
|
+
- **`SKILL.md` rewritten** (~342 lines → ~53 lines). Frontmatter description carries the tool-hierarchy hint (always in context per pi's progressive-disclosure model). Body keeps only what isn't already in tool prompts: the decision tree, the connection rules (real Chrome, no creds, dialog-first), and the `browser_run_script` daemon bindings (the only tool whose API can't be inferred from its prompt). Pattern reference, parallelization details, troubleshooting, and tool enumeration removed as duplication.
|
|
23
|
+
- **CDP `Network.*` events** are now consumed by an in-process aggregator (`src/cdp/network-buffer.ts`) wired into the existing single-consumer event loop in `src/cdp/session.ts`. Pure module, ring-buffered, non-destructive drain.
|
|
24
|
+
|
|
25
|
+
### Removed
|
|
26
|
+
|
|
27
|
+
- **`browser_get_network_log`** — was a deprecated placeholder in v0.3 that returned a "use PerformanceObserver" message because the CDP event stream had no public drain API. Replaced by `browser_network_requests`.
|
|
28
|
+
|
|
29
|
+
### Known follow-ups
|
|
30
|
+
|
|
31
|
+
- Live network streaming (`browser_network_monitor` real-time during a click) — deferred; reuses the same buffer plumbing once the post-hoc form is proven.
|
|
32
|
+
- No tests added in this release. Verification is manual against real Chrome.
|
|
33
|
+
|
|
5
34
|
## 0.3.2 — 2026-05-05
|
|
6
35
|
|
|
7
36
|
### Added
|
package/package.json
CHANGED
|
@@ -1,271 +1,53 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: pi-browser-harness
|
|
3
|
-
description: Direct browser control via CDP. Use when the user wants to automate, scrape, test, or interact with web pages. Connects to the user's already-running Chrome.
|
|
3
|
+
description: Direct browser control via CDP. Use when the user wants to automate, scrape, test, or interact with web pages. Connects to the user's already-running Chrome. Default to browser_snapshot for understanding pages and browser_execute_js for surgical reads — browser_screenshot is for visual verification only.
|
|
4
4
|
---
|
|
5
5
|
|
|
6
6
|
# pi-browser-harness
|
|
7
7
|
|
|
8
|
-
Direct browser control
|
|
9
|
-
Browser tools coexist with all standard pi tools (read, bash, edit, write, etc.).
|
|
8
|
+
Direct browser control of the user's running Chrome via CDP.
|
|
10
9
|
|
|
11
|
-
##
|
|
10
|
+
## Tool hierarchy
|
|
12
11
|
|
|
13
|
-
Run `/browser-setup` to install browser-harness and connect to Chrome. Chrome must be running
|
|
14
|
-
with remote debugging enabled. Start Chrome with:
|
|
15
|
-
|
|
16
|
-
```
|
|
17
|
-
--remote-debugging-port=9222
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
Check status with `/browser-status`. Restart the daemon with `/browser-reload-daemon`.
|
|
21
|
-
|
|
22
|
-
## Core Workflow
|
|
23
|
-
|
|
24
|
-
```
|
|
25
|
-
browser_screenshot() → browser_click(x, y) → browser_screenshot()
|
|
26
12
|
```
|
|
13
|
+
What do you need to know?
|
|
27
14
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
3. **Screenshot again** — verify the action worked
|
|
31
|
-
|
|
32
|
-
Compositor-level clicks (`Input.dispatchMouseEvent`) work through iframes, shadow DOM,
|
|
33
|
-
and cross-origin content. No selectors needed.
|
|
34
|
-
|
|
35
|
-
## Parallelization
|
|
36
|
-
|
|
37
|
-
**Always parallelize when possible.** The harness automatically serializes mutation tools so they never race on shared state. Emit independent tools in the same turn for better performance.
|
|
38
|
-
|
|
39
|
-
### What can run in parallel
|
|
40
|
-
|
|
41
|
-
- **Observation tools** (`browser_screenshot`, `browser_page_info`, `browser_execute_js`, `browser_list_tabs`, `browser_current_tab`, `browser_http_get`, `browser_print_to_pdf`) can run in parallel with each other and with mutation tools.
|
|
42
|
-
|
|
43
|
-
- **Opening result pages:** Use `browser_open_urls` to open multiple URLs in parallel tabs. After opening, use `browser_list_tabs` to see the new tabs and `browser_switch_tab` to visit each one.
|
|
44
|
-
|
|
45
|
-
- **API calls:** `browser_http_get` calls are independent of browser state — fire multiple GETs in parallel.
|
|
46
|
-
|
|
47
|
-
- **Read + browser tools:** Use `read` and `browser_*` tools in the same turn — reading files or previous results is independent of browser actions.
|
|
48
|
-
|
|
49
|
-
### What must be sequential (harness enforces this)
|
|
50
|
-
|
|
51
|
-
- **Mutation tools** (`click`, `type`, `scroll`, `navigate`, `switch_tab`, `press_key`, `drag_and_drop`, `upload_file`, `go_back`, `go_forward`, `reload`, `handle_dialog`, `viewport_resize`, `wait_for_load`, `download`) are automatically queued through a mutex. Even if you emit them in parallel, they execute serially in FIFO order. You do not need to worry about race conditions.
|
|
52
|
-
|
|
53
|
-
- **Tab switching then acting:** `browser_switch_tab` must complete before acting on the switched-to tab. This is enforced automatically.
|
|
54
|
-
|
|
55
|
-
### Pattern: Parallel research across tabs
|
|
56
|
-
|
|
57
|
-
```
|
|
58
|
-
# Step 1: Open all result pages at once
|
|
59
|
-
browser_open_urls(["url1", "url2", "url3"])
|
|
60
|
-
|
|
61
|
-
# Step 2: Wait for them to load, then extract in parallel
|
|
62
|
-
browser_list_tabs() # get targetIds
|
|
63
|
-
|
|
64
|
-
# Step 3: Extract data from each tab (parallel)
|
|
65
|
-
browser_switch_tab(targetId1) → browser_screenshot() # These are sequential per tab
|
|
66
|
-
browser_switch_tab(targetId2) → browser_execute_js(...) # but you batch switch+act
|
|
67
|
-
```
|
|
68
|
-
|
|
69
|
-
### Pattern: Parallel observation + mutation
|
|
70
|
-
|
|
71
|
-
```
|
|
72
|
-
# Fire observation tools while a mutation is in progress
|
|
73
|
-
browser_click(x, y) # mutation (queued)
|
|
74
|
-
browser_screenshot() # observation (runs immediately in parallel)
|
|
75
|
-
browser_page_info() # observation (runs immediately in parallel)
|
|
76
|
-
browser_http_get("https://api.example.com") # external (runs immediately in parallel)
|
|
77
|
-
```
|
|
78
|
-
|
|
79
|
-
## Available Tools
|
|
80
|
-
|
|
81
|
-
### Navigation
|
|
82
|
-
- `browser_navigate` — navigate to a URL (creates new tab on first call, reuses current tab after)
|
|
83
|
-
- `browser_new_tab` — open a new tab, optionally navigate (use for first navigation)
|
|
84
|
-
- `browser_open_urls` — open multiple URLs in parallel tabs (use after search to open result links)
|
|
85
|
-
- `browser_go_back` / `browser_go_forward` / `browser_reload` — history navigation
|
|
86
|
-
- `browser_page_info` — get URL, title, viewport, scroll position, or dialog info
|
|
87
|
-
- `browser_list_tabs` / `browser_current_tab` / `browser_switch_tab` — tab management
|
|
88
|
-
|
|
89
|
-
### Interaction
|
|
90
|
-
- `browser_click` — click at viewport CSS-pixel coordinates
|
|
91
|
-
- `browser_type` — type text into focused element
|
|
92
|
-
- `browser_press_key` — press a key (Enter, Tab, Escape, arrows, etc.)
|
|
93
|
-
- `browser_scroll` — scroll the page at coordinates
|
|
94
|
-
|
|
95
|
-
### Visual
|
|
96
|
-
- `browser_screenshot` — capture PNG or JPEG screenshot (rendered inline in the TUI)
|
|
97
|
-
|
|
98
|
-
### Data Extraction
|
|
99
|
-
- `browser_execute_js` — execute JavaScript and return result
|
|
100
|
-
- `browser_http_get` — direct HTTP GET outside browser (10-50x faster for APIs)
|
|
101
|
-
|
|
102
|
-
### Utility
|
|
103
|
-
- `browser_wait` — wait N seconds
|
|
104
|
-
- `browser_wait_for_load` — wait for document.readyState === 'complete'
|
|
105
|
-
- `browser_handle_dialog` — accept or dismiss JS dialogs (alert/confirm/prompt)
|
|
106
|
-
|
|
107
|
-
### Extending
|
|
108
|
-
- `browser_run_script` — execute a temporary script file with daemon access
|
|
109
|
-
|
|
110
|
-
## Pattern Reference
|
|
111
|
-
|
|
112
|
-
### Navigation
|
|
113
|
-
```
|
|
114
|
-
browser_new_tab("https://example.com") → browser_wait_for_load() → browser_screenshot()
|
|
115
|
-
```
|
|
116
|
-
|
|
117
|
-
### Form Filling
|
|
118
|
-
```
|
|
119
|
-
browser_screenshot() → find input coordinates
|
|
120
|
-
→ browser_click(x, y) → browser_type("text")
|
|
121
|
-
→ browser_press_key("Tab") → browser_screenshot()
|
|
122
|
-
```
|
|
123
|
-
|
|
124
|
-
### Data Extraction
|
|
125
|
-
```
|
|
126
|
-
browser_execute_js("document.querySelector('.price').innerText")
|
|
127
|
-
// or for APIs directly:
|
|
128
|
-
browser_http_get("https://api.example.com/data")
|
|
129
|
-
```
|
|
130
|
-
|
|
131
|
-
### Scrolling
|
|
132
|
-
```
|
|
133
|
-
browser_screenshot() → browser_scroll({ deltaY: 500 }) → browser_screenshot()
|
|
134
|
-
```
|
|
135
|
-
Note: deltaY follows W3C wheel-event convention: positive=down, negative=up. Default deltaY=300 scrolls down.
|
|
136
|
-
|
|
137
|
-
### Research (search engine + browser_open_urls)
|
|
138
|
-
```
|
|
139
|
-
browser_new_tab("https://google.com/search?q=query") → search engine results
|
|
140
|
-
browser_open_urls({urls: ["url1", "url2"]}) → open result pages in parallel tabs
|
|
141
|
-
browser_list_tabs() → see all open tabs with targetIds
|
|
142
|
-
browser_switch_tab({targetId: "..."}) → switch to a specific tab
|
|
143
|
-
browser_wait_for_load() → wait for the page to render
|
|
144
|
-
browser_screenshot() → visually inspect the page
|
|
145
|
-
browser_execute_js("document.querySelector('.content').innerText") → extract text
|
|
146
|
-
```
|
|
147
|
-
|
|
148
|
-
## Temporary Scripts
|
|
149
|
-
|
|
150
|
-
When the built-in tools aren't enough, write a temporary script to disk and execute it
|
|
151
|
-
with `browser_run_script`. Scripts run in the harness process with direct access to
|
|
152
|
-
the browser daemon and full Node.js APIs — no dynamic tool registration needed.
|
|
153
|
-
|
|
154
|
-
```
|
|
155
|
-
● agent: needs to scrape 47 paginated search result pages
|
|
15
|
+
├─ Page structure / what's clickable / labels?
|
|
16
|
+
│ → browser_snapshot (DEFAULT — AX tree with @(x,y) per interactive element)
|
|
156
17
|
│
|
|
157
|
-
|
|
18
|
+
├─ A specific element's value / attribute / coords?
|
|
19
|
+
│ → browser_execute_js (e.g. el.innerText, el.getBoundingClientRect())
|
|
158
20
|
│
|
|
159
|
-
|
|
21
|
+
├─ Network behavior on the current page?
|
|
22
|
+
│ → browser_network_requests
|
|
160
23
|
│
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
The script is written to disk, so it's auditable and re-runnable.
|
|
165
|
-
|
|
166
|
-
**When to use scripts:**
|
|
167
|
-
- You're about to do the same 3+ step sequence more than once
|
|
168
|
-
- You need a capability the built-in tools don't provide (e.g., bulk CSV export, structured extraction, pagination)
|
|
169
|
-
- You discover a domain-specific pattern that should be reusable
|
|
170
|
-
- The alternative is a fragile multi-turn loop of screenshots + clicks
|
|
171
|
-
|
|
172
|
-
**What NOT to do:**
|
|
173
|
-
- Don't write scripts for one-off actions — use the built-in browser_* tools directly.
|
|
174
|
-
- Don't try to call browser_* tools from within a script — sequence them as separate tool calls.
|
|
175
|
-
|
|
176
|
-
**Script bindings:**
|
|
177
|
-
- `params` — the arguments passed to browser_run_script
|
|
178
|
-
- `daemon` — browser daemon with these methods:
|
|
179
|
-
- `daemon.evaluateJs(expression)` — run JS in the current page
|
|
180
|
-
- `daemon.pageInfo()` — get current page info or dialog
|
|
181
|
-
- `daemon.listTabs()` — returns `{ success, data: [{ targetId, url, title }] }`
|
|
182
|
-
- `daemon.switchTab(targetId)` — switch to a tab by full targetId
|
|
183
|
-
- `daemon.newTab(url?)` — open and switch to a new tab
|
|
184
|
-
- `daemon.current()` — returns `{ targetId, url?, title? }`
|
|
185
|
-
- `daemon.session(targetId)` — returns a session object for raw CDP:
|
|
186
|
-
- `session.call(method, params?)` — CDP command on the page target
|
|
187
|
-
- `session.callOnTarget(method, params, sessionId)` — CDP on a specific session
|
|
188
|
-
- `session.callBrowser(method, params?)` — CDP on the browser target
|
|
189
|
-
- `session.takeDialog()` — get/dismiss pending dialog
|
|
190
|
-
- `require` — Node.js require() (use 'fs', 'path', 'crypto', etc.)
|
|
191
|
-
- `signal` — AbortSignal for cancellation
|
|
192
|
-
- `onUpdate` — progress callback: onUpdate({ content: [{ type: 'text', text: '...' }] })
|
|
193
|
-
- `ctx` — ExtensionContext (ctx.cwd, ctx.signal, etc.)
|
|
194
|
-
- `console`, `fetch`, `JSON`, `Buffer`, `setTimeout`, `clearTimeout`
|
|
195
|
-
|
|
196
|
-
**Example — a script that extracts structured data:**
|
|
197
|
-
```javascript
|
|
198
|
-
// /tmp/extract-products.js
|
|
199
|
-
const info = await daemon.pageInfo();
|
|
200
|
-
if (info && "dialog" in info) throw new Error("Dialog is blocking: " + info.dialog.message);
|
|
201
|
-
const data = await daemon.evaluateJs(`
|
|
202
|
-
JSON.stringify(Array.from(document.querySelectorAll('${params.rowSelector}')).map(el => ({
|
|
203
|
-
title: el.querySelector('${params.titleSelector}')?.textContent?.trim(),
|
|
204
|
-
price: el.querySelector('${params.priceSelector}')?.textContent?.trim(),
|
|
205
|
-
})))
|
|
206
|
-
`);
|
|
207
|
-
return { content: [{ type: 'text', text: data }], details: { raw: JSON.parse(data) } };
|
|
24
|
+
└─ Visual rendering (layout / colors / chart drew correctly)?
|
|
25
|
+
→ browser_screenshot (LAST RESORT — pixels only)
|
|
208
26
|
```
|
|
209
27
|
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
- **Don't launch your own browser** — you're connected to the user's real Chrome
|
|
213
|
-
- **Don't type credentials** — if you hit an auth wall, stop and ask the user
|
|
214
|
-
- **Don't assume page state** — screenshot to confirm
|
|
215
|
-
- **Don't write pixel coordinates into documentation** — describe how to locate targets (selectors, text, aria-label)
|
|
216
|
-
- **Don't use browser_navigate for first navigation** — use browser_new_tab to explicitly preserve the user's active tab (browser_navigate auto-creates a new tab on first call, but explicit is clearer)
|
|
217
|
-
- **Don't ignore dialogs** — if browser_page_info returns a dialog, handle it first
|
|
28
|
+
Pass `@(x,y)` from `browser_snapshot` straight to `browser_click`. No screenshot round-trip.
|
|
218
29
|
|
|
219
|
-
##
|
|
30
|
+
## Connection
|
|
220
31
|
|
|
221
|
-
|
|
222
|
-
If browser_page_info returns a dialog, handle it with browser_handle_dialog
|
|
223
|
-
before any other browser action.
|
|
32
|
+
You're attached to the user's real Chrome — never launch your own. If auth is required, stop and ask the user. If `browser_page_info` returns a dialog, handle it first with `browser_handle_dialog`.
|
|
224
33
|
|
|
225
|
-
|
|
226
|
-
// Check page_info first — if it shows a dialog:
|
|
227
|
-
browser_handle_dialog({ action: "accept" }) // accept/confirm
|
|
228
|
-
browser_handle_dialog({ action: "dismiss" }) // dismiss/cancel
|
|
229
|
-
browser_handle_dialog({ action: "accept", promptText: "hello" }) // prompt with text
|
|
230
|
-
```
|
|
231
|
-
|
|
232
|
-
## SPAs (React, Vue, etc.)
|
|
34
|
+
## Temporary scripts
|
|
233
35
|
|
|
234
|
-
`
|
|
235
|
-
Single-page apps often paint content after this. After wait_for_load, use
|
|
236
|
-
`browser_execute_js` to check for specific elements:
|
|
36
|
+
When a workflow repeats 3+ times or needs Node.js APIs, write a script to disk and run it with `browser_run_script`. Scripts get a `daemon` binding for direct CDP access — much faster than chaining tool calls.
|
|
237
37
|
|
|
238
|
-
|
|
239
|
-
browser_execute_js("!!document.querySelector('.loaded-content')")
|
|
240
|
-
```
|
|
38
|
+
**Bindings inside a script:**
|
|
241
39
|
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
`
|
|
245
|
-
-
|
|
246
|
-
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
-
|
|
251
|
-
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
-
|
|
255
|
-
-
|
|
256
|
-
- **Google navigation fails**: Google's anti-bot detection may reject CDP navigation; use `browser_http_get` to fetch search results instead
|
|
257
|
-
|
|
258
|
-
## Architecture
|
|
259
|
-
|
|
260
|
-
```
|
|
261
|
-
pi agent → pi-browser-harness (TypeScript)
|
|
262
|
-
│ CDP WebSocket
|
|
263
|
-
▼
|
|
264
|
-
Chrome
|
|
265
|
-
|
|
266
|
-
Temporary scripts:
|
|
267
|
-
write("/tmp/script.js") → browser_run_script("/tmp/script.js")
|
|
268
|
-
│ │
|
|
269
|
-
▼ ▼
|
|
270
|
-
script on disk (auditable) executed in harness process with daemon access
|
|
271
|
-
```
|
|
40
|
+
- `params` — args passed to `browser_run_script`
|
|
41
|
+
- `daemon`:
|
|
42
|
+
- `daemon.evaluateJs(expression)` — run JS in the current page
|
|
43
|
+
- `daemon.pageInfo()` — `{ url, title, ... }` or `{ dialog }`
|
|
44
|
+
- `daemon.listTabs()` / `daemon.switchTab(targetId)` / `daemon.newTab(url?)` / `daemon.current()`
|
|
45
|
+
- `daemon.session(targetId)` for raw CDP: `session.call`, `session.callOnTarget`, `session.callBrowser`, `session.takeDialog`
|
|
46
|
+
- `require`, `fetch`, `JSON`, `Buffer`, `console`, `setTimeout`, `clearTimeout`
|
|
47
|
+
- `signal` — AbortSignal
|
|
48
|
+
- `onUpdate({ content: [{ type: 'text', text }] })` — progress callback
|
|
49
|
+
- `ctx` — `ExtensionContext`
|
|
50
|
+
|
|
51
|
+
**Don't:**
|
|
52
|
+
- Use scripts for one-off actions — call `browser_*` tools directly.
|
|
53
|
+
- Call `browser_*` tools from inside a script — sequence them as separate tool calls outside.
|
|
@@ -0,0 +1,213 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* In-memory aggregator for CDP Network.* events.
|
|
3
|
+
*
|
|
4
|
+
* The CDP event stream is consumed by a single internal loop in session.ts.
|
|
5
|
+
* That loop hands Network.* event params to this module, which joins them into
|
|
6
|
+
* one record per requestId (request → response → finished/failed). Tools then
|
|
7
|
+
* read records via drain(), filtered to what the caller asked for.
|
|
8
|
+
*
|
|
9
|
+
* Bounded by a fixed capacity (default 500): on overflow the oldest record is
|
|
10
|
+
* evicted FIFO. The overflow flag is reported once per drain so tools can warn
|
|
11
|
+
* the LLM that data may be missing.
|
|
12
|
+
*
|
|
13
|
+
* This module is pure (no CDP dependency) so the joining/filtering logic stays
|
|
14
|
+
* trivially testable in isolation.
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
export type NetworkRecord = {
|
|
18
|
+
requestId: string;
|
|
19
|
+
method: string;
|
|
20
|
+
url: string;
|
|
21
|
+
status?: number;
|
|
22
|
+
statusText?: string;
|
|
23
|
+
type: string;
|
|
24
|
+
mimeType?: string;
|
|
25
|
+
/** Wall-clock ms when requestWillBeSent fired, in Date.now() units. */
|
|
26
|
+
requestStartedMs: number;
|
|
27
|
+
durationMs?: number;
|
|
28
|
+
requestBodySize: number;
|
|
29
|
+
responseBodySize?: number;
|
|
30
|
+
failed?: boolean;
|
|
31
|
+
errorText?: string;
|
|
32
|
+
/** Populated by the tool layer via Network.getResponseBody, never by the aggregator. */
|
|
33
|
+
body?: string | null;
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
export type NetworkFilter = {
|
|
37
|
+
/** Substring match by default. Wrap in slashes (`/foo/`) for regex. */
|
|
38
|
+
urlPattern?: string;
|
|
39
|
+
methodFilter?: string[];
|
|
40
|
+
statusFilter?: { min?: number; max?: number };
|
|
41
|
+
resourceTypes?: string[];
|
|
42
|
+
/** Only requests whose start is at most N ms ago. */
|
|
43
|
+
sinceMs?: number;
|
|
44
|
+
/** Cap on the returned records. */
|
|
45
|
+
limit?: number;
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
export type DrainResult = {
|
|
49
|
+
readonly records: NetworkRecord[];
|
|
50
|
+
/** Total matches before `limit` was applied. */
|
|
51
|
+
readonly total: number;
|
|
52
|
+
/** True if the ring buffer evicted at least one record since the last drain. */
|
|
53
|
+
readonly bufferOverflowed: boolean;
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
export type NetworkBuffer = {
|
|
57
|
+
ingestRequestWillBeSent(p: unknown): void;
|
|
58
|
+
ingestResponseReceived(p: unknown): void;
|
|
59
|
+
ingestLoadingFinished(p: unknown): void;
|
|
60
|
+
ingestLoadingFailed(p: unknown): void;
|
|
61
|
+
drain(filter: NetworkFilter): DrainResult;
|
|
62
|
+
clear(): void;
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
const compileUrlMatcher = (pattern: string): ((url: string) => boolean) => {
|
|
66
|
+
if (pattern.length >= 2 && pattern.startsWith("/") && pattern.endsWith("/")) {
|
|
67
|
+
try {
|
|
68
|
+
const re = new RegExp(pattern.slice(1, -1));
|
|
69
|
+
return (url) => re.test(url);
|
|
70
|
+
} catch {
|
|
71
|
+
// Fall through to substring match if the pattern is not a valid regex.
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
return (url) => url.includes(pattern);
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
export const createNetworkBuffer = (capacity = 500): NetworkBuffer => {
|
|
78
|
+
// Insertion-ordered map keyed by requestId. Map preserves insertion order in JS,
|
|
79
|
+
// so iteration gives us oldest-first eviction without a separate index.
|
|
80
|
+
const records = new Map<string, NetworkRecord>();
|
|
81
|
+
let overflowed = false;
|
|
82
|
+
|
|
83
|
+
const evictOldestIfFull = (): void => {
|
|
84
|
+
while (records.size >= capacity) {
|
|
85
|
+
const oldest = records.keys().next();
|
|
86
|
+
if (oldest.done) return;
|
|
87
|
+
records.delete(oldest.value);
|
|
88
|
+
overflowed = true;
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
|
|
92
|
+
return {
|
|
93
|
+
ingestRequestWillBeSent(p) {
|
|
94
|
+
// CDP boundary cast: Network.requestWillBeSent
|
|
95
|
+
const params = p as
|
|
96
|
+
| {
|
|
97
|
+
requestId?: string;
|
|
98
|
+
request?: {
|
|
99
|
+
url?: string;
|
|
100
|
+
method?: string;
|
|
101
|
+
postData?: string;
|
|
102
|
+
headers?: Record<string, string>;
|
|
103
|
+
};
|
|
104
|
+
type?: string;
|
|
105
|
+
timestamp?: number;
|
|
106
|
+
wallTime?: number;
|
|
107
|
+
}
|
|
108
|
+
| undefined;
|
|
109
|
+
const id = params?.requestId;
|
|
110
|
+
const url = params?.request?.url;
|
|
111
|
+
const method = params?.request?.method;
|
|
112
|
+
if (!id || !url || !method) return;
|
|
113
|
+
// Re-fired requestWillBeSent for the same id (e.g. redirect) — refresh in place.
|
|
114
|
+
records.delete(id);
|
|
115
|
+
evictOldestIfFull();
|
|
116
|
+
const postData = params.request?.postData;
|
|
117
|
+
records.set(id, {
|
|
118
|
+
requestId: id,
|
|
119
|
+
method,
|
|
120
|
+
url,
|
|
121
|
+
type: params.type ?? "Other",
|
|
122
|
+
requestStartedMs: Date.now(),
|
|
123
|
+
requestBodySize: postData ? Buffer.byteLength(postData, "utf8") : 0,
|
|
124
|
+
});
|
|
125
|
+
},
|
|
126
|
+
|
|
127
|
+
ingestResponseReceived(p) {
|
|
128
|
+
// CDP boundary cast: Network.responseReceived
|
|
129
|
+
const params = p as
|
|
130
|
+
| {
|
|
131
|
+
requestId?: string;
|
|
132
|
+
response?: {
|
|
133
|
+
status?: number;
|
|
134
|
+
statusText?: string;
|
|
135
|
+
mimeType?: string;
|
|
136
|
+
};
|
|
137
|
+
type?: string;
|
|
138
|
+
}
|
|
139
|
+
| undefined;
|
|
140
|
+
const id = params?.requestId;
|
|
141
|
+
if (!id) return;
|
|
142
|
+
const r = records.get(id);
|
|
143
|
+
if (!r) return;
|
|
144
|
+
if (params?.response?.status !== undefined) r.status = params.response.status;
|
|
145
|
+
if (params?.response?.statusText !== undefined && params.response.statusText !== "") r.statusText = params.response.statusText;
|
|
146
|
+
if (params?.response?.mimeType !== undefined) r.mimeType = params.response.mimeType;
|
|
147
|
+
// type is more accurate on responseReceived (CDP sometimes refines it)
|
|
148
|
+
if (params?.type !== undefined) r.type = params.type;
|
|
149
|
+
},
|
|
150
|
+
|
|
151
|
+
ingestLoadingFinished(p) {
|
|
152
|
+
// CDP boundary cast: Network.loadingFinished
|
|
153
|
+
const params = p as
|
|
154
|
+
| { requestId?: string; encodedDataLength?: number }
|
|
155
|
+
| undefined;
|
|
156
|
+
const id = params?.requestId;
|
|
157
|
+
if (!id) return;
|
|
158
|
+
const r = records.get(id);
|
|
159
|
+
if (!r) return;
|
|
160
|
+
if (params?.encodedDataLength !== undefined) r.responseBodySize = params.encodedDataLength;
|
|
161
|
+
r.durationMs = Date.now() - r.requestStartedMs;
|
|
162
|
+
},
|
|
163
|
+
|
|
164
|
+
ingestLoadingFailed(p) {
|
|
165
|
+
// CDP boundary cast: Network.loadingFailed
|
|
166
|
+
const params = p as
|
|
167
|
+
| { requestId?: string; errorText?: string; canceled?: boolean }
|
|
168
|
+
| undefined;
|
|
169
|
+
const id = params?.requestId;
|
|
170
|
+
if (!id) return;
|
|
171
|
+
const r = records.get(id);
|
|
172
|
+
if (!r) return;
|
|
173
|
+
r.failed = true;
|
|
174
|
+
if (params?.errorText !== undefined) r.errorText = params.errorText;
|
|
175
|
+
r.durationMs = Date.now() - r.requestStartedMs;
|
|
176
|
+
},
|
|
177
|
+
|
|
178
|
+
drain(filter) {
|
|
179
|
+
const matchUrl = filter.urlPattern !== undefined ? compileUrlMatcher(filter.urlPattern) : undefined;
|
|
180
|
+
const methods = filter.methodFilter ? new Set(filter.methodFilter.map((m) => m.toUpperCase())) : undefined;
|
|
181
|
+
const types = filter.resourceTypes ? new Set(filter.resourceTypes.map((t) => t.toLowerCase())) : undefined;
|
|
182
|
+
const minStatus = filter.statusFilter?.min;
|
|
183
|
+
const maxStatus = filter.statusFilter?.max;
|
|
184
|
+
const cutoff = filter.sinceMs !== undefined ? Date.now() - filter.sinceMs : undefined;
|
|
185
|
+
|
|
186
|
+
const matched: NetworkRecord[] = [];
|
|
187
|
+
for (const r of records.values()) {
|
|
188
|
+
if (matchUrl && !matchUrl(r.url)) continue;
|
|
189
|
+
if (methods && !methods.has(r.method.toUpperCase())) continue;
|
|
190
|
+
if (types && !types.has(r.type.toLowerCase())) continue;
|
|
191
|
+
if (cutoff !== undefined && r.requestStartedMs < cutoff) continue;
|
|
192
|
+
if (minStatus !== undefined && (r.status === undefined || r.status < minStatus)) continue;
|
|
193
|
+
if (maxStatus !== undefined && (r.status === undefined || r.status > maxStatus)) continue;
|
|
194
|
+
// Clone so callers can mutate (e.g. attach body) without polluting the buffer.
|
|
195
|
+
matched.push({ ...r });
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
const total = matched.length;
|
|
199
|
+
const limit = Math.min(filter.limit ?? 50, 500);
|
|
200
|
+
const limited = matched.slice(-limit); // most recent N
|
|
201
|
+
|
|
202
|
+
const bufferOverflowed = overflowed;
|
|
203
|
+
overflowed = false;
|
|
204
|
+
|
|
205
|
+
return { records: limited, total, bufferOverflowed };
|
|
206
|
+
},
|
|
207
|
+
|
|
208
|
+
clear() {
|
|
209
|
+
records.clear();
|
|
210
|
+
overflowed = false;
|
|
211
|
+
},
|
|
212
|
+
};
|
|
213
|
+
};
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Tracks which tab targetIds belong to this harness session.
|
|
3
|
+
*
|
|
4
|
+
* The harness attaches to the user's running Chrome, which is also full of
|
|
5
|
+
* the user's own tabs. Without an ownership boundary the agent could attach
|
|
6
|
+
* to (or close) personal tabs by accident. The registry is the single source
|
|
7
|
+
* of truth for "did this session open that tab?".
|
|
8
|
+
*
|
|
9
|
+
* Mutations notify a single change listener so the orchestrator can persist
|
|
10
|
+
* to disk via the existing BrowserState flow without the registry needing to
|
|
11
|
+
* know about the pi storage API.
|
|
12
|
+
*/
|
|
13
|
+
|
|
14
|
+
export type OwnershipRegistry = {
|
|
15
|
+
add(targetId: string): void;
|
|
16
|
+
remove(targetId: string): void;
|
|
17
|
+
has(targetId: string): boolean;
|
|
18
|
+
list(): ReadonlyArray<string>;
|
|
19
|
+
/** Replace the full set — used on restoreState to re-hydrate from disk. */
|
|
20
|
+
replaceAll(ids: ReadonlyArray<string>): void;
|
|
21
|
+
setHarnessWindow(targetId: string | undefined): void;
|
|
22
|
+
harnessWindow(): string | undefined;
|
|
23
|
+
onChange(cb: () => void): void;
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
export const createOwnershipRegistry = (
|
|
27
|
+
initial?: { readonly ownedTargetIds?: ReadonlyArray<string>; readonly harnessWindowTargetId?: string },
|
|
28
|
+
): OwnershipRegistry => {
|
|
29
|
+
const owned = new Set<string>(initial?.ownedTargetIds ?? []);
|
|
30
|
+
let harnessWindow: string | undefined = initial?.harnessWindowTargetId;
|
|
31
|
+
let listener: (() => void) | null = null;
|
|
32
|
+
|
|
33
|
+
const notify = (): void => {
|
|
34
|
+
if (listener) listener();
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
return {
|
|
38
|
+
add(targetId) {
|
|
39
|
+
if (owned.has(targetId)) return;
|
|
40
|
+
owned.add(targetId);
|
|
41
|
+
notify();
|
|
42
|
+
},
|
|
43
|
+
remove(targetId) {
|
|
44
|
+
if (!owned.has(targetId) && harnessWindow !== targetId) return;
|
|
45
|
+
owned.delete(targetId);
|
|
46
|
+
if (harnessWindow === targetId) harnessWindow = undefined;
|
|
47
|
+
notify();
|
|
48
|
+
},
|
|
49
|
+
has(targetId) {
|
|
50
|
+
return owned.has(targetId);
|
|
51
|
+
},
|
|
52
|
+
list() {
|
|
53
|
+
return [...owned];
|
|
54
|
+
},
|
|
55
|
+
replaceAll(ids) {
|
|
56
|
+
owned.clear();
|
|
57
|
+
for (const id of ids) owned.add(id);
|
|
58
|
+
notify();
|
|
59
|
+
},
|
|
60
|
+
setHarnessWindow(targetId) {
|
|
61
|
+
if (harnessWindow === targetId) return;
|
|
62
|
+
harnessWindow = targetId;
|
|
63
|
+
notify();
|
|
64
|
+
},
|
|
65
|
+
harnessWindow() {
|
|
66
|
+
return harnessWindow;
|
|
67
|
+
},
|
|
68
|
+
onChange(cb) {
|
|
69
|
+
listener = cb;
|
|
70
|
+
},
|
|
71
|
+
};
|
|
72
|
+
};
|