@dyyz1993/agent-browser 0.28.0 → 0.29.1

package/dist/stream-server.js

@@ -2,203 +2,16 @@ import * as net from 'net';
 import * as fs from 'fs';
 import * as path from 'path';
 import { WebSocketServer, WebSocket } from 'ws';
-import sharp from 'sharp';
 import { setScreencastFrameCallback, setEventCallbacks } from './browser-events.js';
 import { executeCommand } from './actions/index.js';
 import { errorResponse, serializeResponse } from './protocol.js';
 import { getSocketDir, getSession, getInstanceId } from './daemon.js';
-export const STATE_CONFIGS = {
-    user_interacting: { format: 'jpeg', quality: 80, maxFps: 60, scale: 0.6 },
-    screen_moving: { format: 'jpeg', quality: 75, maxFps: 8, scale: 0.8 },
-    static: { format: 'jpeg', quality: 80, maxFps: 2, scale: 1 },
-};
-export class StreamStateManager {
-    currentState = 'static';
-    isUserInteracting = false;
-    userInteractionTimer = null;
-    lastFrameTime = 0;
-    frameInterval = Infinity;
-    onStateChange = null;
-    staticTimer = null;
-    USER_INTERACTION_TIMEOUT_MS = 1000;
-    SCREEN_MOVING_THRESHOLD_MS = 1000;
-    STATIC_TIMEOUT_MS = 1500;
-    setStateChangeCallback(callback) {
-        this.onStateChange = callback;
-    }
-    setState(newState) {
-        if (newState !== this.currentState) {
-            const previousState = this.currentState;
-            this.currentState = newState;
-            this.onStateChange?.(newState, previousState);
-        }
-    }
-    resetStaticTimer() {
-        if (this.staticTimer) {
-            clearTimeout(this.staticTimer);
-        }
-        this.staticTimer = setTimeout(() => {
-            if (!this.isUserInteracting) {
-                this.setState('static');
-            }
-        }, this.STATIC_TIMEOUT_MS);
-    }
-    onUserInteraction() {
-        this.setState('user_interacting');
-        this.isUserInteracting = true;
-        this.resetUserInteractionTimeout();
-        this.resetStaticTimer();
-    }
-    resetUserInteractionTimeout() {
-        if (this.userInteractionTimer) {
-            clearTimeout(this.userInteractionTimer);
-        }
-        this.userInteractionTimer = setTimeout(() => {
-            this.isUserInteracting = false;
-            const newState = this.frameInterval < this.SCREEN_MOVING_THRESHOLD_MS ? 'screen_moving' : 'static';
-            this.setState(newState);
-        }, this.USER_INTERACTION_TIMEOUT_MS);
-    }
-    onFrameReceived() {
-        const now = Date.now();
-        this.frameInterval = now - this.lastFrameTime;
-        this.lastFrameTime = now;
-        if (!this.isUserInteracting) {
-            const newState = this.frameInterval < this.SCREEN_MOVING_THRESHOLD_MS ? 'screen_moving' : 'static';
-            this.setState(newState);
-        }
-        this.resetStaticTimer();
-    }
-    getConfig() {
-        return STATE_CONFIGS[this.currentState];
-    }
-    getState() {
-        return this.currentState;
-    }
-    getFrameInterval() {
-        return this.frameInterval;
-    }
-    getIsUserInteracting() {
-        return this.isUserInteracting;
-    }
-}
-export class FrameRateController {
-    lastSentTime = 0;
-    fpsFrameCount = 0;
-    fpsLastTime = Date.now();
-    currentFps = 0;
-    FPS_CALCULATION_INTERVAL_MS = 1000;
-    shouldSendFrame(maxFps) {
-        const now = Date.now();
-        const minInterval = 1000 / maxFps;
-        if (now - this.lastSentTime >= minInterval) {
-            this.lastSentTime = now;
-            this.fpsFrameCount++;
-            this.calculateFps();
-            return true;
-        }
-        return false;
-    }
-    calculateFps() {
-        const now = Date.now();
-        const elapsed = now - this.fpsLastTime;
-        if (elapsed >= this.FPS_CALCULATION_INTERVAL_MS) {
-            this.currentFps = Math.round((this.fpsFrameCount * 1000) / elapsed);
-            this.fpsFrameCount = 0;
-            this.fpsLastTime = now;
-        }
-    }
-    getCurrentFps() {
-        return this.currentFps;
-    }
-    reset() {
-        this.lastSentTime = 0;
-        this.fpsFrameCount = 0;
-        this.fpsLastTime = Date.now();
-        this.currentFps = 0;
-    }
-}
-export class FrameProcessor {
-    screencastFormat = 'jpeg';
-    screencastQuality = 80;
-    async process(data, config, viewportWidth, viewportHeight, cropConfig) {
-        const buffer = Buffer.from(data, 'base64');
-        const needsResize = config.scale < 1 && viewportWidth && viewportHeight;
-        const needsCrop = !!cropConfig;
-        const needsReencode = config.format !== this.screencastFormat || config.quality !== this.screencastQuality;
-        if (!needsResize && !needsCrop && !needsReencode) {
-            return buffer;
-        }
-        let processed = sharp(buffer);
-        if (cropConfig) {
-            processed = processed.extract({
-                left: Math.round(cropConfig.x),
-                top: Math.round(cropConfig.y),
-                width: Math.round(cropConfig.width),
-                height: Math.round(cropConfig.height),
-            });
-        }
-        if (needsResize) {
-            const newWidth = Math.round((viewportWidth ?? 0) * config.scale);
-            const newHeight = Math.round((viewportHeight ?? 0) * config.scale);
-            processed = processed.resize(newWidth, newHeight);
-        }
-        if (config.format === 'jpeg') {
-            processed = processed.jpeg({ quality: config.quality });
-        }
-        else {
-            processed = processed.webp({ quality: config.quality });
-        }
-        return processed.toBuffer();
-    }
-}
-function isPrivateIP(hostname) {
-    // IPv4 check
-    const parts = hostname.split('.').map(Number);
-    if (parts.length === 4 && parts.every((p) => !isNaN(p))) {
-        const [a, b] = parts;
-        if (a === 10)
-            return true;
-        if (a === 172 && b >= 16 && b <= 31)
-            return true;
-        if (a === 192 && b === 168)
-            return true;
-        if (a === 127)
-            return true;
-        if (a === 0)
-            return true;
-    }
-    // IPv6 check
-    const lower = hostname.toLowerCase();
-    if (lower === '::1' || lower === '[::1]' || lower === '::' || lower === 'localhost')
-        return true;
-    if (lower.startsWith('fc') || lower.startsWith('fd') || lower.startsWith('fe80'))
-        return true;
-    if (hostname === 'localhost')
-        return true;
-    return false;
-}
-export function isAllowedOrigin(origin) {
-    // CLI connections (no browser origin) are allowed — CLI clients don't send Origin headers
-    if (!origin) {
-        return true;
-    }
-    if (origin.startsWith('file://')) {
-        return true;
-    }
-    try {
-        const url = new URL(origin);
-        if (isPrivateIP(url.hostname)) {
-            return true;
-        }
-    }
-    catch {
-        // Invalid origin URL - reject
-    }
-    return false;
-}
-function isCommandMessage(msg) {
-    return 'id' in msg && 'action' in msg && !('type' in msg);
+import { getVersion } from './version.js';
+import { StreamStateManager, FrameRateController, FrameProcessor, STATE_CONFIGS, isCommandMessage, isAllowedOrigin, getElementBox, handleInputEvent, } from './stream/index.js';
+export { StreamStateManager, FrameRateController, FrameProcessor, STATE_CONFIGS, isAllowedOrigin };
+const STREAM_SERVER_IPC_FILE = 'stream-server.ipc';
+export function getStreamServerIpcPath() {
+    return path.join(getSocketDir(), STREAM_SERVER_IPC_FILE);
 }
 export class StreamServer {
     wss = null;
@@ -332,7 +145,7 @@ export class StreamServer {
             clientState.elementCheckTimer = setInterval(() => {
                 if (!clientState.selector)
                     return;
-                this.getElementBox(clientState.selector)
+                getElementBox(this.browser, clientState.selector)
                     .then((newBox) => {
                     if (!newBox) {
                         if (clientState.elementBox || !clientState.degraded) {
@@ -418,50 +231,16 @@ export class StreamServer {
         try {
             switch (message.type) {
                 case 'input_mouse':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.injectMouseEvent({
-                        type: message.eventType,
-                        x: message.x,
-                        y: message.y,
-                        button: message.button,
-                        clickCount: message.clickCount,
-                        deltaX: message.deltaX,
-                        deltaY: message.deltaY,
-                        modifiers: message.modifiers,
-                    });
-                    break;
                 case 'input_keyboard':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.injectKeyboardEvent({
-                        type: message.eventType,
-                        key: message.key,
-                        code: message.code,
-                        text: message.text,
-                        modifiers: message.modifiers,
-                    });
-                    break;
                 case 'input_touch':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.injectTouchEvent({
-                        type: message.eventType,
-                        touchPoints: message.touchPoints,
-                        modifiers: message.modifiers,
-                    });
-                    break;
                 case 'input_text':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.insertText(message.text);
-                    break;
                 case 'keyboard_down':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.getPage().keyboard.down(message.key);
-                    break;
                 case 'keyboard_up':
-                    await this.browser.getPage().keyboard.up(message.key);
-                    break;
                 case 'keyboard_insert_text':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.getPage().keyboard.insertText(message.text);
+                case 'input_fill':
+                case 'input_blur_element':
+                case 'user_activity':
+                    await handleInputEvent(message, this.browser, this.stateManager);
                     break;
                 case 'input_focused':
                 case 'input_value':
@@ -477,9 +256,6 @@ export class StreamServer {
                         }
                     }
                     break;
-                case 'user_activity':
-                    this.stateManager.onUserInteraction();
-                    break;
                 case 'status':
                     const cs = this.clients.get(ws);
                     if (cs?.selector) {
@@ -579,25 +355,26 @@ export class StreamServer {
             }
         }
     }
-    async getElementBox(selector) {
-        try {
-            const page = this.browser.getPage();
-            const box = await page.evaluate((sel) => {
-                const el = document.querySelector(sel);
-                if (!el)
-                    return null;
-                const rect = el.getBoundingClientRect();
-                return {
-                    x: rect.x,
-                    y: rect.y,
-                    width: rect.width,
-                    height: rect.height,
-                };
-            }, selector);
-            return box ?? undefined;
+    async refreshElementBox(ws, clientState) {
+        if (!clientState.selector)
+            return;
+        const box = await getElementBox(this.browser, clientState.selector);
+        if (box) {
+            clientState.elementBox = box;
+            clientState.degraded = false;
         }
-        catch {
-            return undefined;
+        else if (!clientState.degraded) {
+            clientState.elementBox = undefined;
+            clientState.degraded = true;
+            const message = {
+                type: 'status',
+                connected: true,
+                screencasting: this.isScreencasting,
+                degraded: true,
+            };
+            if (ws.readyState === WebSocket.OPEN) {
+                ws.send(JSON.stringify(message));
+            }
         }
     }
     sendStatus(ws, clientState) {
@@ -620,7 +397,7 @@ export class StreamServer {
             viewportHeight,
             fps: this.frameRateController.getCurrentFps(),
             state: this.stateManager.getState(),
-            version: process.env.npm_package_version || '0.9.5',
+            version: getVersion(),
         };
         if (clientState?.elementBox) {
             message.element = {
@@ -640,28 +417,6 @@ export class StreamServer {
             ws.send(JSON.stringify(message));
         }
     }
-    async refreshElementBox(ws, clientState) {
-        if (!clientState.selector)
-            return;
-        const box = await this.getElementBox(clientState.selector);
-        if (box) {
-            clientState.elementBox = box;
-            clientState.degraded = false;
-        }
-        else if (!clientState.degraded) {
-            clientState.elementBox = undefined;
-            clientState.degraded = true;
-            const message = {
-                type: 'status',
-                connected: true,
-                screencasting: this.isScreencasting,
-                degraded: true,
-            };
-            if (ws.readyState === WebSocket.OPEN) {
-                ws.send(JSON.stringify(message));
-            }
-        }
-    }
     sendError(ws, errorMessage) {
         const message = {
             type: 'error',
@@ -763,10 +518,6 @@ export class StreamServer {
         return this.frameRateController;
     }
 }
-const STREAM_SERVER_IPC_FILE = 'stream-server.ipc';
-export function getStreamServerIpcPath() {
-    return path.join(getSocketDir(), STREAM_SERVER_IPC_FILE);
-}
 export class StreamServerProxy {
     browser;
     ipcSocket = null;
@@ -844,13 +595,13 @@ export class StreamServerProxy {
                     const line = buffer.substring(0, newlineIdx);
                     buffer = buffer.substring(newlineIdx + 1);
                     if (line.trim()) {
-                        this.handleMessage(line);
+                        this.handleIpcMessage(line);
                     }
                 }
             });
         });
     }
-    handleMessage(line) {
+    async handleIpcMessage(line) {
         try {
             const message = JSON.parse(line);
             switch (message.type) {
@@ -864,7 +615,7 @@ export class StreamServerProxy {
                 case 'input_fill':
                 case 'input_blur_element':
                 case 'user_activity':
-                    this.handleInputMessage(message);
+                    await handleInputEvent(message, this.browser, this.stateManager, this.inputFillDebounceMap, StreamServerProxy.INPUT_FILL_DEBOUNCE_MS);
                     break;
                 case 'client_connected':
                     this.handleClientConnected(message.session);
@@ -874,7 +625,7 @@ export class StreamServerProxy {
                     break;
                 case 'request_element_box':
                     (async () => {
-                        const box = await this.getElementBox(message.selector);
+                        const box = await getElementBox(this.browser, message.selector);
                         const response = {
                             type: 'selector_element',
                             session: message.session ?? this.session,
@@ -919,86 +670,6 @@ export class StreamServerProxy {
             console.error('[StreamServerProxy] Failed to stop screencast on client disconnected:', error);
         }
     }
-    async handleInputMessage(message) {
-        try {
-            switch (message.type) {
-                case 'input_mouse':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.injectMouseEvent({
-                        type: message.eventType,
-                        x: message.x,
-                        y: message.y,
-                        button: message.button,
-                        clickCount: message.clickCount,
-                        deltaX: message.deltaX,
-                        deltaY: message.deltaY,
-                        modifiers: message.modifiers,
-                    });
-                    break;
-                case 'input_keyboard':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.injectKeyboardEvent({
-                        type: message.eventType,
-                        key: message.key,
-                        code: message.code,
-                        text: message.text,
-                        modifiers: message.modifiers,
-                    });
-                    break;
-                case 'input_touch':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.injectTouchEvent({
-                        type: message.eventType,
-                        touchPoints: message.touchPoints,
-                        modifiers: message.modifiers,
-                    });
-                    break;
-                case 'input_text':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.insertText(message.text);
-                    break;
-                case 'keyboard_down':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.getPage().keyboard.down(message.key);
-                    break;
-                case 'keyboard_up':
-                    await this.browser.getPage().keyboard.up(message.key);
-                    break;
-                case 'keyboard_insert_text':
-                    this.stateManager.onUserInteraction();
-                    await this.browser.getPage().keyboard.insertText(message.text);
-                    break;
-                case 'input_fill': {
-                    const sel = message.selector || '';
-                    const txt = message.text || '';
-                    const key = sel || '__global__';
-                    const prev = this.inputFillDebounceMap.get(key);
-                    if (prev)
-                        clearTimeout(prev.timer);
-                    const timer = setTimeout(async () => {
-                        this.inputFillDebounceMap.delete(key);
-                        try {
-                            await this.browser.fillValue(sel, txt);
-                        }
-                        catch (e) {
-                            console.error('[StreamServer] input_fill debounce error:', e.message);
-                        }
-                    }, StreamServerProxy.INPUT_FILL_DEBOUNCE_MS);
-                    this.inputFillDebounceMap.set(key, { timer, text: txt, selector: sel });
-                    break;
-                }
-                case 'input_blur_element':
-                    await this.browser.blurElement(message.selector || '');
-                    break;
-                case 'user_activity':
-                    this.stateManager.onUserInteraction();
-                    break;
-            }
-        }
-        catch (error) {
-            console.error('[StreamServerProxy] Failed to handle input:', error);
-        }
-    }
     setupFrameCallback() {
         setScreencastFrameCallback((frame) => {
             this.sendFrame(frame).catch((err) => {
@@ -1058,31 +729,6 @@ export class StreamServerProxy {
             elementBox,
         });
     }
-    async getElementBox(selector) {
-        try {
-            const page = this.browser.getPage();
-            if (!page) {
-                return undefined;
-            }
-            const box = await page.evaluate((sel) => {
-                const el = document.querySelector(sel);
-                if (!el)
-                    return null;
-                const rect = el.getBoundingClientRect();
-                return {
-                    x: rect.x,
-                    y: rect.y,
-                    width: rect.width,
-                    height: rect.height,
-                };
-            }, selector);
-            return box ?? undefined;
-        }
-        catch (err) {
-            console.error('[StreamServerProxy] getElementBox error:', err);
-            return undefined;
-        }
-    }
     getDaemonSocketPath() {
         const isWindows = process.platform === 'win32';
         if (isWindows) {