@dyyz1993/agent-browser 0.11.5 → 0.12.0

package/dist/actions.js

@@ -3,6 +3,7 @@ import path from 'node:path';
 import { getAppDir, getSession, getInstanceId } from './daemon.js';
 import { performDiff } from './diff.js';
 import { MessageBridge } from './message-bridge.js';
+import { getViewerUrl, getViewerWsUrl, getViewerPort, getMessageBridgeUrl, getExecutablePath, getEffectiveValue, loadConfig, } from './rc-config.js';
 import { detectMainContent, generateContentTips } from './content-detection.js';
 import { humanClick, humanType, humanMoveTo, humanWander, getHumanConfigFromEnv, } from './human-mouse.js';
 import { successResponse, errorResponse } from './protocol.js';
@@ -52,37 +53,44 @@ async function assertElementExists(locator, selector, isRef) {
  */
 export function toAIFriendlyError(error, selector) {
     const message = error instanceof Error ? error.message : String(error);
-    // Handle strict mode violation (multiple elements match)
     if (message.includes('strict mode violation')) {
-        // Extract count if available
         const countMatch = message.match(/resolved to (\d+) elements/);
         const count = countMatch ? countMatch[1] : 'multiple';
         return new Error(`Selector "${selector}" matched ${count} elements. ` +
-            `Run 'snapshot' to get updated refs, or use a more specific CSS selector.`);
+            `Run 'snapshot' to get updated refs, or use a more specific CSS selector. ` +
+            `Tip: Use 'find nth <index> ${selector} --click' to target a specific match.`);
     }
-    // Handle element not interactable (must be checked BEFORE timeout case)
-    // This includes cases where an overlay/modal blocks the element
     if (message.includes('intercepts pointer events')) {
         return new Error(`Element "${selector}" is blocked by another element (likely a modal or overlay). ` +
-            `Try dismissing any modals/cookie banners first.`);
+            `Try dismissing any modals/cookie banners first. ` +
+            `Tip: Run 'snapshot -i' to see all visible elements and identify what's blocking.`);
     }
-    // Handle element not visible
     if (message.includes('not visible') && !message.includes('Timeout')) {
         return new Error(`Element "${selector}" is not visible. ` +
-            `Try scrolling it into view or check if it's hidden.`);
+            `Try 'scrollintoview ${selector}' or check if it's hidden. ` +
+            `Tip: Run 'is visible ${selector}' to confirm visibility state.`);
     }
-    // Handle general timeout (element exists but action couldn't complete)
     if (message.includes('Timeout') && message.includes('exceeded')) {
         return new Error(`Action on "${selector}" timed out. The element may be blocked, still loading, or not interactable. ` +
-            `Run 'snapshot' to check the current page state.`);
+            `Run 'snapshot' to check the current page state. ` +
+            `Tip: If the page is still loading, try 'wait --load networkidle' first.`);
     }
-    // Handle element not found (timeout waiting for element)
     if (message.includes('waiting for') &&
         (message.includes('to be visible') || message.includes('Timeout'))) {
         return new Error(`Element "${selector}" not found or not visible. ` +
-            `Run 'snapshot' to see current page elements.`);
+            `Run 'snapshot -i' to see current page elements and their refs. ` +
+            `Tip: If using @ref, the page may have changed. Re-run 'snapshot -i' to get fresh refs.`);
+    }
+    if (message.includes('Execution context was destroyed') || message.includes('Target closed')) {
+        return new Error(`Browser context was lost (page navigated or closed). ` +
+            `Re-open the page with 'open <url>' and start fresh. ` +
+            `Tip: This usually happens after a form submission triggers navigation.`);
+    }
+    if (message.includes('querySelector') || message.includes('is not a valid selector')) {
+        return new Error(`Invalid selector "${selector}". ` +
+            `CSS selectors like '#id', '.class', or 'tag' are supported. ` +
+            `Tip: Use 'snapshot -i' to get @ref selectors (e.g., @e1) that are always valid.`);
     }
