@jackwener/opencli 1.0.0 → 1.0.3

package/extension/src/background.ts

@@ -1,5 +1,5 @@
 /**
- * opencli Browser Bridge — Service Worker (background script).
+ * OpenCLI — Service Worker (background script).
  *
  * Connects to the opencli daemon via WebSocket, receives commands,
  * dispatches them to Chrome APIs (debugger/tabs/cookies), returns results.
@@ -7,7 +7,7 @@
 
 import type { Command, Result } from './protocol';
 import { DAEMON_WS_URL, WS_RECONNECT_BASE_DELAY, WS_RECONNECT_MAX_DELAY } from './protocol';
-import * as cdp from './cdp';
+import * as executor from './cdp';
 
 let ws: WebSocket | null = null;
 let reconnectTimer: ReturnType<typeof setTimeout> | null = null;
@@ -85,6 +85,66 @@ function scheduleReconnect(): void {
   }, delay);
 }
 
+// ─── Automation window isolation ─────────────────────────────────────
+// All opencli operations happen in a dedicated Chrome window so the
+// user's active browsing session is never touched.
+// The window auto-closes after 30s of idle (no commands).
+
+let automationWindowId: number | null = null;
+let windowIdleTimer: ReturnType<typeof setTimeout> | null = null;
+const WINDOW_IDLE_TIMEOUT = 30000; // 30s
+
+function resetWindowIdleTimer(): void {
+  if (windowIdleTimer) clearTimeout(windowIdleTimer);
+  windowIdleTimer = setTimeout(async () => {
+    if (automationWindowId !== null) {
+      try {
+        await chrome.windows.remove(automationWindowId);
+        console.log(`[opencli] Automation window ${automationWindowId} closed (idle timeout)`);
+      } catch {
+        // Already gone
+      }
+      automationWindowId = null;
+    }
+    windowIdleTimer = null;
+  }, WINDOW_IDLE_TIMEOUT);
+}
+
+/** Get or create the dedicated automation window. */
+async function getAutomationWindow(): Promise<number> {
+  // Check if our window is still alive
+  if (automationWindowId !== null) {
+    try {
+      await chrome.windows.get(automationWindowId);
+      return automationWindowId;
+    } catch {
+      // Window was closed by user
+      automationWindowId = null;
+    }
+  }
+
+  // Create a new window with about:blank (not chrome://newtab which blocks scripting)
+  const win = await chrome.windows.create({
+    url: 'about:blank',
+    focused: false,
+    width: 1280,
+    height: 900,
+    type: 'normal',
+  });
+  automationWindowId = win.id!;
+  console.log(`[opencli] Created automation window ${automationWindowId}`);
+  return automationWindowId;
+}
+
+// Clean up when the automation window is closed
+chrome.windows.onRemoved.addListener((windowId) => {
+  if (windowId === automationWindowId) {
+    console.log('[opencli] Automation window closed');
+    automationWindowId = null;
+    if (windowIdleTimer) { clearTimeout(windowIdleTimer); windowIdleTimer = null; }
+  }
+});
+
 // ─── Lifecycle events ────────────────────────────────────────────────
 
 let initialized = false;
