@kritchoff/agent-browser 0.9.2
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/LICENSE +201 -0
- package/README.md +903 -0
- package/README.sdk.md +77 -0
- package/bin/agent-browser-linux-x64 +0 -0
- package/bin/agent-browser.js +109 -0
- package/dist/actions.d.ts +17 -0
- package/dist/actions.d.ts.map +1 -0
- package/dist/actions.js +1427 -0
- package/dist/actions.js.map +1 -0
- package/dist/browser.d.ts +474 -0
- package/dist/browser.d.ts.map +1 -0
- package/dist/browser.js +1566 -0
- package/dist/browser.js.map +1 -0
- package/dist/cdp-client.d.ts +103 -0
- package/dist/cdp-client.d.ts.map +1 -0
- package/dist/cdp-client.js +223 -0
- package/dist/cdp-client.js.map +1 -0
- package/dist/daemon.d.ts +60 -0
- package/dist/daemon.d.ts.map +1 -0
- package/dist/daemon.js +401 -0
- package/dist/daemon.js.map +1 -0
- package/dist/dualmode-config.d.ts +37 -0
- package/dist/dualmode-config.d.ts.map +1 -0
- package/dist/dualmode-config.js +44 -0
- package/dist/dualmode-config.js.map +1 -0
- package/dist/dualmode-fetcher.d.ts +60 -0
- package/dist/dualmode-fetcher.d.ts.map +1 -0
- package/dist/dualmode-fetcher.js +449 -0
- package/dist/dualmode-fetcher.js.map +1 -0
- package/dist/dualmode-types.d.ts +183 -0
- package/dist/dualmode-types.d.ts.map +1 -0
- package/dist/dualmode-types.js +8 -0
- package/dist/dualmode-types.js.map +1 -0
- package/dist/ios-actions.d.ts +11 -0
- package/dist/ios-actions.d.ts.map +1 -0
- package/dist/ios-actions.js +228 -0
- package/dist/ios-actions.js.map +1 -0
- package/dist/ios-manager.d.ts +266 -0
- package/dist/ios-manager.d.ts.map +1 -0
- package/dist/ios-manager.js +1073 -0
- package/dist/ios-manager.js.map +1 -0
- package/dist/protocol.d.ts +26 -0
- package/dist/protocol.d.ts.map +1 -0
- package/dist/protocol.js +832 -0
- package/dist/protocol.js.map +1 -0
- package/dist/snapshot.d.ts +83 -0
- package/dist/snapshot.d.ts.map +1 -0
- package/dist/snapshot.js +653 -0
- package/dist/snapshot.js.map +1 -0
- package/dist/stream-server.d.ts +117 -0
- package/dist/stream-server.d.ts.map +1 -0
- package/dist/stream-server.js +305 -0
- package/dist/stream-server.js.map +1 -0
- package/dist/types.d.ts +742 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +2 -0
- package/dist/types.js.map +1 -0
- package/docker-compose.sdk.yml +45 -0
- package/package.json +85 -0
- package/scripts/benchmark.sh +80 -0
- package/scripts/build-all-platforms.sh +68 -0
- package/scripts/check-version-sync.js +39 -0
- package/scripts/copy-native.js +36 -0
- package/scripts/fast_reset.sh +108 -0
- package/scripts/postinstall.js +235 -0
- package/scripts/publish_images.sh +55 -0
- package/scripts/snapshot_manager.sh +293 -0
- package/scripts/start-android-agent.sh +49 -0
- package/scripts/sync-version.js +69 -0
- package/scripts/vaccine-run +26 -0
- package/sdk.sh +153 -0
- package/skills/agent-browser/SKILL.md +217 -0
- package/skills/agent-browser/references/authentication.md +202 -0
- package/skills/agent-browser/references/commands.md +259 -0
- package/skills/agent-browser/references/proxy-support.md +188 -0
- package/skills/agent-browser/references/session-management.md +193 -0
- package/skills/agent-browser/references/snapshot-refs.md +194 -0
- package/skills/agent-browser/references/video-recording.md +173 -0
- package/skills/agent-browser/templates/authenticated-session.sh +97 -0
- package/skills/agent-browser/templates/capture-workflow.sh +69 -0
- package/skills/agent-browser/templates/form-automation.sh +62 -0
- package/skills/skill-creator/LICENSE.txt +202 -0
- package/skills/skill-creator/SKILL.md +356 -0
- package/skills/skill-creator/references/output-patterns.md +82 -0
- package/skills/skill-creator/references/workflows.md +28 -0
- package/skills/skill-creator/scripts/init_skill.py +303 -0
- package/skills/skill-creator/scripts/package_skill.py +113 -0
- package/skills/skill-creator/scripts/quick_validate.py +95 -0
package/dist/browser.js
ADDED
|
@@ -0,0 +1,1566 @@
|
|
|
1
|
+
import { chromium, firefox, webkit, devices, } from 'playwright-core';
|
|
2
|
+
import path from 'node:path';
|
|
3
|
+
import os from 'node:os';
|
|
4
|
+
import { existsSync, mkdirSync, rmSync } from 'node:fs';
|
|
5
|
+
import { getEnhancedSnapshot, parseRef } from './snapshot.js';
|
|
6
|
+
/**
|
|
7
|
+
* Manages the Playwright browser lifecycle with multiple tabs/windows
|
|
8
|
+
*/
|
|
9
|
+
export class BrowserManager {
|
|
10
|
+
browser = null;
|
|
11
|
+
cdpEndpoint = null; // stores port number or full URL
|
|
12
|
+
isPersistentContext = false;
|
|
13
|
+
browserbaseSessionId = null;
|
|
14
|
+
browserbaseApiKey = null;
|
|
15
|
+
browserUseSessionId = null;
|
|
16
|
+
browserUseApiKey = null;
|
|
17
|
+
kernelSessionId = null;
|
|
18
|
+
kernelApiKey = null;
|
|
19
|
+
contexts = [];
|
|
20
|
+
pages = [];
|
|
21
|
+
activePageIndex = 0;
|
|
22
|
+
activeFrame = null;
|
|
23
|
+
dialogHandler = null;
|
|
24
|
+
trackedRequests = [];
|
|
25
|
+
routes = new Map();
|
|
26
|
+
consoleMessages = [];
|
|
27
|
+
pageErrors = [];
|
|
28
|
+
isRecordingHar = false;
|
|
29
|
+
refMap = {};
|
|
30
|
+
lastSnapshot = '';
|
|
31
|
+
scopedHeaderRoutes = new Map();
|
|
32
|
+
// CDP session for screencast and input injection
|
|
33
|
+
cdpSession = null;
|
|
34
|
+
screencastActive = false;
|
|
35
|
+
screencastSessionId = 0;
|
|
36
|
+
frameCallback = null;
|
|
37
|
+
screencastFrameHandler = null;
|
|
38
|
+
// Video recording (Playwright native)
|
|
39
|
+
recordingContext = null;
|
|
40
|
+
recordingPage = null;
|
|
41
|
+
recordingOutputPath = '';
|
|
42
|
+
recordingTempDir = '';
|
|
43
|
+
/**
|
|
44
|
+
* Check if browser is launched
|
|
45
|
+
*/
|
|
46
|
+
isLaunched() {
|
|
47
|
+
return this.browser !== null || this.isPersistentContext;
|
|
48
|
+
}
|
|
49
|
+
/**
|
|
50
|
+
* Get enhanced snapshot with refs and cache the ref map
|
|
51
|
+
*/
|
|
52
|
+
async getSnapshot(options) {
|
|
53
|
+
const page = this.getPage();
|
|
54
|
+
const snapshot = await getEnhancedSnapshot(page, options);
|
|
55
|
+
this.refMap = snapshot.refs;
|
|
56
|
+
this.lastSnapshot = snapshot.tree;
|
|
57
|
+
return snapshot;
|
|
58
|
+
}
|
|
59
|
+
/**
|
|
60
|
+
* Get the cached ref map from last snapshot
|
|
61
|
+
*/
|
|
62
|
+
getRefMap() {
|
|
63
|
+
return this.refMap;
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* Get a locator from a ref (e.g., "e1", "@e1", "ref=e1")
|
|
67
|
+
* Returns null if ref doesn't exist or is invalid
|
|
68
|
+
*/
|
|
69
|
+
getLocatorFromRef(refArg) {
|
|
70
|
+
const ref = parseRef(refArg);
|
|
71
|
+
if (!ref)
|
|
72
|
+
return null;
|
|
73
|
+
const refData = this.refMap[ref];
|
|
74
|
+
if (!refData)
|
|
75
|
+
return null;
|
|
76
|
+
const page = this.getPage();
|
|
77
|
+
// Check if this is a cursor-interactive element (uses CSS selector, not ARIA role)
|
|
78
|
+
// These have pseudo-roles 'clickable' or 'focusable' and a CSS selector
|
|
79
|
+
if (refData.role === 'clickable' || refData.role === 'focusable') {
|
|
80
|
+
// The selector is a CSS selector, use it directly
|
|
81
|
+
return page.locator(refData.selector);
|
|
82
|
+
}
|
|
83
|
+
// Build locator with exact: true to avoid substring matches
|
|
84
|
+
let locator;
|
|
85
|
+
if (refData.name) {
|
|
86
|
+
locator = page.getByRole(refData.role, { name: refData.name, exact: true });
|
|
87
|
+
}
|
|
88
|
+
else {
|
|
89
|
+
locator = page.getByRole(refData.role);
|
|
90
|
+
}
|
|
91
|
+
// If an nth index is stored (for disambiguation), use it
|
|
92
|
+
if (refData.nth !== undefined) {
|
|
93
|
+
locator = locator.nth(refData.nth);
|
|
94
|
+
}
|
|
95
|
+
return locator;
|
|
96
|
+
}
|
|
97
|
+
/**
|
|
98
|
+
* Check if a selector looks like a ref
|
|
99
|
+
*/
|
|
100
|
+
isRef(selector) {
|
|
101
|
+
return parseRef(selector) !== null;
|
|
102
|
+
}
|
|
103
|
+
/**
|
|
104
|
+
* Get locator - supports both refs and regular selectors
|
|
105
|
+
*/
|
|
106
|
+
getLocator(selectorOrRef) {
|
|
107
|
+
// Check if it's a ref first
|
|
108
|
+
const locator = this.getLocatorFromRef(selectorOrRef);
|
|
109
|
+
if (locator)
|
|
110
|
+
return locator;
|
|
111
|
+
// Otherwise treat as regular selector
|
|
112
|
+
const page = this.getPage();
|
|
113
|
+
return page.locator(selectorOrRef);
|
|
114
|
+
}
|
|
115
|
+
/**
|
|
116
|
+
* Get the current active page, throws if not launched
|
|
117
|
+
*/
|
|
118
|
+
getPage() {
|
|
119
|
+
if (this.pages.length === 0) {
|
|
120
|
+
throw new Error('Browser not launched. Call launch first.');
|
|
121
|
+
}
|
|
122
|
+
return this.pages[this.activePageIndex];
|
|
123
|
+
}
|
|
124
|
+
/**
|
|
125
|
+
* Get the current frame (or page's main frame if no frame is selected)
|
|
126
|
+
*/
|
|
127
|
+
getFrame() {
|
|
128
|
+
if (this.activeFrame) {
|
|
129
|
+
return this.activeFrame;
|
|
130
|
+
}
|
|
131
|
+
return this.getPage().mainFrame();
|
|
132
|
+
}
|
|
133
|
+
/**
|
|
134
|
+
* Switch to a frame by selector, name, or URL
|
|
135
|
+
*/
|
|
136
|
+
async switchToFrame(options) {
|
|
137
|
+
const page = this.getPage();
|
|
138
|
+
if (options.selector) {
|
|
139
|
+
const frameElement = await page.$(options.selector);
|
|
140
|
+
if (!frameElement) {
|
|
141
|
+
throw new Error(`Frame not found: ${options.selector}`);
|
|
142
|
+
}
|
|
143
|
+
const frame = await frameElement.contentFrame();
|
|
144
|
+
if (!frame) {
|
|
145
|
+
throw new Error(`Element is not a frame: ${options.selector}`);
|
|
146
|
+
}
|
|
147
|
+
this.activeFrame = frame;
|
|
148
|
+
}
|
|
149
|
+
else if (options.name) {
|
|
150
|
+
const frame = page.frame({ name: options.name });
|
|
151
|
+
if (!frame) {
|
|
152
|
+
throw new Error(`Frame not found with name: ${options.name}`);
|
|
153
|
+
}
|
|
154
|
+
this.activeFrame = frame;
|
|
155
|
+
}
|
|
156
|
+
else if (options.url) {
|
|
157
|
+
const frame = page.frame({ url: options.url });
|
|
158
|
+
if (!frame) {
|
|
159
|
+
throw new Error(`Frame not found with URL: ${options.url}`);
|
|
160
|
+
}
|
|
161
|
+
this.activeFrame = frame;
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
/**
|
|
165
|
+
* Switch back to main frame
|
|
166
|
+
*/
|
|
167
|
+
switchToMainFrame() {
|
|
168
|
+
this.activeFrame = null;
|
|
169
|
+
}
|
|
170
|
+
/**
|
|
171
|
+
* Set up dialog handler
|
|
172
|
+
*/
|
|
173
|
+
setDialogHandler(response, promptText) {
|
|
174
|
+
const page = this.getPage();
|
|
175
|
+
// Remove existing handler if any
|
|
176
|
+
if (this.dialogHandler) {
|
|
177
|
+
page.removeListener('dialog', this.dialogHandler);
|
|
178
|
+
}
|
|
179
|
+
this.dialogHandler = async (dialog) => {
|
|
180
|
+
if (response === 'accept') {
|
|
181
|
+
await dialog.accept(promptText);
|
|
182
|
+
}
|
|
183
|
+
else {
|
|
184
|
+
await dialog.dismiss();
|
|
185
|
+
}
|
|
186
|
+
};
|
|
187
|
+
page.on('dialog', this.dialogHandler);
|
|
188
|
+
}
|
|
189
|
+
/**
|
|
190
|
+
* Clear dialog handler
|
|
191
|
+
*/
|
|
192
|
+
clearDialogHandler() {
|
|
193
|
+
if (this.dialogHandler) {
|
|
194
|
+
const page = this.getPage();
|
|
195
|
+
page.removeListener('dialog', this.dialogHandler);
|
|
196
|
+
this.dialogHandler = null;
|
|
197
|
+
}
|
|
198
|
+
}
|
|
199
|
+
/**
|
|
200
|
+
* Start tracking requests
|
|
201
|
+
*/
|
|
202
|
+
startRequestTracking() {
|
|
203
|
+
const page = this.getPage();
|
|
204
|
+
page.on('request', (request) => {
|
|
205
|
+
this.trackedRequests.push({
|
|
206
|
+
url: request.url(),
|
|
207
|
+
method: request.method(),
|
|
208
|
+
headers: request.headers(),
|
|
209
|
+
timestamp: Date.now(),
|
|
210
|
+
resourceType: request.resourceType(),
|
|
211
|
+
});
|
|
212
|
+
});
|
|
213
|
+
}
|
|
214
|
+
/**
|
|
215
|
+
* Get tracked requests
|
|
216
|
+
*/
|
|
217
|
+
getRequests(filter) {
|
|
218
|
+
if (filter) {
|
|
219
|
+
return this.trackedRequests.filter((r) => r.url.includes(filter));
|
|
220
|
+
}
|
|
221
|
+
return this.trackedRequests;
|
|
222
|
+
}
|
|
223
|
+
/**
|
|
224
|
+
* Clear tracked requests
|
|
225
|
+
*/
|
|
226
|
+
clearRequests() {
|
|
227
|
+
this.trackedRequests = [];
|
|
228
|
+
}
|
|
229
|
+
/**
|
|
230
|
+
* Add a route to intercept requests
|
|
231
|
+
*/
|
|
232
|
+
async addRoute(url, options) {
|
|
233
|
+
const page = this.getPage();
|
|
234
|
+
const handler = async (route) => {
|
|
235
|
+
if (options.abort) {
|
|
236
|
+
await route.abort();
|
|
237
|
+
}
|
|
238
|
+
else if (options.response) {
|
|
239
|
+
await route.fulfill({
|
|
240
|
+
status: options.response.status ?? 200,
|
|
241
|
+
body: options.response.body ?? '',
|
|
242
|
+
contentType: options.response.contentType ?? 'text/plain',
|
|
243
|
+
headers: options.response.headers,
|
|
244
|
+
});
|
|
245
|
+
}
|
|
246
|
+
else {
|
|
247
|
+
await route.continue();
|
|
248
|
+
}
|
|
249
|
+
};
|
|
250
|
+
this.routes.set(url, handler);
|
|
251
|
+
await page.route(url, handler);
|
|
252
|
+
}
|
|
253
|
+
/**
|
|
254
|
+
* Remove a route
|
|
255
|
+
*/
|
|
256
|
+
async removeRoute(url) {
|
|
257
|
+
const page = this.getPage();
|
|
258
|
+
if (url) {
|
|
259
|
+
const handler = this.routes.get(url);
|
|
260
|
+
if (handler) {
|
|
261
|
+
await page.unroute(url, handler);
|
|
262
|
+
this.routes.delete(url);
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
else {
|
|
266
|
+
// Remove all routes
|
|
267
|
+
for (const [routeUrl, handler] of this.routes) {
|
|
268
|
+
await page.unroute(routeUrl, handler);
|
|
269
|
+
}
|
|
270
|
+
this.routes.clear();
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
/**
|
|
274
|
+
* Set geolocation
|
|
275
|
+
*/
|
|
276
|
+
async setGeolocation(latitude, longitude, accuracy) {
|
|
277
|
+
const context = this.contexts[0];
|
|
278
|
+
if (context) {
|
|
279
|
+
await context.setGeolocation({ latitude, longitude, accuracy });
|
|
280
|
+
}
|
|
281
|
+
}
|
|
282
|
+
/**
|
|
283
|
+
* Set permissions
|
|
284
|
+
*/
|
|
285
|
+
async setPermissions(permissions, grant) {
|
|
286
|
+
const context = this.contexts[0];
|
|
287
|
+
if (context) {
|
|
288
|
+
if (grant) {
|
|
289
|
+
await context.grantPermissions(permissions);
|
|
290
|
+
}
|
|
291
|
+
else {
|
|
292
|
+
await context.clearPermissions();
|
|
293
|
+
}
|
|
294
|
+
}
|
|
295
|
+
}
|
|
296
|
+
/**
|
|
297
|
+
* Set viewport
|
|
298
|
+
*/
|
|
299
|
+
async setViewport(width, height) {
|
|
300
|
+
const page = this.getPage();
|
|
301
|
+
await page.setViewportSize({ width, height });
|
|
302
|
+
}
|
|
303
|
+
/**
|
|
304
|
+
* Set device scale factor (devicePixelRatio) via CDP
|
|
305
|
+
* This sets window.devicePixelRatio which affects how the page renders and responds to media queries
|
|
306
|
+
*
|
|
307
|
+
* Note: When using CDP to set deviceScaleFactor, screenshots will be at logical pixel dimensions
|
|
308
|
+
* (viewport size), not physical pixel dimensions (viewport × scale). This is a Playwright limitation
|
|
309
|
+
* when using CDP emulation on existing contexts. For true HiDPI screenshots with physical pixels,
|
|
310
|
+
* deviceScaleFactor must be set at context creation time.
|
|
311
|
+
*
|
|
312
|
+
* Must be called after setViewport to work correctly
|
|
313
|
+
*/
|
|
314
|
+
async setDeviceScaleFactor(deviceScaleFactor, width, height, mobile = false) {
|
|
315
|
+
const cdp = await this.getCDPSession();
|
|
316
|
+
await cdp.send('Emulation.setDeviceMetricsOverride', {
|
|
317
|
+
width,
|
|
318
|
+
height,
|
|
319
|
+
deviceScaleFactor,
|
|
320
|
+
mobile,
|
|
321
|
+
});
|
|
322
|
+
}
|
|
323
|
+
/**
|
|
324
|
+
* Clear device metrics override to restore default devicePixelRatio
|
|
325
|
+
*/
|
|
326
|
+
async clearDeviceMetricsOverride() {
|
|
327
|
+
const cdp = await this.getCDPSession();
|
|
328
|
+
await cdp.send('Emulation.clearDeviceMetricsOverride');
|
|
329
|
+
}
|
|
330
|
+
/**
|
|
331
|
+
* Get device descriptor
|
|
332
|
+
*/
|
|
333
|
+
getDevice(deviceName) {
|
|
334
|
+
return devices[deviceName];
|
|
335
|
+
}
|
|
336
|
+
/**
|
|
337
|
+
* List available devices
|
|
338
|
+
*/
|
|
339
|
+
listDevices() {
|
|
340
|
+
return Object.keys(devices);
|
|
341
|
+
}
|
|
342
|
+
/**
|
|
343
|
+
* Start console message tracking
|
|
344
|
+
*/
|
|
345
|
+
startConsoleTracking() {
|
|
346
|
+
const page = this.getPage();
|
|
347
|
+
page.on('console', (msg) => {
|
|
348
|
+
this.consoleMessages.push({
|
|
349
|
+
type: msg.type(),
|
|
350
|
+
text: msg.text(),
|
|
351
|
+
timestamp: Date.now(),
|
|
352
|
+
});
|
|
353
|
+
});
|
|
354
|
+
}
|
|
355
|
+
/**
|
|
356
|
+
* Get console messages
|
|
357
|
+
*/
|
|
358
|
+
getConsoleMessages() {
|
|
359
|
+
return this.consoleMessages;
|
|
360
|
+
}
|
|
361
|
+
/**
|
|
362
|
+
* Clear console messages
|
|
363
|
+
*/
|
|
364
|
+
clearConsoleMessages() {
|
|
365
|
+
this.consoleMessages = [];
|
|
366
|
+
}
|
|
367
|
+
/**
|
|
368
|
+
* Start error tracking
|
|
369
|
+
*/
|
|
370
|
+
startErrorTracking() {
|
|
371
|
+
const page = this.getPage();
|
|
372
|
+
page.on('pageerror', (error) => {
|
|
373
|
+
this.pageErrors.push({
|
|
374
|
+
message: error.message,
|
|
375
|
+
timestamp: Date.now(),
|
|
376
|
+
});
|
|
377
|
+
});
|
|
378
|
+
}
|
|
379
|
+
/**
|
|
380
|
+
* Get page errors
|
|
381
|
+
*/
|
|
382
|
+
getPageErrors() {
|
|
383
|
+
return this.pageErrors;
|
|
384
|
+
}
|
|
385
|
+
/**
|
|
386
|
+
* Clear page errors
|
|
387
|
+
*/
|
|
388
|
+
clearPageErrors() {
|
|
389
|
+
this.pageErrors = [];
|
|
390
|
+
}
|
|
391
|
+
/**
|
|
392
|
+
* Start HAR recording
|
|
393
|
+
*/
|
|
394
|
+
async startHarRecording() {
|
|
395
|
+
// HAR is started at context level, flag for tracking
|
|
396
|
+
this.isRecordingHar = true;
|
|
397
|
+
}
|
|
398
|
+
/**
|
|
399
|
+
* Check if HAR recording
|
|
400
|
+
*/
|
|
401
|
+
isHarRecording() {
|
|
402
|
+
return this.isRecordingHar;
|
|
403
|
+
}
|
|
404
|
+
/**
|
|
405
|
+
* Set offline mode
|
|
406
|
+
*/
|
|
407
|
+
async setOffline(offline) {
|
|
408
|
+
const context = this.contexts[0];
|
|
409
|
+
if (context) {
|
|
410
|
+
await context.setOffline(offline);
|
|
411
|
+
}
|
|
412
|
+
}
|
|
413
|
+
/**
|
|
414
|
+
* Set extra HTTP headers (global - all requests)
|
|
415
|
+
*/
|
|
416
|
+
async setExtraHeaders(headers) {
|
|
417
|
+
const context = this.contexts[0];
|
|
418
|
+
if (context) {
|
|
419
|
+
await context.setExtraHTTPHeaders(headers);
|
|
420
|
+
}
|
|
421
|
+
}
|
|
422
|
+
/**
|
|
423
|
+
* Set scoped HTTP headers (only for requests matching the origin)
|
|
424
|
+
* Uses route interception to add headers only to matching requests
|
|
425
|
+
*/
|
|
426
|
+
async setScopedHeaders(origin, headers) {
|
|
427
|
+
const page = this.getPage();
|
|
428
|
+
// Build URL pattern from origin (e.g., "api.example.com" -> "**://api.example.com/**")
|
|
429
|
+
// Handle both full URLs and just hostnames
|
|
430
|
+
let urlPattern;
|
|
431
|
+
try {
|
|
432
|
+
const url = new URL(origin.startsWith('http') ? origin : `https://${origin}`);
|
|
433
|
+
// Match any protocol, the host, and any path
|
|
434
|
+
urlPattern = `**://${url.host}/**`;
|
|
435
|
+
}
|
|
436
|
+
catch {
|
|
437
|
+
// If parsing fails, treat as hostname pattern
|
|
438
|
+
urlPattern = `**://${origin}/**`;
|
|
439
|
+
}
|
|
440
|
+
// Remove existing route for this origin if any
|
|
441
|
+
const existingHandler = this.scopedHeaderRoutes.get(urlPattern);
|
|
442
|
+
if (existingHandler) {
|
|
443
|
+
await page.unroute(urlPattern, existingHandler);
|
|
444
|
+
}
|
|
445
|
+
// Create handler that adds headers to matching requests
|
|
446
|
+
const handler = async (route) => {
|
|
447
|
+
const requestHeaders = route.request().headers();
|
|
448
|
+
await route.continue({
|
|
449
|
+
headers: {
|
|
450
|
+
...requestHeaders,
|
|
451
|
+
...headers,
|
|
452
|
+
},
|
|
453
|
+
});
|
|
454
|
+
};
|
|
455
|
+
// Store and register the route
|
|
456
|
+
this.scopedHeaderRoutes.set(urlPattern, handler);
|
|
457
|
+
await page.route(urlPattern, handler);
|
|
458
|
+
}
|
|
459
|
+
/**
|
|
460
|
+
* Clear scoped headers for an origin (or all if no origin specified)
|
|
461
|
+
*/
|
|
462
|
+
async clearScopedHeaders(origin) {
|
|
463
|
+
const page = this.getPage();
|
|
464
|
+
if (origin) {
|
|
465
|
+
let urlPattern;
|
|
466
|
+
try {
|
|
467
|
+
const url = new URL(origin.startsWith('http') ? origin : `https://${origin}`);
|
|
468
|
+
urlPattern = `**://${url.host}/**`;
|
|
469
|
+
}
|
|
470
|
+
catch {
|
|
471
|
+
urlPattern = `**://${origin}/**`;
|
|
472
|
+
}
|
|
473
|
+
const handler = this.scopedHeaderRoutes.get(urlPattern);
|
|
474
|
+
if (handler) {
|
|
475
|
+
await page.unroute(urlPattern, handler);
|
|
476
|
+
this.scopedHeaderRoutes.delete(urlPattern);
|
|
477
|
+
}
|
|
478
|
+
}
|
|
479
|
+
else {
|
|
480
|
+
// Clear all scoped header routes
|
|
481
|
+
for (const [pattern, handler] of this.scopedHeaderRoutes) {
|
|
482
|
+
await page.unroute(pattern, handler);
|
|
483
|
+
}
|
|
484
|
+
this.scopedHeaderRoutes.clear();
|
|
485
|
+
}
|
|
486
|
+
}
|
|
487
|
+
/**
|
|
488
|
+
* Start tracing
|
|
489
|
+
*/
|
|
490
|
+
async startTracing(options) {
|
|
491
|
+
const context = this.contexts[0];
|
|
492
|
+
if (context) {
|
|
493
|
+
await context.tracing.start({
|
|
494
|
+
screenshots: options.screenshots ?? true,
|
|
495
|
+
snapshots: options.snapshots ?? true,
|
|
496
|
+
});
|
|
497
|
+
}
|
|
498
|
+
}
|
|
499
|
+
/**
|
|
500
|
+
* Stop tracing and save
|
|
501
|
+
*/
|
|
502
|
+
async stopTracing(path) {
|
|
503
|
+
const context = this.contexts[0];
|
|
504
|
+
if (context) {
|
|
505
|
+
await context.tracing.stop({ path });
|
|
506
|
+
}
|
|
507
|
+
}
|
|
508
|
+
/**
|
|
509
|
+
* Save storage state (cookies, localStorage, etc.)
|
|
510
|
+
*/
|
|
511
|
+
async saveStorageState(path) {
|
|
512
|
+
const context = this.contexts[0];
|
|
513
|
+
if (context) {
|
|
514
|
+
await context.storageState({ path });
|
|
515
|
+
}
|
|
516
|
+
}
|
|
517
|
+
/**
|
|
518
|
+
* Get all pages
|
|
519
|
+
*/
|
|
520
|
+
getPages() {
|
|
521
|
+
return this.pages;
|
|
522
|
+
}
|
|
523
|
+
/**
|
|
524
|
+
* Get current page index
|
|
525
|
+
*/
|
|
526
|
+
getActiveIndex() {
|
|
527
|
+
return this.activePageIndex;
|
|
528
|
+
}
|
|
529
|
+
/**
|
|
530
|
+
* Get the current browser instance
|
|
531
|
+
*/
|
|
532
|
+
getBrowser() {
|
|
533
|
+
return this.browser;
|
|
534
|
+
}
|
|
535
|
+
/**
|
|
536
|
+
* Check if an existing CDP connection is still alive
|
|
537
|
+
* by verifying we can access browser contexts and that at least one has pages
|
|
538
|
+
*/
|
|
539
|
+
isCdpConnectionAlive() {
|
|
540
|
+
if (!this.browser)
|
|
541
|
+
return false;
|
|
542
|
+
try {
|
|
543
|
+
const contexts = this.browser.contexts();
|
|
544
|
+
if (contexts.length === 0)
|
|
545
|
+
return false;
|
|
546
|
+
return contexts.some((context) => context.pages().length > 0);
|
|
547
|
+
}
|
|
548
|
+
catch {
|
|
549
|
+
return false;
|
|
550
|
+
}
|
|
551
|
+
}
|
|
552
|
+
/**
|
|
553
|
+
* Check if CDP connection needs to be re-established
|
|
554
|
+
*/
|
|
555
|
+
needsCdpReconnect(cdpEndpoint) {
|
|
556
|
+
if (!this.browser?.isConnected())
|
|
557
|
+
return true;
|
|
558
|
+
if (this.cdpEndpoint !== cdpEndpoint)
|
|
559
|
+
return true;
|
|
560
|
+
if (!this.isCdpConnectionAlive())
|
|
561
|
+
return true;
|
|
562
|
+
return false;
|
|
563
|
+
}
|
|
564
|
+
/**
|
|
565
|
+
* Close a Browserbase session via API
|
|
566
|
+
*/
|
|
567
|
+
async closeBrowserbaseSession(sessionId, apiKey) {
|
|
568
|
+
await fetch(`https://api.browserbase.com/v1/sessions/${sessionId}`, {
|
|
569
|
+
method: 'DELETE',
|
|
570
|
+
headers: {
|
|
571
|
+
'X-BB-API-Key': apiKey,
|
|
572
|
+
},
|
|
573
|
+
});
|
|
574
|
+
}
|
|
575
|
+
/**
|
|
576
|
+
* Close a Browser Use session via API
|
|
577
|
+
*/
|
|
578
|
+
async closeBrowserUseSession(sessionId, apiKey) {
|
|
579
|
+
const response = await fetch(`https://api.browser-use.com/api/v2/browsers/${sessionId}`, {
|
|
580
|
+
method: 'PATCH',
|
|
581
|
+
headers: {
|
|
582
|
+
'Content-Type': 'application/json',
|
|
583
|
+
'X-Browser-Use-API-Key': apiKey,
|
|
584
|
+
},
|
|
585
|
+
body: JSON.stringify({ action: 'stop' }),
|
|
586
|
+
});
|
|
587
|
+
if (!response.ok) {
|
|
588
|
+
throw new Error(`Failed to close Browser Use session: ${response.statusText}`);
|
|
589
|
+
}
|
|
590
|
+
}
|
|
591
|
+
/**
|
|
592
|
+
* Close a Kernel session via API
|
|
593
|
+
*/
|
|
594
|
+
async closeKernelSession(sessionId, apiKey) {
|
|
595
|
+
const response = await fetch(`https://api.onkernel.com/browsers/${sessionId}`, {
|
|
596
|
+
method: 'DELETE',
|
|
597
|
+
headers: {
|
|
598
|
+
Authorization: `Bearer ${apiKey}`,
|
|
599
|
+
},
|
|
600
|
+
});
|
|
601
|
+
if (!response.ok) {
|
|
602
|
+
throw new Error(`Failed to close Kernel session: ${response.statusText}`);
|
|
603
|
+
}
|
|
604
|
+
}
|
|
605
|
+
/**
|
|
606
|
+
* Connect to Browserbase remote browser via CDP.
|
|
607
|
+
* Requires BROWSERBASE_API_KEY and BROWSERBASE_PROJECT_ID environment variables.
|
|
608
|
+
*/
|
|
609
|
+
async connectToBrowserbase() {
|
|
610
|
+
const browserbaseApiKey = process.env.BROWSERBASE_API_KEY;
|
|
611
|
+
const browserbaseProjectId = process.env.BROWSERBASE_PROJECT_ID;
|
|
612
|
+
if (!browserbaseApiKey || !browserbaseProjectId) {
|
|
613
|
+
throw new Error('BROWSERBASE_API_KEY and BROWSERBASE_PROJECT_ID are required when using browserbase as a provider');
|
|
614
|
+
}
|
|
615
|
+
const response = await fetch('https://api.browserbase.com/v1/sessions', {
|
|
616
|
+
method: 'POST',
|
|
617
|
+
headers: {
|
|
618
|
+
'Content-Type': 'application/json',
|
|
619
|
+
'X-BB-API-Key': browserbaseApiKey,
|
|
620
|
+
},
|
|
621
|
+
body: JSON.stringify({
|
|
622
|
+
projectId: browserbaseProjectId,
|
|
623
|
+
}),
|
|
624
|
+
});
|
|
625
|
+
if (!response.ok) {
|
|
626
|
+
throw new Error(`Failed to create Browserbase session: ${response.statusText}`);
|
|
627
|
+
}
|
|
628
|
+
const session = (await response.json());
|
|
629
|
+
const browser = await chromium.connectOverCDP(session.connectUrl).catch(() => {
|
|
630
|
+
throw new Error('Failed to connect to Browserbase session via CDP');
|
|
631
|
+
});
|
|
632
|
+
try {
|
|
633
|
+
const contexts = browser.contexts();
|
|
634
|
+
if (contexts.length === 0) {
|
|
635
|
+
throw new Error('No browser context found in Browserbase session');
|
|
636
|
+
}
|
|
637
|
+
const context = contexts[0];
|
|
638
|
+
const pages = context.pages();
|
|
639
|
+
const page = pages[0] ?? (await context.newPage());
|
|
640
|
+
this.browserbaseSessionId = session.id;
|
|
641
|
+
this.browserbaseApiKey = browserbaseApiKey;
|
|
642
|
+
this.browser = browser;
|
|
643
|
+
context.setDefaultTimeout(10000);
|
|
644
|
+
this.contexts.push(context);
|
|
645
|
+
this.setupContextTracking(context);
|
|
646
|
+
this.pages.push(page);
|
|
647
|
+
this.activePageIndex = 0;
|
|
648
|
+
this.setupPageTracking(page);
|
|
649
|
+
}
|
|
650
|
+
catch (error) {
|
|
651
|
+
await this.closeBrowserbaseSession(session.id, browserbaseApiKey).catch((sessionError) => {
|
|
652
|
+
console.error('Failed to close Browserbase session during cleanup:', sessionError);
|
|
653
|
+
});
|
|
654
|
+
throw error;
|
|
655
|
+
}
|
|
656
|
+
}
|
|
657
|
+
/**
|
|
658
|
+
* Find or create a Kernel profile by name.
|
|
659
|
+
* Returns the profile object if successful.
|
|
660
|
+
*/
|
|
661
|
+
async findOrCreateKernelProfile(profileName, apiKey) {
|
|
662
|
+
// First, try to get the existing profile
|
|
663
|
+
const getResponse = await fetch(`https://api.onkernel.com/profiles/${encodeURIComponent(profileName)}`, {
|
|
664
|
+
method: 'GET',
|
|
665
|
+
headers: {
|
|
666
|
+
Authorization: `Bearer ${apiKey}`,
|
|
667
|
+
},
|
|
668
|
+
});
|
|
669
|
+
if (getResponse.ok) {
|
|
670
|
+
// Profile exists, return it
|
|
671
|
+
return { name: profileName };
|
|
672
|
+
}
|
|
673
|
+
if (getResponse.status !== 404) {
|
|
674
|
+
throw new Error(`Failed to check Kernel profile: ${getResponse.statusText}`);
|
|
675
|
+
}
|
|
676
|
+
// Profile doesn't exist, create it
|
|
677
|
+
const createResponse = await fetch('https://api.onkernel.com/profiles', {
|
|
678
|
+
method: 'POST',
|
|
679
|
+
headers: {
|
|
680
|
+
'Content-Type': 'application/json',
|
|
681
|
+
Authorization: `Bearer ${apiKey}`,
|
|
682
|
+
},
|
|
683
|
+
body: JSON.stringify({ name: profileName }),
|
|
684
|
+
});
|
|
685
|
+
if (!createResponse.ok) {
|
|
686
|
+
throw new Error(`Failed to create Kernel profile: ${createResponse.statusText}`);
|
|
687
|
+
}
|
|
688
|
+
return { name: profileName };
|
|
689
|
+
}
|
|
690
|
+
/**
|
|
691
|
+
* Connect to Kernel remote browser via CDP.
|
|
692
|
+
* Requires KERNEL_API_KEY environment variable.
|
|
693
|
+
*/
|
|
694
|
+
async connectToKernel() {
|
|
695
|
+
const kernelApiKey = process.env.KERNEL_API_KEY;
|
|
696
|
+
if (!kernelApiKey) {
|
|
697
|
+
throw new Error('KERNEL_API_KEY is required when using kernel as a provider');
|
|
698
|
+
}
|
|
699
|
+
// Find or create profile if KERNEL_PROFILE_NAME is set
|
|
700
|
+
const profileName = process.env.KERNEL_PROFILE_NAME;
|
|
701
|
+
let profileConfig;
|
|
702
|
+
if (profileName) {
|
|
703
|
+
await this.findOrCreateKernelProfile(profileName, kernelApiKey);
|
|
704
|
+
profileConfig = {
|
|
705
|
+
profile: {
|
|
706
|
+
name: profileName,
|
|
707
|
+
save_changes: true, // Save cookies/state back to the profile when session ends
|
|
708
|
+
},
|
|
709
|
+
};
|
|
710
|
+
}
|
|
711
|
+
const response = await fetch('https://api.onkernel.com/browsers', {
|
|
712
|
+
method: 'POST',
|
|
713
|
+
headers: {
|
|
714
|
+
'Content-Type': 'application/json',
|
|
715
|
+
Authorization: `Bearer ${kernelApiKey}`,
|
|
716
|
+
},
|
|
717
|
+
body: JSON.stringify({
|
|
718
|
+
// Kernel browsers are headful by default with stealth mode available
|
|
719
|
+
// The user can configure these via environment variables if needed
|
|
720
|
+
headless: process.env.KERNEL_HEADLESS?.toLowerCase() === 'true',
|
|
721
|
+
stealth: process.env.KERNEL_STEALTH?.toLowerCase() !== 'false', // Default to stealth mode
|
|
722
|
+
timeout_seconds: parseInt(process.env.KERNEL_TIMEOUT_SECONDS || '300', 10),
|
|
723
|
+
// Load and save to a profile if specified
|
|
724
|
+
...profileConfig,
|
|
725
|
+
}),
|
|
726
|
+
});
|
|
727
|
+
if (!response.ok) {
|
|
728
|
+
throw new Error(`Failed to create Kernel session: ${response.statusText}`);
|
|
729
|
+
}
|
|
730
|
+
let session;
|
|
731
|
+
try {
|
|
732
|
+
session = (await response.json());
|
|
733
|
+
}
|
|
734
|
+
catch (error) {
|
|
735
|
+
throw new Error(`Failed to parse Kernel session response: ${error instanceof Error ? error.message : String(error)}`);
|
|
736
|
+
}
|
|
737
|
+
if (!session.session_id || !session.cdp_ws_url) {
|
|
738
|
+
throw new Error(`Invalid Kernel session response: missing ${!session.session_id ? 'session_id' : 'cdp_ws_url'}`);
|
|
739
|
+
}
|
|
740
|
+
const browser = await chromium.connectOverCDP(session.cdp_ws_url).catch(() => {
|
|
741
|
+
throw new Error('Failed to connect to Kernel session via CDP');
|
|
742
|
+
});
|
|
743
|
+
try {
|
|
744
|
+
const contexts = browser.contexts();
|
|
745
|
+
let context;
|
|
746
|
+
let page;
|
|
747
|
+
// Kernel browsers launch with a default context and page
|
|
748
|
+
if (contexts.length === 0) {
|
|
749
|
+
context = await browser.newContext();
|
|
750
|
+
page = await context.newPage();
|
|
751
|
+
}
|
|
752
|
+
else {
|
|
753
|
+
context = contexts[0];
|
|
754
|
+
const pages = context.pages();
|
|
755
|
+
page = pages[0] ?? (await context.newPage());
|
|
756
|
+
}
|
|
757
|
+
this.kernelSessionId = session.session_id;
|
|
758
|
+
this.kernelApiKey = kernelApiKey;
|
|
759
|
+
this.browser = browser;
|
|
760
|
+
context.setDefaultTimeout(60000);
|
|
761
|
+
this.contexts.push(context);
|
|
762
|
+
this.pages.push(page);
|
|
763
|
+
this.activePageIndex = 0;
|
|
764
|
+
this.setupPageTracking(page);
|
|
765
|
+
this.setupContextTracking(context);
|
|
766
|
+
}
|
|
767
|
+
catch (error) {
|
|
768
|
+
await this.closeKernelSession(session.session_id, kernelApiKey).catch((sessionError) => {
|
|
769
|
+
console.error('Failed to close Kernel session during cleanup:', sessionError);
|
|
770
|
+
});
|
|
771
|
+
throw error;
|
|
772
|
+
}
|
|
773
|
+
}
|
|
774
|
+
/**
|
|
775
|
+
* Connect to Browser Use remote browser via CDP.
|
|
776
|
+
* Requires BROWSER_USE_API_KEY environment variable.
|
|
777
|
+
*/
|
|
778
|
+
async connectToBrowserUse() {
|
|
779
|
+
const browserUseApiKey = process.env.BROWSER_USE_API_KEY;
|
|
780
|
+
if (!browserUseApiKey) {
|
|
781
|
+
throw new Error('BROWSER_USE_API_KEY is required when using browseruse as a provider');
|
|
782
|
+
}
|
|
783
|
+
const response = await fetch('https://api.browser-use.com/api/v2/browsers', {
|
|
784
|
+
method: 'POST',
|
|
785
|
+
headers: {
|
|
786
|
+
'Content-Type': 'application/json',
|
|
787
|
+
'X-Browser-Use-API-Key': browserUseApiKey,
|
|
788
|
+
},
|
|
789
|
+
body: JSON.stringify({}),
|
|
790
|
+
});
|
|
791
|
+
if (!response.ok) {
|
|
792
|
+
throw new Error(`Failed to create Browser Use session: ${response.statusText}`);
|
|
793
|
+
}
|
|
794
|
+
let session;
|
|
795
|
+
try {
|
|
796
|
+
session = (await response.json());
|
|
797
|
+
}
|
|
798
|
+
catch (error) {
|
|
799
|
+
throw new Error(`Failed to parse Browser Use session response: ${error instanceof Error ? error.message : String(error)}`);
|
|
800
|
+
}
|
|
801
|
+
if (!session.id || !session.cdpUrl) {
|
|
802
|
+
throw new Error(`Invalid Browser Use session response: missing ${!session.id ? 'id' : 'cdpUrl'}`);
|
|
803
|
+
}
|
|
804
|
+
const browser = await chromium.connectOverCDP(session.cdpUrl).catch(() => {
|
|
805
|
+
throw new Error('Failed to connect to Browser Use session via CDP');
|
|
806
|
+
});
|
|
807
|
+
try {
|
|
808
|
+
const contexts = browser.contexts();
|
|
809
|
+
let context;
|
|
810
|
+
let page;
|
|
811
|
+
if (contexts.length === 0) {
|
|
812
|
+
context = await browser.newContext();
|
|
813
|
+
page = await context.newPage();
|
|
814
|
+
}
|
|
815
|
+
else {
|
|
816
|
+
context = contexts[0];
|
|
817
|
+
const pages = context.pages();
|
|
818
|
+
page = pages[0] ?? (await context.newPage());
|
|
819
|
+
}
|
|
820
|
+
this.browserUseSessionId = session.id;
|
|
821
|
+
this.browserUseApiKey = browserUseApiKey;
|
|
822
|
+
this.browser = browser;
|
|
823
|
+
context.setDefaultTimeout(60000);
|
|
824
|
+
this.contexts.push(context);
|
|
825
|
+
this.pages.push(page);
|
|
826
|
+
this.activePageIndex = 0;
|
|
827
|
+
this.setupPageTracking(page);
|
|
828
|
+
this.setupContextTracking(context);
|
|
829
|
+
}
|
|
830
|
+
catch (error) {
|
|
831
|
+
await this.closeBrowserUseSession(session.id, browserUseApiKey).catch((sessionError) => {
|
|
832
|
+
console.error('Failed to close Browser Use session during cleanup:', sessionError);
|
|
833
|
+
});
|
|
834
|
+
throw error;
|
|
835
|
+
}
|
|
836
|
+
}
|
|
837
|
+
/**
|
|
838
|
+
* Launch the browser with the specified options
|
|
839
|
+
* If already launched, this is a no-op (browser stays open)
|
|
840
|
+
*/
|
|
841
|
+
async launch(options) {
|
|
842
|
+
// Determine CDP endpoint: prefer cdpUrl over cdpPort for flexibility
|
|
843
|
+
const cdpEndpoint = options.cdpUrl ?? (options.cdpPort ? String(options.cdpPort) : undefined);
|
|
844
|
+
const hasExtensions = !!options.extensions?.length;
|
|
845
|
+
const hasProfile = !!options.profile;
|
|
846
|
+
const hasStorageState = !!options.storageState;
|
|
847
|
+
if (hasExtensions && cdpEndpoint) {
|
|
848
|
+
throw new Error('Extensions cannot be used with CDP connection');
|
|
849
|
+
}
|
|
850
|
+
if (hasProfile && cdpEndpoint) {
|
|
851
|
+
throw new Error('Profile cannot be used with CDP connection');
|
|
852
|
+
}
|
|
853
|
+
if (hasStorageState && hasProfile) {
|
|
854
|
+
throw new Error('Storage state cannot be used with profile (profile is already persistent storage)');
|
|
855
|
+
}
|
|
856
|
+
if (hasStorageState && hasExtensions) {
|
|
857
|
+
throw new Error('Storage state cannot be used with extensions (extensions require persistent context)');
|
|
858
|
+
}
|
|
859
|
+
if (this.isLaunched()) {
|
|
860
|
+
const needsRelaunch = (!cdpEndpoint && this.cdpEndpoint !== null) ||
|
|
861
|
+
(!!cdpEndpoint && this.needsCdpReconnect(cdpEndpoint));
|
|
862
|
+
if (needsRelaunch) {
|
|
863
|
+
await this.close();
|
|
864
|
+
}
|
|
865
|
+
else {
|
|
866
|
+
return;
|
|
867
|
+
}
|
|
868
|
+
}
|
|
869
|
+
if (cdpEndpoint) {
|
|
870
|
+
await this.connectViaCDP(cdpEndpoint);
|
|
871
|
+
return;
|
|
872
|
+
}
|
|
873
|
+
// Cloud browser providers require explicit opt-in via -p flag or AGENT_BROWSER_PROVIDER env var
|
|
874
|
+
// -p flag takes precedence over env var
|
|
875
|
+
const provider = options.provider ?? process.env.AGENT_BROWSER_PROVIDER;
|
|
876
|
+
if (provider === 'browserbase') {
|
|
877
|
+
await this.connectToBrowserbase();
|
|
878
|
+
return;
|
|
879
|
+
}
|
|
880
|
+
if (provider === 'browseruse') {
|
|
881
|
+
await this.connectToBrowserUse();
|
|
882
|
+
return;
|
|
883
|
+
}
|
|
884
|
+
// Kernel: requires explicit opt-in via -p kernel flag or AGENT_BROWSER_PROVIDER=kernel
|
|
885
|
+
if (provider === 'kernel') {
|
|
886
|
+
await this.connectToKernel();
|
|
887
|
+
return;
|
|
888
|
+
}
|
|
889
|
+
const browserType = options.browser ?? 'chromium';
|
|
890
|
+
if (hasExtensions && browserType !== 'chromium') {
|
|
891
|
+
throw new Error('Extensions are only supported in Chromium');
|
|
892
|
+
}
|
|
893
|
+
// allowFileAccess is only supported in Chromium
|
|
894
|
+
if (options.allowFileAccess && browserType !== 'chromium') {
|
|
895
|
+
throw new Error('allowFileAccess is only supported in Chromium');
|
|
896
|
+
}
|
|
897
|
+
const launcher = browserType === 'firefox' ? firefox : browserType === 'webkit' ? webkit : chromium;
|
|
898
|
+
const viewport = options.viewport ?? { width: 1280, height: 720 };
|
|
899
|
+
// Build base args array with file access flags if enabled
|
|
900
|
+
// --allow-file-access-from-files: allows file:// URLs to read other file:// URLs via XHR/fetch
|
|
901
|
+
// --allow-file-access: allows the browser to access local files in general
|
|
902
|
+
const fileAccessArgs = options.allowFileAccess
|
|
903
|
+
? ['--allow-file-access-from-files', '--allow-file-access']
|
|
904
|
+
: [];
|
|
905
|
+
const baseArgs = options.args
|
|
906
|
+
? [...fileAccessArgs, ...options.args]
|
|
907
|
+
: fileAccessArgs.length > 0
|
|
908
|
+
? fileAccessArgs
|
|
909
|
+
: undefined;
|
|
910
|
+
let context;
|
|
911
|
+
if (hasExtensions) {
|
|
912
|
+
// Extensions require persistent context in a temp directory
|
|
913
|
+
const extPaths = options.extensions.join(',');
|
|
914
|
+
const session = process.env.AGENT_BROWSER_SESSION || 'default';
|
|
915
|
+
// Combine extension args with custom args and file access args
|
|
916
|
+
const extArgs = [`--disable-extensions-except=${extPaths}`, `--load-extension=${extPaths}`];
|
|
917
|
+
const allArgs = baseArgs ? [...extArgs, ...baseArgs] : extArgs;
|
|
918
|
+
context = await launcher.launchPersistentContext(path.join(os.tmpdir(), `agent-browser-ext-${session}`), {
|
|
919
|
+
headless: false,
|
|
920
|
+
executablePath: options.executablePath,
|
|
921
|
+
args: allArgs,
|
|
922
|
+
viewport,
|
|
923
|
+
extraHTTPHeaders: options.headers,
|
|
924
|
+
userAgent: options.userAgent,
|
|
925
|
+
...(options.proxy && { proxy: options.proxy }),
|
|
926
|
+
ignoreHTTPSErrors: options.ignoreHTTPSErrors ?? false,
|
|
927
|
+
});
|
|
928
|
+
this.isPersistentContext = true;
|
|
929
|
+
}
|
|
930
|
+
else if (hasProfile) {
|
|
931
|
+
// Profile uses persistent context for durable cookies/storage
|
|
932
|
+
// Expand ~ to home directory since it won't be shell-expanded
|
|
933
|
+
const profilePath = options.profile.replace(/^~\//, os.homedir() + '/');
|
|
934
|
+
context = await launcher.launchPersistentContext(profilePath, {
|
|
935
|
+
headless: options.headless ?? true,
|
|
936
|
+
executablePath: options.executablePath,
|
|
937
|
+
args: baseArgs,
|
|
938
|
+
viewport,
|
|
939
|
+
extraHTTPHeaders: options.headers,
|
|
940
|
+
userAgent: options.userAgent,
|
|
941
|
+
...(options.proxy && { proxy: options.proxy }),
|
|
942
|
+
ignoreHTTPSErrors: options.ignoreHTTPSErrors ?? false,
|
|
943
|
+
});
|
|
944
|
+
this.isPersistentContext = true;
|
|
945
|
+
}
|
|
946
|
+
else {
|
|
947
|
+
// Regular ephemeral browser
|
|
948
|
+
this.browser = await launcher.launch({
|
|
949
|
+
headless: options.headless ?? true,
|
|
950
|
+
executablePath: options.executablePath,
|
|
951
|
+
args: baseArgs,
|
|
952
|
+
});
|
|
953
|
+
this.cdpEndpoint = null;
|
|
954
|
+
context = await this.browser.newContext({
|
|
955
|
+
viewport,
|
|
956
|
+
extraHTTPHeaders: options.headers,
|
|
957
|
+
userAgent: options.userAgent,
|
|
958
|
+
...(options.proxy && { proxy: options.proxy }),
|
|
959
|
+
ignoreHTTPSErrors: options.ignoreHTTPSErrors ?? false,
|
|
960
|
+
...(options.storageState && { storageState: options.storageState }),
|
|
961
|
+
});
|
|
962
|
+
}
|
|
963
|
+
context.setDefaultTimeout(60000);
|
|
964
|
+
this.contexts.push(context);
|
|
965
|
+
this.setupContextTracking(context);
|
|
966
|
+
const page = context.pages()[0] ?? (await context.newPage());
|
|
967
|
+
// Only add if not already tracked (setupContextTracking may have already added it via 'page' event)
|
|
968
|
+
if (!this.pages.includes(page)) {
|
|
969
|
+
this.pages.push(page);
|
|
970
|
+
this.setupPageTracking(page);
|
|
971
|
+
}
|
|
972
|
+
this.activePageIndex = this.pages.length > 0 ? this.pages.length - 1 : 0;
|
|
973
|
+
}
|
|
974
|
+
/**
|
|
975
|
+
* Connect to a running browser via CDP (Chrome DevTools Protocol)
|
|
976
|
+
* @param cdpEndpoint Either a port number (as string) or a full WebSocket URL (ws:// or wss://)
|
|
977
|
+
*/
|
|
978
|
+
async connectViaCDP(cdpEndpoint) {
|
|
979
|
+
if (!cdpEndpoint) {
|
|
980
|
+
throw new Error('CDP endpoint is required for CDP connection');
|
|
981
|
+
}
|
|
982
|
+
// Determine the connection URL:
|
|
983
|
+
// - If it starts with ws://, wss://, http://, or https://, use it directly
|
|
984
|
+
// - If it's a numeric string (e.g., "9222"), treat as port for localhost
|
|
985
|
+
// - Otherwise, treat it as a port number for localhost
|
|
986
|
+
let cdpUrl;
|
|
987
|
+
if (cdpEndpoint.startsWith('ws://') ||
|
|
988
|
+
cdpEndpoint.startsWith('wss://') ||
|
|
989
|
+
cdpEndpoint.startsWith('http://') ||
|
|
990
|
+
cdpEndpoint.startsWith('https://')) {
|
|
991
|
+
cdpUrl = cdpEndpoint;
|
|
992
|
+
}
|
|
993
|
+
else if (/^\d+$/.test(cdpEndpoint)) {
|
|
994
|
+
// Numeric string - treat as port number (handles JSON serialization quirks)
|
|
995
|
+
cdpUrl = `http://localhost:${cdpEndpoint}`;
|
|
996
|
+
}
|
|
997
|
+
else {
|
|
998
|
+
// Unknown format - still try as port for backward compatibility
|
|
999
|
+
cdpUrl = `http://localhost:${cdpEndpoint}`;
|
|
1000
|
+
}
|
|
1001
|
+
const browser = await chromium.connectOverCDP(cdpUrl).catch(() => {
|
|
1002
|
+
throw new Error(`Failed to connect via CDP to ${cdpUrl}. ` +
|
|
1003
|
+
(cdpUrl.includes('localhost')
|
|
1004
|
+
? `Make sure the app is running with --remote-debugging-port=${cdpEndpoint}`
|
|
1005
|
+
: 'Make sure the remote browser is accessible and the URL is correct.'));
|
|
1006
|
+
});
|
|
1007
|
+
// Validate and set up state, cleaning up browser connection if anything fails
|
|
1008
|
+
try {
|
|
1009
|
+
const contexts = browser.contexts();
|
|
1010
|
+
if (contexts.length === 0) {
|
|
1011
|
+
throw new Error('No browser context found. Make sure the app has an open window.');
|
|
1012
|
+
}
|
|
1013
|
+
// Filter out pages with empty URLs, which can cause Playwright to hang
|
|
1014
|
+
const allPages = contexts.flatMap((context) => context.pages()).filter((page) => page.url());
|
|
1015
|
+
if (allPages.length === 0) {
|
|
1016
|
+
throw new Error('No page found. Make sure the app has loaded content.');
|
|
1017
|
+
}
|
|
1018
|
+
// All validation passed - commit state
|
|
1019
|
+
this.browser = browser;
|
|
1020
|
+
this.cdpEndpoint = cdpEndpoint;
|
|
1021
|
+
for (const context of contexts) {
|
|
1022
|
+
context.setDefaultTimeout(10000);
|
|
1023
|
+
this.contexts.push(context);
|
|
1024
|
+
this.setupContextTracking(context);
|
|
1025
|
+
}
|
|
1026
|
+
for (const page of allPages) {
|
|
1027
|
+
this.pages.push(page);
|
|
1028
|
+
this.setupPageTracking(page);
|
|
1029
|
+
}
|
|
1030
|
+
this.activePageIndex = 0;
|
|
1031
|
+
}
|
|
1032
|
+
catch (error) {
|
|
1033
|
+
// Clean up browser connection if validation or setup failed
|
|
1034
|
+
await browser.close().catch(() => { });
|
|
1035
|
+
throw error;
|
|
1036
|
+
}
|
|
1037
|
+
}
|
|
1038
|
+
/**
|
|
1039
|
+
* Set up console, error, and close tracking for a page
|
|
1040
|
+
*/
|
|
1041
|
+
setupPageTracking(page) {
|
|
1042
|
+
page.on('console', (msg) => {
|
|
1043
|
+
this.consoleMessages.push({
|
|
1044
|
+
type: msg.type(),
|
|
1045
|
+
text: msg.text(),
|
|
1046
|
+
timestamp: Date.now(),
|
|
1047
|
+
});
|
|
1048
|
+
});
|
|
1049
|
+
page.on('pageerror', (error) => {
|
|
1050
|
+
this.pageErrors.push({
|
|
1051
|
+
message: error.message,
|
|
1052
|
+
timestamp: Date.now(),
|
|
1053
|
+
});
|
|
1054
|
+
});
|
|
1055
|
+
page.on('close', () => {
|
|
1056
|
+
const index = this.pages.indexOf(page);
|
|
1057
|
+
if (index !== -1) {
|
|
1058
|
+
this.pages.splice(index, 1);
|
|
1059
|
+
if (this.activePageIndex >= this.pages.length) {
|
|
1060
|
+
this.activePageIndex = Math.max(0, this.pages.length - 1);
|
|
1061
|
+
}
|
|
1062
|
+
}
|
|
1063
|
+
});
|
|
1064
|
+
}
|
|
1065
|
+
/**
|
|
1066
|
+
* Set up tracking for new pages in a context (for CDP connections and popups/new tabs)
|
|
1067
|
+
* This handles pages created externally (e.g., via target="_blank" links, window.open)
|
|
1068
|
+
*/
|
|
1069
|
+
setupContextTracking(context) {
|
|
1070
|
+
context.on('page', (page) => {
|
|
1071
|
+
// Only add if not already tracked (avoids duplicates when newTab() creates pages)
|
|
1072
|
+
if (!this.pages.includes(page)) {
|
|
1073
|
+
this.pages.push(page);
|
|
1074
|
+
this.setupPageTracking(page);
|
|
1075
|
+
}
|
|
1076
|
+
// Auto-switch to the newly opened tab so subsequent commands target it.
|
|
1077
|
+
// For tabs created via newTab()/newWindow(), this is redundant (they set activePageIndex after),
|
|
1078
|
+
// but for externally opened tabs (window.open, target="_blank"), this ensures the active tab
|
|
1079
|
+
// stays in sync with the browser.
|
|
1080
|
+
const newIndex = this.pages.indexOf(page);
|
|
1081
|
+
if (newIndex !== -1 && newIndex !== this.activePageIndex) {
|
|
1082
|
+
this.activePageIndex = newIndex;
|
|
1083
|
+
// Invalidate CDP session since the active page changed
|
|
1084
|
+
this.invalidateCDPSession().catch(() => { });
|
|
1085
|
+
}
|
|
1086
|
+
});
|
|
1087
|
+
}
|
|
1088
|
+
/**
|
|
1089
|
+
* Create a new tab in the current context
|
|
1090
|
+
*/
|
|
1091
|
+
async newTab() {
|
|
1092
|
+
if (!this.browser || this.contexts.length === 0) {
|
|
1093
|
+
throw new Error('Browser not launched');
|
|
1094
|
+
}
|
|
1095
|
+
// Invalidate CDP session since we're switching to a new page
|
|
1096
|
+
await this.invalidateCDPSession();
|
|
1097
|
+
const context = this.contexts[0]; // Use first context for tabs
|
|
1098
|
+
const page = await context.newPage();
|
|
1099
|
+
// Only add if not already tracked (setupContextTracking may have already added it via 'page' event)
|
|
1100
|
+
if (!this.pages.includes(page)) {
|
|
1101
|
+
this.pages.push(page);
|
|
1102
|
+
this.setupPageTracking(page);
|
|
1103
|
+
}
|
|
1104
|
+
this.activePageIndex = this.pages.length - 1;
|
|
1105
|
+
return { index: this.activePageIndex, total: this.pages.length };
|
|
1106
|
+
}
|
|
1107
|
+
/**
|
|
1108
|
+
* Create a new window (new context)
|
|
1109
|
+
*/
|
|
1110
|
+
async newWindow(viewport) {
|
|
1111
|
+
if (!this.browser) {
|
|
1112
|
+
throw new Error('Browser not launched');
|
|
1113
|
+
}
|
|
1114
|
+
const context = await this.browser.newContext({
|
|
1115
|
+
viewport: viewport ?? { width: 1280, height: 720 },
|
|
1116
|
+
});
|
|
1117
|
+
context.setDefaultTimeout(60000);
|
|
1118
|
+
this.contexts.push(context);
|
|
1119
|
+
this.setupContextTracking(context);
|
|
1120
|
+
const page = await context.newPage();
|
|
1121
|
+
// Only add if not already tracked (setupContextTracking may have already added it via 'page' event)
|
|
1122
|
+
if (!this.pages.includes(page)) {
|
|
1123
|
+
this.pages.push(page);
|
|
1124
|
+
this.setupPageTracking(page);
|
|
1125
|
+
}
|
|
1126
|
+
this.activePageIndex = this.pages.length - 1;
|
|
1127
|
+
return { index: this.activePageIndex, total: this.pages.length };
|
|
1128
|
+
}
|
|
1129
|
+
/**
|
|
1130
|
+
* Invalidate the current CDP session (must be called before switching pages)
|
|
1131
|
+
* This ensures screencast and input injection work correctly after tab switch
|
|
1132
|
+
*/
|
|
1133
|
+
async invalidateCDPSession() {
|
|
1134
|
+
// Stop screencast if active (it's tied to the current page's CDP session)
|
|
1135
|
+
if (this.screencastActive) {
|
|
1136
|
+
await this.stopScreencast();
|
|
1137
|
+
}
|
|
1138
|
+
// Detach and clear the CDP session
|
|
1139
|
+
if (this.cdpSession) {
|
|
1140
|
+
await this.cdpSession.detach().catch(() => { });
|
|
1141
|
+
this.cdpSession = null;
|
|
1142
|
+
}
|
|
1143
|
+
}
|
|
1144
|
+
/**
|
|
1145
|
+
* Switch to a specific tab/page by index
|
|
1146
|
+
*/
|
|
1147
|
+
async switchTo(index) {
|
|
1148
|
+
if (index < 0 || index >= this.pages.length) {
|
|
1149
|
+
throw new Error(`Invalid tab index: ${index}. Available: 0-${this.pages.length - 1}`);
|
|
1150
|
+
}
|
|
1151
|
+
// Invalidate CDP session before switching (it's page-specific)
|
|
1152
|
+
if (index !== this.activePageIndex) {
|
|
1153
|
+
await this.invalidateCDPSession();
|
|
1154
|
+
}
|
|
1155
|
+
this.activePageIndex = index;
|
|
1156
|
+
const page = this.pages[index];
|
|
1157
|
+
return {
|
|
1158
|
+
index: this.activePageIndex,
|
|
1159
|
+
url: page.url(),
|
|
1160
|
+
title: '', // Title requires async, will be fetched separately
|
|
1161
|
+
};
|
|
1162
|
+
}
|
|
1163
|
+
/**
|
|
1164
|
+
* Close a specific tab/page
|
|
1165
|
+
*/
|
|
1166
|
+
async closeTab(index) {
|
|
1167
|
+
const targetIndex = index ?? this.activePageIndex;
|
|
1168
|
+
if (targetIndex < 0 || targetIndex >= this.pages.length) {
|
|
1169
|
+
throw new Error(`Invalid tab index: ${targetIndex}`);
|
|
1170
|
+
}
|
|
1171
|
+
if (this.pages.length === 1) {
|
|
1172
|
+
throw new Error('Cannot close the last tab. Use "close" to close the browser.');
|
|
1173
|
+
}
|
|
1174
|
+
// If closing the active tab, invalidate CDP session first
|
|
1175
|
+
if (targetIndex === this.activePageIndex) {
|
|
1176
|
+
await this.invalidateCDPSession();
|
|
1177
|
+
}
|
|
1178
|
+
const page = this.pages[targetIndex];
|
|
1179
|
+
await page.close();
|
|
1180
|
+
this.pages.splice(targetIndex, 1);
|
|
1181
|
+
// Adjust active index if needed
|
|
1182
|
+
if (this.activePageIndex >= this.pages.length) {
|
|
1183
|
+
this.activePageIndex = this.pages.length - 1;
|
|
1184
|
+
}
|
|
1185
|
+
else if (this.activePageIndex > targetIndex) {
|
|
1186
|
+
this.activePageIndex--;
|
|
1187
|
+
}
|
|
1188
|
+
return { closed: targetIndex, remaining: this.pages.length };
|
|
1189
|
+
}
|
|
1190
|
+
/**
|
|
1191
|
+
* List all tabs with their info
|
|
1192
|
+
*/
|
|
1193
|
+
async listTabs() {
|
|
1194
|
+
const tabs = await Promise.all(this.pages.map(async (page, index) => ({
|
|
1195
|
+
index,
|
|
1196
|
+
url: page.url(),
|
|
1197
|
+
title: await page.title().catch(() => ''),
|
|
1198
|
+
active: index === this.activePageIndex,
|
|
1199
|
+
})));
|
|
1200
|
+
return tabs;
|
|
1201
|
+
}
|
|
1202
|
+
/**
|
|
1203
|
+
* Get or create a CDP session for the current page
|
|
1204
|
+
* Only works with Chromium-based browsers
|
|
1205
|
+
*/
|
|
1206
|
+
async getCDPSession() {
|
|
1207
|
+
if (this.cdpSession) {
|
|
1208
|
+
return this.cdpSession;
|
|
1209
|
+
}
|
|
1210
|
+
const page = this.getPage();
|
|
1211
|
+
const context = page.context();
|
|
1212
|
+
// Create a new CDP session attached to the page
|
|
1213
|
+
this.cdpSession = await context.newCDPSession(page);
|
|
1214
|
+
return this.cdpSession;
|
|
1215
|
+
}
|
|
1216
|
+
/**
|
|
1217
|
+
* Check if screencast is currently active
|
|
1218
|
+
*/
|
|
1219
|
+
isScreencasting() {
|
|
1220
|
+
return this.screencastActive;
|
|
1221
|
+
}
|
|
1222
|
+
/**
|
|
1223
|
+
* Start screencast - streams viewport frames via CDP
|
|
1224
|
+
* @param callback Function called for each frame
|
|
1225
|
+
* @param options Screencast options
|
|
1226
|
+
*/
|
|
1227
|
+
async startScreencast(callback, options) {
|
|
1228
|
+
if (this.screencastActive) {
|
|
1229
|
+
throw new Error('Screencast already active');
|
|
1230
|
+
}
|
|
1231
|
+
const cdp = await this.getCDPSession();
|
|
1232
|
+
this.frameCallback = callback;
|
|
1233
|
+
this.screencastActive = true;
|
|
1234
|
+
// Create and store the frame handler so we can remove it later
|
|
1235
|
+
this.screencastFrameHandler = async (params) => {
|
|
1236
|
+
const frame = {
|
|
1237
|
+
data: params.data,
|
|
1238
|
+
metadata: params.metadata,
|
|
1239
|
+
sessionId: params.sessionId,
|
|
1240
|
+
};
|
|
1241
|
+
// Acknowledge the frame to receive the next one
|
|
1242
|
+
await cdp.send('Page.screencastFrameAck', { sessionId: params.sessionId });
|
|
1243
|
+
// Call the callback with the frame
|
|
1244
|
+
if (this.frameCallback) {
|
|
1245
|
+
this.frameCallback(frame);
|
|
1246
|
+
}
|
|
1247
|
+
};
|
|
1248
|
+
// Listen for screencast frames
|
|
1249
|
+
cdp.on('Page.screencastFrame', this.screencastFrameHandler);
|
|
1250
|
+
// Start the screencast
|
|
1251
|
+
await cdp.send('Page.startScreencast', {
|
|
1252
|
+
format: options?.format ?? 'jpeg',
|
|
1253
|
+
quality: options?.quality ?? 80,
|
|
1254
|
+
maxWidth: options?.maxWidth ?? 1280,
|
|
1255
|
+
maxHeight: options?.maxHeight ?? 720,
|
|
1256
|
+
everyNthFrame: options?.everyNthFrame ?? 1,
|
|
1257
|
+
});
|
|
1258
|
+
}
|
|
1259
|
+
/**
|
|
1260
|
+
* Stop screencast
|
|
1261
|
+
*/
|
|
1262
|
+
async stopScreencast() {
|
|
1263
|
+
if (!this.screencastActive) {
|
|
1264
|
+
return;
|
|
1265
|
+
}
|
|
1266
|
+
try {
|
|
1267
|
+
const cdp = await this.getCDPSession();
|
|
1268
|
+
await cdp.send('Page.stopScreencast');
|
|
1269
|
+
// Remove the event listener to prevent accumulation
|
|
1270
|
+
if (this.screencastFrameHandler) {
|
|
1271
|
+
cdp.off('Page.screencastFrame', this.screencastFrameHandler);
|
|
1272
|
+
}
|
|
1273
|
+
}
|
|
1274
|
+
catch {
|
|
1275
|
+
// Ignore errors when stopping
|
|
1276
|
+
}
|
|
1277
|
+
this.screencastActive = false;
|
|
1278
|
+
this.frameCallback = null;
|
|
1279
|
+
this.screencastFrameHandler = null;
|
|
1280
|
+
}
|
|
1281
|
+
/**
|
|
1282
|
+
* Inject a mouse event via CDP
|
|
1283
|
+
*/
|
|
1284
|
+
async injectMouseEvent(params) {
|
|
1285
|
+
const cdp = await this.getCDPSession();
|
|
1286
|
+
const cdpButton = params.button === 'left'
|
|
1287
|
+
? 'left'
|
|
1288
|
+
: params.button === 'right'
|
|
1289
|
+
? 'right'
|
|
1290
|
+
: params.button === 'middle'
|
|
1291
|
+
? 'middle'
|
|
1292
|
+
: 'none';
|
|
1293
|
+
await cdp.send('Input.dispatchMouseEvent', {
|
|
1294
|
+
type: params.type,
|
|
1295
|
+
x: params.x,
|
|
1296
|
+
y: params.y,
|
|
1297
|
+
button: cdpButton,
|
|
1298
|
+
clickCount: params.clickCount ?? 1,
|
|
1299
|
+
deltaX: params.deltaX ?? 0,
|
|
1300
|
+
deltaY: params.deltaY ?? 0,
|
|
1301
|
+
modifiers: params.modifiers ?? 0,
|
|
1302
|
+
});
|
|
1303
|
+
}
|
|
1304
|
+
/**
|
|
1305
|
+
* Inject a keyboard event via CDP
|
|
1306
|
+
*/
|
|
1307
|
+
async injectKeyboardEvent(params) {
|
|
1308
|
+
const cdp = await this.getCDPSession();
|
|
1309
|
+
await cdp.send('Input.dispatchKeyEvent', {
|
|
1310
|
+
type: params.type,
|
|
1311
|
+
key: params.key,
|
|
1312
|
+
code: params.code,
|
|
1313
|
+
text: params.text,
|
|
1314
|
+
modifiers: params.modifiers ?? 0,
|
|
1315
|
+
});
|
|
1316
|
+
}
|
|
1317
|
+
/**
|
|
1318
|
+
* Inject touch event via CDP (for mobile emulation)
|
|
1319
|
+
*/
|
|
1320
|
+
async injectTouchEvent(params) {
|
|
1321
|
+
const cdp = await this.getCDPSession();
|
|
1322
|
+
await cdp.send('Input.dispatchTouchEvent', {
|
|
1323
|
+
type: params.type,
|
|
1324
|
+
touchPoints: params.touchPoints.map((tp, i) => ({
|
|
1325
|
+
x: tp.x,
|
|
1326
|
+
y: tp.y,
|
|
1327
|
+
id: tp.id ?? i,
|
|
1328
|
+
})),
|
|
1329
|
+
modifiers: params.modifiers ?? 0,
|
|
1330
|
+
});
|
|
1331
|
+
}
|
|
1332
|
+
/**
|
|
1333
|
+
* Check if video recording is currently active
|
|
1334
|
+
*/
|
|
1335
|
+
isRecording() {
|
|
1336
|
+
return this.recordingContext !== null;
|
|
1337
|
+
}
|
|
1338
|
+
/**
|
|
1339
|
+
* Start recording to a video file using Playwright's native video recording.
|
|
1340
|
+
* Creates a fresh browser context with video recording enabled.
|
|
1341
|
+
* Automatically captures current URL and transfers cookies/storage if no URL provided.
|
|
1342
|
+
*
|
|
1343
|
+
* @param outputPath - Path to the output video file (will be .webm)
|
|
1344
|
+
* @param url - Optional URL to navigate to (defaults to current page URL)
|
|
1345
|
+
*/
|
|
1346
|
+
async startRecording(outputPath, url) {
|
|
1347
|
+
if (this.recordingContext) {
|
|
1348
|
+
throw new Error("Recording already in progress. Run 'record stop' first, or use 'record restart' to stop and start a new recording.");
|
|
1349
|
+
}
|
|
1350
|
+
if (!this.browser) {
|
|
1351
|
+
throw new Error('Browser not launched. Call launch first.');
|
|
1352
|
+
}
|
|
1353
|
+
// Check if output file already exists
|
|
1354
|
+
if (existsSync(outputPath)) {
|
|
1355
|
+
throw new Error(`Output file already exists: ${outputPath}`);
|
|
1356
|
+
}
|
|
1357
|
+
// Validate output path is .webm (Playwright native format)
|
|
1358
|
+
if (!outputPath.endsWith('.webm')) {
|
|
1359
|
+
throw new Error('Playwright native recording only supports WebM format. Please use a .webm extension.');
|
|
1360
|
+
}
|
|
1361
|
+
// Auto-capture current URL if none provided
|
|
1362
|
+
const currentPage = this.pages.length > 0 ? this.pages[this.activePageIndex] : null;
|
|
1363
|
+
const currentContext = this.contexts.length > 0 ? this.contexts[0] : null;
|
|
1364
|
+
if (!url && currentPage) {
|
|
1365
|
+
const currentUrl = currentPage.url();
|
|
1366
|
+
if (currentUrl && currentUrl !== 'about:blank') {
|
|
1367
|
+
url = currentUrl;
|
|
1368
|
+
}
|
|
1369
|
+
}
|
|
1370
|
+
// Capture state from current context (cookies + storage)
|
|
1371
|
+
let storageState;
|
|
1372
|
+
if (currentContext) {
|
|
1373
|
+
try {
|
|
1374
|
+
storageState = await currentContext.storageState();
|
|
1375
|
+
}
|
|
1376
|
+
catch {
|
|
1377
|
+
// Ignore errors - context might be closed or invalid
|
|
1378
|
+
}
|
|
1379
|
+
}
|
|
1380
|
+
// Create a temp directory for video recording
|
|
1381
|
+
const session = process.env.AGENT_BROWSER_SESSION || 'default';
|
|
1382
|
+
this.recordingTempDir = path.join(os.tmpdir(), `agent-browser-recording-${session}-${Date.now()}`);
|
|
1383
|
+
mkdirSync(this.recordingTempDir, { recursive: true });
|
|
1384
|
+
this.recordingOutputPath = outputPath;
|
|
1385
|
+
// Create a new context with video recording enabled and restored state
|
|
1386
|
+
const viewport = { width: 1280, height: 720 };
|
|
1387
|
+
this.recordingContext = await this.browser.newContext({
|
|
1388
|
+
viewport,
|
|
1389
|
+
recordVideo: {
|
|
1390
|
+
dir: this.recordingTempDir,
|
|
1391
|
+
size: viewport,
|
|
1392
|
+
},
|
|
1393
|
+
storageState,
|
|
1394
|
+
});
|
|
1395
|
+
this.recordingContext.setDefaultTimeout(10000);
|
|
1396
|
+
// Create a page in the recording context
|
|
1397
|
+
this.recordingPage = await this.recordingContext.newPage();
|
|
1398
|
+
// Add the recording context and page to our managed lists
|
|
1399
|
+
this.contexts.push(this.recordingContext);
|
|
1400
|
+
this.pages.push(this.recordingPage);
|
|
1401
|
+
this.activePageIndex = this.pages.length - 1;
|
|
1402
|
+
// Set up page tracking
|
|
1403
|
+
this.setupPageTracking(this.recordingPage);
|
|
1404
|
+
// Invalidate CDP session since we switched pages
|
|
1405
|
+
await this.invalidateCDPSession();
|
|
1406
|
+
// Navigate to URL if provided or captured
|
|
1407
|
+
if (url) {
|
|
1408
|
+
await this.recordingPage.goto(url, { waitUntil: 'load' });
|
|
1409
|
+
}
|
|
1410
|
+
}
|
|
1411
|
+
/**
|
|
1412
|
+
* Stop recording and save the video file
|
|
1413
|
+
* @returns Recording result with path
|
|
1414
|
+
*/
|
|
1415
|
+
async stopRecording() {
|
|
1416
|
+
if (!this.recordingContext || !this.recordingPage) {
|
|
1417
|
+
return { path: '', frames: 0, error: 'No recording in progress' };
|
|
1418
|
+
}
|
|
1419
|
+
const outputPath = this.recordingOutputPath;
|
|
1420
|
+
try {
|
|
1421
|
+
// Get the video object before closing the page
|
|
1422
|
+
const video = this.recordingPage.video();
|
|
1423
|
+
// Remove recording page/context from our managed lists before closing
|
|
1424
|
+
const pageIndex = this.pages.indexOf(this.recordingPage);
|
|
1425
|
+
if (pageIndex !== -1) {
|
|
1426
|
+
this.pages.splice(pageIndex, 1);
|
|
1427
|
+
}
|
|
1428
|
+
const contextIndex = this.contexts.indexOf(this.recordingContext);
|
|
1429
|
+
if (contextIndex !== -1) {
|
|
1430
|
+
this.contexts.splice(contextIndex, 1);
|
|
1431
|
+
}
|
|
1432
|
+
// Close the page to finalize the video
|
|
1433
|
+
await this.recordingPage.close();
|
|
1434
|
+
// Save the video to the desired output path
|
|
1435
|
+
if (video) {
|
|
1436
|
+
await video.saveAs(outputPath);
|
|
1437
|
+
}
|
|
1438
|
+
// Clean up temp directory
|
|
1439
|
+
if (this.recordingTempDir) {
|
|
1440
|
+
rmSync(this.recordingTempDir, { recursive: true, force: true });
|
|
1441
|
+
}
|
|
1442
|
+
// Close the recording context
|
|
1443
|
+
await this.recordingContext.close();
|
|
1444
|
+
// Reset recording state
|
|
1445
|
+
this.recordingContext = null;
|
|
1446
|
+
this.recordingPage = null;
|
|
1447
|
+
this.recordingOutputPath = '';
|
|
1448
|
+
this.recordingTempDir = '';
|
|
1449
|
+
// Adjust active page index
|
|
1450
|
+
if (this.pages.length > 0) {
|
|
1451
|
+
this.activePageIndex = Math.min(this.activePageIndex, this.pages.length - 1);
|
|
1452
|
+
}
|
|
1453
|
+
else {
|
|
1454
|
+
this.activePageIndex = 0;
|
|
1455
|
+
}
|
|
1456
|
+
// Invalidate CDP session since we may have switched pages
|
|
1457
|
+
await this.invalidateCDPSession();
|
|
1458
|
+
return { path: outputPath, frames: 0 }; // Playwright doesn't expose frame count
|
|
1459
|
+
}
|
|
1460
|
+
catch (error) {
|
|
1461
|
+
// Clean up temp directory on error
|
|
1462
|
+
if (this.recordingTempDir) {
|
|
1463
|
+
rmSync(this.recordingTempDir, { recursive: true, force: true });
|
|
1464
|
+
}
|
|
1465
|
+
// Reset state on error
|
|
1466
|
+
this.recordingContext = null;
|
|
1467
|
+
this.recordingPage = null;
|
|
1468
|
+
this.recordingOutputPath = '';
|
|
1469
|
+
this.recordingTempDir = '';
|
|
1470
|
+
const message = error instanceof Error ? error.message : String(error);
|
|
1471
|
+
return { path: outputPath, frames: 0, error: message };
|
|
1472
|
+
}
|
|
1473
|
+
}
|
|
1474
|
+
/**
|
|
1475
|
+
* Restart recording - stops current recording (if any) and starts a new one.
|
|
1476
|
+
* Convenience method that combines stopRecording and startRecording.
|
|
1477
|
+
*
|
|
1478
|
+
* @param outputPath - Path to the output video file (must be .webm)
|
|
1479
|
+
* @param url - Optional URL to navigate to (defaults to current page URL)
|
|
1480
|
+
* @returns Result from stopping the previous recording (if any)
|
|
1481
|
+
*/
|
|
1482
|
+
async restartRecording(outputPath, url) {
|
|
1483
|
+
let previousPath;
|
|
1484
|
+
let stopped = false;
|
|
1485
|
+
// Stop current recording if active
|
|
1486
|
+
if (this.recordingContext) {
|
|
1487
|
+
const result = await this.stopRecording();
|
|
1488
|
+
previousPath = result.path;
|
|
1489
|
+
stopped = true;
|
|
1490
|
+
}
|
|
1491
|
+
// Start new recording
|
|
1492
|
+
await this.startRecording(outputPath, url);
|
|
1493
|
+
return { previousPath, stopped };
|
|
1494
|
+
}
|
|
1495
|
+
/**
|
|
1496
|
+
* Close the browser and clean up
|
|
1497
|
+
*/
|
|
1498
|
+
async close() {
|
|
1499
|
+
// Stop recording if active (saves video)
|
|
1500
|
+
if (this.recordingContext) {
|
|
1501
|
+
await this.stopRecording();
|
|
1502
|
+
}
|
|
1503
|
+
// Stop screencast if active
|
|
1504
|
+
if (this.screencastActive) {
|
|
1505
|
+
await this.stopScreencast();
|
|
1506
|
+
}
|
|
1507
|
+
// Clean up CDP session
|
|
1508
|
+
if (this.cdpSession) {
|
|
1509
|
+
await this.cdpSession.detach().catch(() => { });
|
|
1510
|
+
this.cdpSession = null;
|
|
1511
|
+
}
|
|
1512
|
+
if (this.browserbaseSessionId && this.browserbaseApiKey) {
|
|
1513
|
+
await this.closeBrowserbaseSession(this.browserbaseSessionId, this.browserbaseApiKey).catch((error) => {
|
|
1514
|
+
console.error('Failed to close Browserbase session:', error);
|
|
1515
|
+
});
|
|
1516
|
+
this.browser = null;
|
|
1517
|
+
}
|
|
1518
|
+
else if (this.browserUseSessionId && this.browserUseApiKey) {
|
|
1519
|
+
await this.closeBrowserUseSession(this.browserUseSessionId, this.browserUseApiKey).catch((error) => {
|
|
1520
|
+
console.error('Failed to close Browser Use session:', error);
|
|
1521
|
+
});
|
|
1522
|
+
this.browser = null;
|
|
1523
|
+
}
|
|
1524
|
+
else if (this.kernelSessionId && this.kernelApiKey) {
|
|
1525
|
+
await this.closeKernelSession(this.kernelSessionId, this.kernelApiKey).catch((error) => {
|
|
1526
|
+
console.error('Failed to close Kernel session:', error);
|
|
1527
|
+
});
|
|
1528
|
+
this.browser = null;
|
|
1529
|
+
}
|
|
1530
|
+
else if (this.cdpEndpoint !== null) {
|
|
1531
|
+
// CDP: only disconnect, don't close external app's pages
|
|
1532
|
+
if (this.browser) {
|
|
1533
|
+
await this.browser.close().catch(() => { });
|
|
1534
|
+
this.browser = null;
|
|
1535
|
+
}
|
|
1536
|
+
}
|
|
1537
|
+
else {
|
|
1538
|
+
// Regular browser: close everything
|
|
1539
|
+
for (const page of this.pages) {
|
|
1540
|
+
await page.close().catch(() => { });
|
|
1541
|
+
}
|
|
1542
|
+
for (const context of this.contexts) {
|
|
1543
|
+
await context.close().catch(() => { });
|
|
1544
|
+
}
|
|
1545
|
+
if (this.browser) {
|
|
1546
|
+
await this.browser.close().catch(() => { });
|
|
1547
|
+
this.browser = null;
|
|
1548
|
+
}
|
|
1549
|
+
}
|
|
1550
|
+
this.pages = [];
|
|
1551
|
+
this.contexts = [];
|
|
1552
|
+
this.cdpEndpoint = null;
|
|
1553
|
+
this.browserbaseSessionId = null;
|
|
1554
|
+
this.browserbaseApiKey = null;
|
|
1555
|
+
this.browserUseSessionId = null;
|
|
1556
|
+
this.browserUseApiKey = null;
|
|
1557
|
+
this.kernelSessionId = null;
|
|
1558
|
+
this.kernelApiKey = null;
|
|
1559
|
+
this.isPersistentContext = false;
|
|
1560
|
+
this.activePageIndex = 0;
|
|
1561
|
+
this.refMap = {};
|
|
1562
|
+
this.lastSnapshot = '';
|
|
1563
|
+
this.frameCallback = null;
|
|
1564
|
+
}
|
|
1565
|
+
}
|
|
1566
|
+
//# sourceMappingURL=browser.js.map
|