-    // Return original error for unknown cases
     return error instanceof Error ? error : new Error(message);
 }
 /**
@@ -369,7 +377,7 @@ async function handleLaunch(command, browser) {
     return successResponse(command.id, {
         launched: true,
         instanceId,
-        viewerUrl: `http://localhost:5005/view?instanceId=${instanceId}`,
+        viewerUrl: getViewerUrl(instanceId),
     });
 }
 async function handleNavigate(command, browser) {
@@ -895,17 +903,17 @@ async function handleFill(command, browser) {
     const diffResult = await performDiff(locator, command.diffScope, async () => {
         try {
             await locator.fill(command.value);
-            // Trigger input event for recorder to capture
-            // Use page.evaluate to dispatch events in the browser context
-            const page = browser.getPage();
-            if (page) {
-                await page.evaluate((selector) => {
-                    const el = document.querySelector(selector);
-                    if (el) {
-                        el.dispatchEvent(new Event('input', { bubbles: true }));
-                        el.dispatchEvent(new Event('change', { bubbles: true }));
-                    }
-                }, command.selector);
+            if (!isRef) {
+                const page = browser.getPage();
+                if (page) {
+                    await page.evaluate((selector) => {
+                        const el = document.querySelector(selector);
+                        if (el) {
+                            el.dispatchEvent(new Event('input', { bubbles: true }));
+                            el.dispatchEvent(new Event('change', { bubbles: true }));
+                        }
+                    }, command.selector);
+                }
             }
         }
         catch (error) {
@@ -1207,6 +1215,7 @@ async function handleRequests(command, browser) {
         return successResponse(command.id, { cleared: true });
     }
     // Start tracking if not already (with response capture if requested)
+    const wasTracking = browser.trackingEnabled;
     browser.startRequestTracking(command.captureResponse);
     // If output directory is specified, save to directory
     if (command.output) {
@@ -1219,7 +1228,11 @@ async function handleRequests(command, browser) {
         });
     }
     const requests = browser.getRequests(command.filter, command.type);
-    return successResponse(command.id, { requests });
+    const result = { requests };
+    if (requests.length === 0 && !wasTracking) {
+        result.hint = 'Request tracking just activated. Reload or navigate to capture requests.';
+    }
+    return successResponse(command.id, result);
 }
 async function handleDownload(command, browser) {
     const page = browser.getPage();
@@ -1659,7 +1672,7 @@ async function handleNth(command, browser) {
     const refLocator = browser.getLocatorFromRef(command.selector, command.inFrame);
     let locator;
     if (refLocator) {
-        locator = refLocator;
+        locator = command.index === -1 ? refLocator.last() : refLocator.nth(command.index);
     }
     else {
         const frame = browser.getFrame(command.inFrame);
@@ -1999,14 +2012,10 @@ async function handleRecorderStatus(command, browser) {
 async function handleRecorderReplay(command, browser) {
     const fs = await import('node:fs');
     const path = await import('node:path');
-    // Determine YAML file path
     let yamlPath = command.path;
     if (!yamlPath) {
-        // Use the most recent recording from temp directory
         const recorderDir = path.join(getAppDir(), 'tmp', 'recordings');
-        console.log('[Replay] Looking for recordings in:', recorderDir);
         if (!fs.existsSync(recorderDir)) {
-            console.log('[Replay] Directory does not exist');
             return errorResponse(command.id, 'No recordings found. Please record first.');
         }
         const files = fs
@@ -2017,21 +2026,39 @@ async function handleRecorderReplay(command, browser) {
             time: fs.statSync(path.join(recorderDir, f)).mtime.getTime(),
         }))
             .sort((a, b) => b.time - a.time);
-        console.log('[Replay] Found files:', files.length);
         if (files.length === 0) {
             return errorResponse(command.id, 'No recordings found. Please record first.');
         }
         yamlPath = path.join(recorderDir, files[0].name);
-        console.log('[Replay] Using file:', yamlPath);
     }
-    // Read YAML file
     if (!fs.existsSync(yamlPath)) {
         return errorResponse(command.id, `Recording file not found: ${yamlPath}`);
     }
     const yamlContent = fs.readFileSync(yamlPath, 'utf-8');
-    // Parse CLI commands from YAML
-    const lines = yamlContent.split('\n');
     const cliCommands = [];
+    // Strategy 1: Parse structured steps and generate CLI commands
+    const stepRegex = /^\s+-\s+(?:id:\s*.+)/;
+    const lines = yamlContent.split('\n');
+    let inSteps = false;
+    const parsedSteps = {};
+    for (const line of lines) {
+        if (/^steps:/.test(line.trim())) {
+            inSteps = true;
+            continue;
+        }
+        if (inSteps && /^-\s+id:/.test(line.trim())) {
+            const idMatch = line.match(/id:\s*(.+)/);
+            if (idMatch)
+                parsedSteps.currentId = idMatch[1].trim();
+        }
+        if (inSteps && /^\s+action:\s*(.+)/.test(line)) {
+            // End of steps section when we hit a non-step line
+        }
+        if (inSteps && !/^\s/.test(line) && !/^$/.test(line) && !/^steps:/.test(line.trim())) {
+            inSteps = false;
+        }
+    }
+    // Strategy 2: Fall back to CLI Commands comment section
     let inCliSection = false;
     for (const line of lines) {
         if (line.includes('# CLI Commands')) {
@@ -2043,10 +2070,23 @@ async function handleRecorderReplay(command, browser) {
             cliCommands.push(line.trim());
         }
     }
+    // Strategy 3: If no CLI section, generate from structured steps using browser's method
     if (cliCommands.length === 0) {
         return errorResponse(command.id, 'No CLI commands found in recording. Please re-record with the new version.');
     }
-    // Helper function to parse command line with proper quote handling
+    // Filter out env-only lines (keep them for env setup but not as commands)
+    const envLines = cliCommands.filter((l) => l.startsWith('AGENT_BROWSER_'));
+    const cmdLines = cliCommands.filter((l) => l.startsWith('agent-browser '));
+    // Set env vars from recording
+    const originalEnv = {};
+    for (const envLine of envLines) {
+        const eqIdx = envLine.indexOf('=');
+        if (eqIdx > 0) {
+            const key = envLine.substring(0, eqIdx);
+            originalEnv[key] = process.env[key];
+            process.env[key] = envLine.substring(eqIdx + 1);
+        }
+    }
     function parseCommandLine(line) {
         const parts = [];
         let current = '';
@@ -2077,62 +2117,38 @@ async function handleRecorderReplay(command, browser) {
         }
         return parts;
     }
-    // Execute each command
+    // Get current session for passthrough
+    const currentSession = process.env.AGENT_BROWSER_SESSION || 'default';
     const results = [];
-    for (const cmdLine of cliCommands) {
+    for (const cmdLine of cmdLines) {
         try {
-            // Parse command line with proper quote handling
             let parts = parseCommandLine(cmdLine);
-            const envVars = {};
-            // Extract environment variables (format: KEY=value)
-            while (parts.length > 0 && parts[0].includes('=')) {
-                const [key, ...valueParts] = parts.shift().split('=');
-                envVars[key] = valueParts.join('=');
-            }
-            // Remove 'agent-browser' prefix if present
             if (parts.length > 0 && parts[0] === 'agent-browser') {
                 parts = parts.slice(1);
             }
-            // Skip empty commands
             if (parts.length === 0) {
                 results.push({ command: cmdLine, success: true });
                 continue;
             }
-            // Set environment variables temporarily
-            const originalEnv = {};
-            for (const [key, value] of Object.entries(envVars)) {
-                originalEnv[key] = process.env[key];
-                process.env[key] = value;
-            }
-            // Execute command using the existing executeCommand flow
             const { parseCommand } = await import('./cli/commands.js');
             const { parseFlags } = await import('./cli/flags.js');
             const flags = parseFlags([]);
+            if (currentSession !== 'default') {
+                flags.session = currentSession;
+            }
             const parsedCmd = parseCommand(parts, flags);
-            // Check if recording is active, and temporarily disable
             const wasRecording = browser.isRecordingSession();
             if (wasRecording) {
                 browser.pauseRecording();
             }
-            // Execute the command with a timeout to prevent hanging on invalid selectors
             const COMMAND_TIMEOUT_MS = 5000;
             const result = (await Promise.race([
                 executeCommand(parsedCmd, browser),
                 new Promise((_, reject) => setTimeout(() => reject(new Error(`Command timed out after ${COMMAND_TIMEOUT_MS}ms`)), COMMAND_TIMEOUT_MS)),
             ]));
-            // Restore recording state
             if (wasRecording) {
                 browser.resumeRecording();
             }
-            // Restore environment variables
-            for (const [key, value] of Object.entries(originalEnv)) {
-                if (value === undefined) {
-                    delete process.env[key];
-                }
-                else {
-                    process.env[key] = value;
-                }
-            }
             results.push({ command: cmdLine, success: result.success });
         }
         catch (e) {
@@ -2140,29 +2156,37 @@ async function handleRecorderReplay(command, browser) {
             results.push({ command: cmdLine, success: false, error: errorMessage });
         }
     }
+    // Restore env vars
+    for (const [key, value] of Object.entries(originalEnv)) {
+        if (value === undefined) {
+            delete process.env[key];
+        }
+        else {
+            process.env[key] = value;
+        }
+    }
     const successCount = results.filter((r) => r.success).length;
     const failCount = results.filter((r) => !r.success).length;
     return successResponse(command.id, {
         replayed: true,
         file: yamlPath,
-        totalCommands: cliCommands.length,
+        totalCommands: cmdLines.length,
         successCount,
         failCount,
-        results: results.slice(0, 20), // Only return first 20 results
+        results: results.slice(0, 20),
     });
 }
 async function handleViewer(command, _browser) {
     const instanceId = getInstanceId();
-    const port = parseInt(process.env.AGENT_BROWSER_STREAM_PORT || '5005', 10);
     return successResponse(command.id, {
-        url: `http://localhost:${port}/view?instanceId=${instanceId}`,
-        wsUrl: `ws://localhost:${port}?instanceId=${instanceId}`,
-        streamPort: port,
+        url: getViewerUrl(instanceId),
+        wsUrl: getViewerWsUrl(instanceId),
+        streamPort: getViewerPort(),
     });
 }
 async function handleAsk(command, _browser) {
     const session = getSession();
-    const bridge = new MessageBridge();
+    const bridge = new MessageBridge(getMessageBridgeUrl());
     try {
         const answer = await bridge.ask(command.question, session);
         return successResponse(command.id, { answer });
@@ -2174,9 +2198,10 @@ async function handleAsk(command, _browser) {
 }
 function handleConfig(command) {
     const humanConfig = getHumanConfigFromEnv();
+    const rcConfig = loadConfig();
     const config = {
         session: process.env.AGENT_BROWSER_SESSION || 'default',
-        executablePath: process.env.AGENT_BROWSER_EXECUTABLE_PATH || null,
+        executablePath: getExecutablePath() || null,
         extensions: process.env.AGENT_BROWSER_EXTENSIONS || null,
         profile: process.env.AGENT_BROWSER_PROFILE || null,
         state: process.env.AGENT_BROWSER_STATE || null,
@@ -2187,24 +2212,34 @@ function handleConfig(command) {
         provider: process.env.AGENT_BROWSER_PROVIDER || null,
         allowFileAccess: process.env.AGENT_BROWSER_ALLOW_FILE_ACCESS === '1',
         iosDevice: process.env.AGENT_BROWSER_IOS_DEVICE || null,
-        streamPort: process.env.AGENT_BROWSER_STREAM_PORT || null,
+        streamPort: getViewerPort(),
         headed: process.env.AGENT_BROWSER_HEADED === '1',
         human: humanConfig,
     };
     if (command.json) {
-        return successResponse(command.id, { config });
+        return successResponse(command.id, { config, rc: rcConfig });
     }
+    const viewerHost = getEffectiveValue('viewer.host');
+    const bridgeUrl = getEffectiveValue('messageBridge.url');
+    const msgProxy = getEffectiveValue('messageProxy.url');
     // Format human-readable output
     const lines = [
         'Agent Browser Configuration',
         '===========================',
         '',
         'Session & Browser:',
-        `  AGENT_BROWSER_SESSION          ${config.session}`,
-        `  AGENT_BROWSER_EXECUTABLE_PATH  ${config.executablePath || '(not set)'}`,
+        `  executablePath                 ${config.executablePath || '(not set)'}`,
         `  AGENT_BROWSER_PROVIDER         ${config.provider || '(not set)'}`,
         `  AGENT_BROWSER_HEADED           ${config.headed ? 'true' : 'false (default)'}`,
         '',
+        'Viewer & Stream:',
+        `  viewer.host                    ${viewerHost || '(not set, using http://localhost)'}`,
+        `  viewer.port                    ${config.streamPort}`,
+        '',
+        'Message Bridge (ask command):',
+        `  messageBridge.url              ${bridgeUrl || '(not set, using default)'}`,
+        `  messageProxy.url               ${msgProxy || '(not set)'}`,
+        '',
         'Browser Options:',
         `  AGENT_BROWSER_PROFILE          ${config.profile || '(not set)'}`,
         `  AGENT_BROWSER_EXTENSIONS       ${config.extensions || '(not set)'}`,
@@ -2216,8 +2251,9 @@ function handleConfig(command) {
         'Human Mode (runtime):',
         `  AGENT_BROWSER_HUMAN            ${humanConfig.enabled ? humanConfig.pathType + ' ✓' : '(disabled)'}`,
         '',
-        'Note: Most settings only take effect at browser startup.',
-        'Use "export AGENT_BROWSER_XXX=value" before starting.',
+        `Persistent config: ~/.agent-browser/config.json`,
+        'Run "agent-browser config set <key> <value>" to persist settings.',
+        'Run "agent-browser config list" to see configurable keys.',
     ];
     return successResponse(command.id, { config, output: lines.join('\n') });
 }