@@ -93,9 +153,9 @@ function initialize(): void {
   if (initialized) return;
   initialized = true;
   chrome.alarms.create('keepalive', { periodInMinutes: 0.4 }); // ~24 seconds
-  cdp.registerListeners();
+  executor.registerListeners();
   connect();
-  console.log('[opencli] Browser Bridge extension initialized');
+  console.log('[opencli] OpenCLI extension initialized');
 }
 
 chrome.runtime.onInstalled.addListener(() => {
@@ -113,6 +173,8 @@ chrome.alarms.onAlarm.addListener((alarm) => {
 // ─── Command dispatcher ─────────────────────────────────────────────
 
 async function handleCommand(cmd: Command): Promise<Result> {
+  // Reset idle timer on every command (window stays alive while active)
+  resetWindowIdleTimer();
   try {
     switch (cmd.action) {
       case 'exec':
@@ -125,6 +187,8 @@ async function handleCommand(cmd: Command): Promise<Result> {
         return await handleCookies(cmd);
       case 'screenshot':
         return await handleScreenshot(cmd);
+      case 'close-window':
+        return await handleCloseWindow(cmd);
       default:
         return { id: cmd.id, ok: false, error: `Unknown action: ${cmd.action}` };
     }
@@ -145,27 +209,28 @@ function isWebUrl(url?: string): boolean {
   return !url.startsWith('chrome://') && !url.startsWith('chrome-extension://');
 }
 
-/** Resolve target tab: use specified tabId or fall back to active web page tab */
+/**
+ * Resolve target tab in the automation window.
+ * If explicit tabId is given, use that directly.
+ * Otherwise, find or create a tab in the dedicated automation window.
+ */
 async function resolveTabId(tabId?: number): Promise<number> {
   if (tabId !== undefined) return tabId;
 
-  // Try the active tab first
-  const [activeTab] = await chrome.tabs.query({ active: true, currentWindow: true });
-  if (activeTab?.id && isWebUrl(activeTab.url)) {
-    return activeTab.id;
-  }
+  // Get (or create) the automation window
+  const windowId = await getAutomationWindow();
 
-  // Active tab is not debuggable — try to find any open web page tab
-  const allTabs = await chrome.tabs.query({ currentWindow: true });
-  const webTab = allTabs.find(t => t.id && isWebUrl(t.url));
-  if (webTab?.id) {
-    await chrome.tabs.update(webTab.id, { active: true });
-    return webTab.id;
-  }
+  // Find the active tab in our automation window
+  const tabs = await chrome.tabs.query({ windowId });
+  const webTab = tabs.find(t => t.id && isWebUrl(t.url));
+  if (webTab?.id) return webTab.id;
 
-  // No web tabs at all — create one
-  const newTab = await chrome.tabs.create({ url: 'about:blank', active: true });
-  if (!newTab.id) throw new Error('Failed to create new tab');
+  // Use the first tab if it's a blank/new tab page
+  if (tabs.length > 0 && tabs[0]?.id) return tabs[0].id;
+
+  // No suitable tab — create one
+  const newTab = await chrome.tabs.create({ windowId, url: 'about:blank', active: true });
+  if (!newTab.id) throw new Error('Failed to create tab in automation window');
   return newTab.id;
 }
 
@@ -173,7 +238,7 @@ async function handleExec(cmd: Command): Promise<Result> {
   if (!cmd.code) return { id: cmd.id, ok: false, error: 'Missing code' };
   const tabId = await resolveTabId(cmd.tabId);
   try {
-    const data = await cdp.evaluateAsync(tabId, cmd.code);
+    const data = await executor.evaluateAsync(tabId, cmd.code);
     return { id: cmd.id, ok: true, data };
   } catch (err) {
     return { id: cmd.id, ok: false, error: err instanceof Error ? err.message : String(err) };
@@ -235,12 +300,12 @@ async function handleTabs(cmd: Command): Promise<Result> {
         const target = tabs[cmd.index];
         if (!target?.id) return { id: cmd.id, ok: false, error: `Tab index ${cmd.index} not found` };
         await chrome.tabs.remove(target.id);
-        cdp.detach(target.id);
+        executor.detach(target.id);
         return { id: cmd.id, ok: true, data: { closed: target.id } };
       }
       const tabId = await resolveTabId(cmd.tabId);
       await chrome.tabs.remove(tabId);
-      cdp.detach(tabId);
+      executor.detach(tabId);
       return { id: cmd.id, ok: true, data: { closed: tabId } };
     }
     case 'select': {
@@ -281,7 +346,7 @@ async function handleCookies(cmd: Command): Promise<Result> {
 async function handleScreenshot(cmd: Command): Promise<Result> {
   const tabId = await resolveTabId(cmd.tabId);
   try {
-    const data = await cdp.screenshot(tabId, {
+    const data = await executor.screenshot(tabId, {
       format: cmd.format,
       quality: cmd.quality,
       fullPage: cmd.fullPage,
@@ -291,3 +356,15 @@ async function handleScreenshot(cmd: Command): Promise<Result> {
     return { id: cmd.id, ok: false, error: err instanceof Error ? err.message : String(err) };
   }
 }
+
+async function handleCloseWindow(cmd: Command): Promise<Result> {
+  if (automationWindowId !== null) {
+    try {
+      await chrome.windows.remove(automationWindowId);
+    } catch {
+      // Window may already be closed
+    }
+    automationWindowId = null;
+  }
+  return { id: cmd.id, ok: true, data: { closed: true } };
+}

package/extension/src/protocol.ts

@@ -5,7 +5,7 @@
  * Everything else is just JS code sent via 'exec'.
  */
 
-export type Action = 'exec' | 'navigate' | 'tabs' | 'cookies' | 'screenshot';
+export type Action = 'exec' | 'navigate' | 'tabs' | 'cookies' | 'screenshot' | 'close-window';
 
 export interface Command {
   /** Unique request ID */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jackwener/opencli",
-  "version": "1.0.0",
+  "version": "1.0.3",
   "publishConfig": {
     "access": "public"
   },

package/src/browser/cdp.ts

@@ -0,0 +1,295 @@
+/**
+ * CDP client — implements IPage by connecting directly to a Chrome/Electron CDP WebSocket.
+ */
+
+import { WebSocket } from 'ws';
+import type { IPage } from '../types.js';
+import { wrapForEval } from './utils.js';
+
+export interface CDPTarget {
+  type?: string;
+  url?: string;
+  title?: string;
+  webSocketDebuggerUrl?: string;
+}
+
+export class CDPBridge {
+  private _ws: WebSocket | null = null;
+  private _idCounter = 0;
+  private _pending = new Map<number, { resolve: (val: any) => void; reject: (err: Error) => void }>();
+
+  async connect(opts?: { timeout?: number }): Promise<IPage> {
+    const endpoint = process.env.OPENCLI_CDP_ENDPOINT;
+    if (!endpoint) throw new Error('OPENCLI_CDP_ENDPOINT is not set');
+
+    // If it's a direct ws:// URL, use it. Otherwise, fetch the /json endpoint to find a page.
+    let wsUrl = endpoint;
+    if (endpoint.startsWith('http')) {
+      const res = await fetch(`${endpoint.replace(/\/$/, '')}/json`);
+      if (!res.ok) throw new Error(`Failed to fetch CDP targets: ${res.statusText}`);
+      const targets = await res.json() as CDPTarget[];
+      const target = selectCDPTarget(targets);
+      if (!target || !target.webSocketDebuggerUrl) {
+        throw new Error('No inspectable targets found at CDP endpoint');
+      }
+      wsUrl = target.webSocketDebuggerUrl;
+    }
+
+    return new Promise((resolve, reject) => {
+      const ws = new WebSocket(wsUrl);
+      const timeout = setTimeout(() => reject(new Error('CDP connect timeout')), opts?.timeout ?? 10000);
+
+      ws.on('open', () => {
+        clearTimeout(timeout);
+        this._ws = ws;
+        resolve(new CDPPage(this));
+      });
+
+      ws.on('error', (err) => {
+        clearTimeout(timeout);
+        reject(err);
+      });
+
+      ws.on('message', (data) => {
+        try {
+          const msg = JSON.parse(data.toString());
+          if (msg.id && this._pending.has(msg.id)) {
+            const { resolve, reject } = this._pending.get(msg.id)!;
+            this._pending.delete(msg.id);
+            if (msg.error) {
+              reject(new Error(msg.error.message));
+            } else {
+              resolve(msg.result);
+            }
+          }
+        } catch (e) {
+          // ignore parsing errors
+        }
+      });
+    });
+  }
+
+  async close(): Promise<void> {
+    if (this._ws) {
+      this._ws.close();
+      this._ws = null;
+    }
+    for (const p of this._pending.values()) {
+      p.reject(new Error('CDP connection closed'));
+    }
+    this._pending.clear();
+  }
+
+  async send(method: string, params: any = {}): Promise<any> {
+    if (!this._ws || this._ws.readyState !== WebSocket.OPEN) {
+      throw new Error('CDP connection is not open');
+    }
+    const id = ++this._idCounter;
+    return new Promise((resolve, reject) => {
+      this._pending.set(id, { resolve, reject });
+      this._ws!.send(JSON.stringify({ id, method, params }));
+    });
+  }
+}
+
+class CDPPage implements IPage {
+  constructor(private bridge: CDPBridge) {}
+
+  async goto(url: string): Promise<void> {
+    await this.bridge.send('Page.navigate', { url });
+    await new Promise(r => setTimeout(r, 1000));
+  }
+
+  async evaluate(js: string): Promise<any> {
+    const expression = wrapForEval(js);
+    const result = await this.bridge.send('Runtime.evaluate', {
+      expression,
+      returnByValue: true,
+      awaitPromise: true
+    });
+    if (result.exceptionDetails) {
+      throw new Error('Evaluate error: ' + (result.exceptionDetails.exception?.description || 'Unknown exception'));
+    }
+    return result.result?.value;
+  }
+
+  async snapshot(opts?: any): Promise<any> {
+    throw new Error('Method not implemented.');
+  }
+  async click(ref: string): Promise<void> {
+    const safeRef = JSON.stringify(ref);
+    const code = `
+      (() => {
+        const ref = ${safeRef};
+        const el = document.querySelector('[data-ref="' + ref + '"]')
+          || document.querySelectorAll('a, button, input, [role="button"], [tabindex]')[parseInt(ref, 10) || 0];
+        if (!el) throw new Error('Element not found: ' + ref);
+        el.scrollIntoView({ behavior: 'instant', block: 'center' });
+        el.click();
+        return 'clicked';
+      })()
+    `;
+    await this.evaluate(code);
+  }
+  async typeText(ref: string, text: string): Promise<void> {
+    const safeRef = JSON.stringify(ref);
+    const safeText = JSON.stringify(text);
+    const code = `
+      (() => {
+        const ref = ${safeRef};
+        const el = document.querySelector('[data-ref="' + ref + '"]')
+          || document.querySelectorAll('input, textarea, [contenteditable]')[parseInt(ref, 10) || 0];
+        if (!el) throw new Error('Element not found: ' + ref);
+        el.focus();
+        el.value = ${safeText};
+        el.dispatchEvent(new Event('input', { bubbles: true }));
+        el.dispatchEvent(new Event('change', { bubbles: true }));
+        return 'typed';
+      })()
+    `;
+    await this.evaluate(code);
+  }
+  async pressKey(key: string): Promise<void> {
+    const code = `
+      (() => {
+        const el = document.activeElement || document.body;
+        el.dispatchEvent(new KeyboardEvent('keydown', { key: ${JSON.stringify(key)}, bubbles: true }));
+        el.dispatchEvent(new KeyboardEvent('keyup', { key: ${JSON.stringify(key)}, bubbles: true }));
+        return 'pressed';
+      })()
+    `;
+    await this.evaluate(code);
+  }
+  async wait(options: any): Promise<void> {
+    if (typeof options === 'number') {
+      await new Promise(resolve => setTimeout(resolve, options * 1000));
+      return;
+    }
+    if (options.time) {
+      await new Promise(resolve => setTimeout(resolve, options.time * 1000));
+      return;
+    }
+    if (options.text) {
+      const timeout = (options.timeout ?? 30) * 1000;
+      const code = `
+        new Promise((resolve, reject) => {
+          const deadline = Date.now() + ${timeout};
+          const check = () => {
+            if (document.body.innerText.includes(${JSON.stringify(options.text)})) return resolve('found');
+            if (Date.now() > deadline) return reject(new Error('Text not found: ' + ${JSON.stringify(options.text)}));
+            setTimeout(check, 200);
+          };
+          check();
+        })
+      `;
+      await this.evaluate(code);
+    }
+  }
+  async tabs(): Promise<any> {
+    throw new Error('Method not implemented.');
+  }
+  async closeTab(index?: number): Promise<void> {
+    throw new Error('Method not implemented.');
+  }
+  async newTab(): Promise<void> {
+    throw new Error('Method not implemented.');
+  }
+  async selectTab(index: number): Promise<void> {
+    throw new Error('Method not implemented.');
+  }
+  async networkRequests(includeStatic?: boolean): Promise<any> {
+    throw new Error('Method not implemented.');
+  }
+  async consoleMessages(level?: string): Promise<any> {
+    throw new Error('Method not implemented.');
+  }
+  async scroll(direction?: string, amount?: number): Promise<void> {
+    throw new Error('Method not implemented.');
+  }
+  async autoScroll(options?: any): Promise<void> {
+    throw new Error('Method not implemented.');
+  }
+  async installInterceptor(pattern: string): Promise<void> {
+    throw new Error('Method not implemented.');
+  }
+  async getInterceptedRequests(): Promise<any[]> {
+    throw new Error('Method not implemented.');
+  }
+  async screenshot(options?: any): Promise<string> {
+    throw new Error('Method not implemented.');
+  }
+}
+function selectCDPTarget(targets: CDPTarget[]): CDPTarget | undefined {
+  const preferredPattern = compilePreferredPattern(process.env.OPENCLI_CDP_TARGET);
+
+  const ranked = targets
+    .map((target, index) => ({ target, index, score: scoreCDPTarget(target, preferredPattern) }))
+    .filter(({ score }) => Number.isFinite(score))
+    .sort((a, b) => {
+      if (b.score !== a.score) return b.score - a.score;
+      return a.index - b.index;
+    });
+
+  return ranked[0]?.target;
+}
+
+function scoreCDPTarget(target: CDPTarget, preferredPattern?: RegExp): number {
+  if (!target.webSocketDebuggerUrl) return Number.NEGATIVE_INFINITY;
+
+  const type = (target.type ?? '').toLowerCase();
+  const url = (target.url ?? '').toLowerCase();
+  const title = (target.title ?? '').toLowerCase();
+  const haystack = `${title} ${url}`;
+
+  if (!haystack.trim() && !type) return Number.NEGATIVE_INFINITY;
+  if (haystack.includes('devtools')) return Number.NEGATIVE_INFINITY;
+
+  let score = 0;
+
+  if (preferredPattern && preferredPattern.test(haystack)) score += 1000;
+
+  if (type === 'app') score += 120;
+  else if (type === 'webview') score += 100;
+  else if (type === 'page') score += 80;
+  else if (type === 'iframe') score += 20;
+
+  if (url.startsWith('http://localhost') || url.startsWith('https://localhost')) score += 90;
+  if (url.startsWith('file://')) score += 60;
+  if (url.startsWith('http://127.0.0.1') || url.startsWith('https://127.0.0.1')) score += 50;
+  if (url.startsWith('about:blank')) score -= 120;
+  if (url === '' || url === 'about:blank') score -= 40;
+
+  if (title && title !== 'devtools') score += 25;
+  if (title.includes('antigravity')) score += 120;
+  if (title.includes('codex')) score += 120;
+  if (title.includes('cursor')) score += 120;
+  if (title.includes('chatwise')) score += 120;
+  if (title.includes('notion')) score += 120;
+  if (title.includes('discord')) score += 120;
+  if (title.includes('netease')) score += 120;
+
+  if (url.includes('antigravity')) score += 100;
+  if (url.includes('codex')) score += 100;
+  if (url.includes('cursor')) score += 100;
+  if (url.includes('chatwise')) score += 100;
+  if (url.includes('notion')) score += 100;
+  if (url.includes('discord')) score += 100;
+  if (url.includes('netease')) score += 100;
+
+  return score;
+}
+
+function compilePreferredPattern(raw: string | undefined): RegExp | undefined {
+  const value = raw?.trim();
+  if (!value) return undefined;
+  return new RegExp(escapeRegExp(value.toLowerCase()));
+}
+
+function escapeRegExp(value: string): string {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+export const __test__ = {
+  selectCDPTarget,
+  scoreCDPTarget,
+};

package/src/browser/daemon-client.ts

@@ -15,7 +15,7 @@ function generateId(): string {
 
 export interface DaemonCommand {
   id: string;
-  action: 'exec' | 'navigate' | 'tabs' | 'cookies' | 'screenshot';
+  action: 'exec' | 'navigate' | 'tabs' | 'cookies' | 'screenshot' | 'close-window';
   tabId?: number;
   code?: string;
   url?: string;

package/src/browser/index.ts

@@ -6,15 +6,12 @@
  */
 
 export { Page } from './page.js';
-export { PlaywrightMCP } from './mcp.js';
+export { BrowserBridge, BrowserBridge as PlaywrightMCP } from './mcp.js';
+export { CDPBridge } from './cdp.js';
 export { isDaemonRunning } from './daemon-client.js';
 
-// Backward compatibility: getTokenFingerprint is no longer needed but kept as no-op export
-export function getTokenFingerprint(_token: string | undefined): string | null {
-  return null;
-}
-
 import { extractTabEntries, diffTabIndexes, appendLimited } from './tabs.js';
+import { __test__ as cdpTest } from './cdp.js';
 import { withTimeoutMs } from '../runtime.js';
 
 export const __test__ = {
@@ -22,4 +19,6 @@ export const __test__ = {
   diffTabIndexes,
   appendLimited,
   withTimeoutMs,
+  selectCDPTarget: cdpTest.selectCDPTarget,
+  scoreCDPTarget: cdpTest.scoreCDPTarget,
 };

package/src/browser/mcp.ts

@@ -1,8 +1,5 @@
 /**
  * Browser session manager — auto-spawns daemon and provides IPage.
- *
- * Replaces the old PlaywrightMCP class. Still exports as PlaywrightMCP
- * for backward compatibility with main.ts and other consumers.
  */
 
 import { spawn, type ChildProcess } from 'node:child_process';
@@ -15,21 +12,17 @@ import { isDaemonRunning, isExtensionConnected } from './daemon-client.js';
 
 const DAEMON_SPAWN_TIMEOUT = 10000; // 10s to wait for daemon + extension
 
-export type PlaywrightMCPState = 'idle' | 'connecting' | 'connected' | 'closing' | 'closed';
-
-
+export type BrowserBridgeState = 'idle' | 'connecting' | 'connected' | 'closing' | 'closed';
 
 /**
  * Browser factory: manages daemon lifecycle and provides IPage instances.
- *
- * Kept as `PlaywrightMCP` class name for backward compatibility.
  */
-export class PlaywrightMCP {
-  private _state: PlaywrightMCPState = 'idle';
+export class BrowserBridge {
+  private _state: BrowserBridgeState = 'idle';
   private _page: Page | null = null;
   private _daemonProc: ChildProcess | null = null;
 
-  get state(): PlaywrightMCPState {
+  get state(): BrowserBridgeState {
     return this._state;
   }
 
@@ -78,10 +71,13 @@ export class PlaywrightMCP {
       console.error(`[opencli] Starting daemon (${isTs ? 'ts' : 'js'})...`);
     }
 
-    // Use the current runtime to spawn daemon — avoids slow npx resolution.
-    // If already running under tsx (dev), process.execPath is tsx's node.
-    // If running compiled (node dist/), process.execPath is node.
-    this._daemonProc = spawn(process.execPath, [daemonPath], {
+    // For compiled .js, use the current node binary directly (fast).
+    // For .ts dev mode, node can't run .ts files — use tsx via --import.
+    const spawnArgs = isTs
+      ? [process.execPath, '--import', 'tsx/esm', daemonPath]
+      : [process.execPath, daemonPath];
+
+    this._daemonProc = spawn(spawnArgs[0], spawnArgs.slice(1), {
       detached: true,
       stdio: 'ignore',
       env: { ...process.env },
@@ -110,3 +106,6 @@ export class PlaywrightMCP {
     );
   }
 }
+
+/** @deprecated Use BrowserBridge instead */
+export const PlaywrightMCP = BrowserBridge;