testchimp-runner-core 0.0.21 → 0.0.23

package/src/scenario-worker-class.ts

@@ -1,12 +1,28 @@
 import fs from 'fs';
 import path from 'path';
+import { EventEmitter } from 'events';
 import { getEnhancedPageInfo } from './utils/page-info-utils';
-import { initializeBrowser } from './utils/browser-utils';
+import { initializeBrowser, captureOptimizedScreenshot } from './utils/browser-utils';
 import { LLMFacade } from './llm-facade';
 import { ScenarioRunJob, ScenarioResponse, ScenarioStep } from './types';
 import { FileHandler } from './file-handler';
 import { AuthConfig } from './auth-config';
 import { generateTestScript } from './script-utils';
+import { DEFAULT_MODEL, VISION_MODEL } from './model-constants';
+import { LLMProvider } from './llm-provider';
+import { ProgressReporter, StepProgress, JobProgress, StepExecutionStatus } from './progress-reporter';
+import { BackendProxyLLMProvider } from './providers/backend-proxy-llm-provider';
+import {
+  OrchestratorAgent,
+  ToolRegistry,
+  JourneyMemory,
+  AgentConfig,
+  TakeScreenshotTool,
+  RecallHistoryTool,
+  InspectPageTool,
+  CheckPageReadyTool,
+  ExtractDataTool
+} from './orchestrator';
 
 // Define a simple logging interface for compatibility
 interface OutputChannel {
@@ -24,37 +40,216 @@ interface ScenarioJob {
 }
 
 
-const MAX_RETRIES_PER_STEP = 2;
+const MAX_RETRIES_PER_STEP = 3; // 4 total attempts per sub-action: 3 DOM-only, then 1 potential vision attempt
+const MAX_SUBACTIONS_PER_STEP = 5; // Maximum sub-actions to attempt for a single step (reduced from 10 to prevent excessive retries)
+const MAX_FAILED_ATTEMPTS_PER_STEP = 12; // Hard limit on FAILED attempts per step across all sub-actions
 
-export class ScenarioWorker {
+export class ScenarioWorker extends EventEmitter {
   private initialized = false;
   private sessionId: string | null = null;
   private llmFacade: LLMFacade;
   private fileHandler?: FileHandler;
   private outputChannel?: OutputChannel;
-
-  constructor(fileHandler?: FileHandler, authConfig?: AuthConfig, outputChannel?: OutputChannel, backendUrl?: string) {
-    this.llmFacade = new LLMFacade(authConfig, backendUrl);
+  private progressReporter?: ProgressReporter;
+  private currentJobId?: string;
+  
+  // Orchestrator mode
+  private useOrchestrator: boolean = false;
+  private orchestratorAgent?: OrchestratorAgent;
+  private toolRegistry?: ToolRegistry;
+  private orchestratorConfig?: Partial<AgentConfig>;
+  private debugMode: boolean = false;
+
+  constructor(
+    fileHandler?: FileHandler,
+    llmProvider?: LLMProvider,
+    progressReporter?: ProgressReporter,
+    authConfig?: AuthConfig,
+    backendUrl?: string,
+    options?: {
+      useOrchestrator?: boolean;
+      orchestratorConfig?: Partial<AgentConfig>;
+      debugMode?: boolean;
+    },
+    outputChannel?: OutputChannel
+  ) {
+    super();
+    
+    // Use provided LLM provider or default to backend proxy (backward compatible)
+    const actualLLMProvider = llmProvider || new BackendProxyLLMProvider(authConfig, backendUrl);
+    this.llmFacade = new LLMFacade(actualLLMProvider);
+    
     this.fileHandler = fileHandler;
-    this.outputChannel = outputChannel;
+    this.progressReporter = progressReporter;
+    this.outputChannel = outputChannel;  // Set outputChannel for log routing
+    
+    // Orchestrator setup
+    this.useOrchestrator = options?.useOrchestrator || false;
+    this.orchestratorConfig = options?.orchestratorConfig;
+    this.debugMode = options?.debugMode || false;
+    
+    if (this.useOrchestrator) {
+      this.initializeOrchestrator();
+    }
+  }
+  
+  /**
+   * Initialize orchestrator mode with tools
+   */
+  private initializeOrchestrator(): void {
+    this.log('🤖 Initializing Orchestrator Mode');
+    
+    // Create tool registry
+    this.toolRegistry = new ToolRegistry();
+    
+    // Create tools (READ-ONLY information gathering only)
+    const takeScreenshotTool = new TakeScreenshotTool();
+    takeScreenshotTool.setLLMFacade(this.llmFacade);  // Inject LLM for vision analysis
+    
+    // Register 5 information-gathering tools (state changes via Playwright commands)
+    this.toolRegistry.register(takeScreenshotTool);
+    this.toolRegistry.register(new RecallHistoryTool());
+    this.toolRegistry.register(new InspectPageTool());
+    this.toolRegistry.register(new CheckPageReadyTool());
+    this.toolRegistry.register(new ExtractDataTool());
+    
+    // Create orchestrator agent
+    this.orchestratorAgent = new OrchestratorAgent(
+      this.llmFacade,
+      this.toolRegistry,
+      this.orchestratorConfig,
+      this.progressReporter,
+      (message, level) => {
+        if (level === 'error') {
+          this.logError(message);
+        } else if (level === 'warn') {
+          this.log(`⚠️ ${message}`);
+        } else if (level === 'debug') {
+          if (this.debugMode) {
+            this.log(`🐛 ${message}`);
+          }
+        } else {
+          this.log(message);
+        }
+      },
+      this.debugMode  // Pass debug mode
+    );
+    
+    this.log(`✓ Orchestrator initialized with 5 tools${this.debugMode ? ' (DEBUG MODE)' : ''} (information-gathering only)`);
   }
 
   private log(message: string): void {
-    console.log(message);
+    const timestamp = new Date().toISOString().substring(11, 23); // HH:MM:SS.mmm
+    const formattedMessage = `[${timestamp}] [ScenarioWorker] ${message}`;
+    // Always log to console for debug visibility
+    console.log(formattedMessage);
+    // Also route to outputChannel if provided
     if (this.outputChannel) {
-      this.outputChannel.appendLine(`[ScenarioWorker] ${message}`);
+      this.outputChannel.appendLine(formattedMessage);
     }
   }
 
   private logError(message: string): void {
-    console.error(message);
+    const timestamp = new Date().toISOString().substring(11, 23); // HH:MM:SS.mmm
+    const formattedMessage = `[${timestamp}] [ScenarioWorker] ERROR: ${message}`;
+    // Always log to console for debug visibility
+    console.error(formattedMessage);
+    // Also route to outputChannel if provided
     if (this.outputChannel) {
-      this.outputChannel.appendLine(`[ScenarioWorker] ERROR: ${message}`);
+      this.outputChannel.appendLine(formattedMessage);
+    }
+  }
+
+  /**
+   * Capture screenshot as data URL
+   * Returns data:image/png;base64,... format
+   */
+  private async captureStepScreenshot(page: any): Promise<string | undefined> {
+    try {
+      const screenshot = await page.screenshot({ type: 'png' });
+      const base64 = screenshot.toString('base64');
+      return `data:image/png;base64,${base64}`;
+    } catch (error) {
+      this.log(`Failed to capture screenshot: ${error}`);
+      return undefined;
+    }
+  }
+
+  /**
+   * Report step progress to progress reporter
+   */
+  private async reportStepProgress(progress: StepProgress): Promise<void> {
+    // Report to progress reporter if available
+    await this.progressReporter?.onStepProgress?.(progress);
+    
+    // Still emit events for backward compatibility
+    this.emit('stepProgress', progress);
+    
+    // Also log for visibility
+    this.progressReporter?.log?.(
+      `Step ${progress.stepNumber} [${progress.status}]: ${progress.description}`,
+      progress.status === StepExecutionStatus.FAILURE ? 'error' : 'log'
+    );
+  }
+
+  /**
+   * Report job progress to progress reporter
+   */
+  private async reportJobProgress(progress: JobProgress): Promise<void> {
+    // Report to progress reporter if available
+    await this.progressReporter?.onJobProgress?.(progress);
+    
+    // Still emit events for backward compatibility
+    this.emit('jobProgress', progress);
+    
+    // Also log for visibility
+    this.progressReporter?.log?.(`Job ${progress.jobId}: ${progress.status}`);
+  }
+
+  /**
+   * Detect if a step is complex and benefits from proactive vision usage
+   * Complex steps: form filling, verification, navigation after actions
+   */
+  private isComplexStep(stepDescription: string): boolean {
+    const description = stepDescription.toLowerCase();
+    
+    // Verification steps - often need visual confirmation
+    if (description.includes('verify') || description.includes('check') || 
+        description.includes('confirm') || description.includes('ensure')) {
+      return true;
+    }
+    
+    // Form-related steps - multiple fields, complex interactions
+    if (description.includes('fill') && (description.includes('form') || description.includes('field'))) {
+      return true;
     }
+    if (description.includes('enter') && description.includes('information')) {
+      return true;
+    }
+    
+    // Steps that typically follow navigation (page may still be loading)
+    if (description.includes('click') && (
+        description.includes('menu') || 
+        description.includes('tab') || 
+        description.includes('link')
+    )) {
+      return true;
+    }
+    
+    // Multi-step actions indicated by "and" or commas
+    if (description.includes(' and ') || description.split(',').length > 1) {
+      return true;
+    }
+    
+    return false;
   }
 
   async initialize(): Promise<void> {
     try {
+      const RUNNER_CORE_VERSION = "v1.5.0-vision-preserve-values";
+      this.log('═══════════════════════════════════════════════════════');
+      this.log(`🚀 RUNNER-CORE VERSION: ${RUNNER_CORE_VERSION}`);
+      this.log('═══════════════════════════════════════════════════════');
       this.log('Initializing Scenario worker...');
       this.sessionId = `scenario_worker_${Date.now()}`;
       this.initialized = true;
@@ -70,6 +265,14 @@ export class ScenarioWorker {
       throw new Error('Scenario worker not initialized');
     }
 
+    // Set current job ID for progress reporting
+    this.currentJobId = job.id;
+
+    // VERSION MARKER - increment this number with each significant change
+    const RUNNER_CORE_VERSION = "v1.5.0-vision-preserve-values";
+    this.log(`🚀 RUNNER-CORE VERSION: ${RUNNER_CORE_VERSION}`);
+    this.log(`📋 Processing scenario: ${job.scenario}`);
+
     const startTime = Date.now();
     const steps: ScenarioStep[] = [];
     let generatedScript = '';
@@ -80,88 +283,381 @@ export class ScenarioWorker {
     let overallSuccess = true;
 
     try {
+      // Report job started
+      await this.reportJobProgress({
+        jobId: job.id,
+        status: 'started',
+        testName: job.testName
+      });
+
       // 1. Break down scenario into steps using LLM
       const scenarioSteps = await this.llmFacade.breakdownScenario(job.scenario, job.model);
       steps.push(...scenarioSteps);
+      
+      // Report total steps
+      await this.reportJobProgress({
+        jobId: job.id,
+        status: 'in_progress',
+        testName: job.testName,
+        totalSteps: steps.length,
+        currentStep: 0
+      });
+      
+      // Emit log events for steps breakdown
+      this.emit('log', job.id, `\n## Steps Identified (${steps.length} total)\n`);
+      for (const step of steps) {
+        this.emit('log', job.id, `${step.stepNumber}. ${step.description}\n`);
+      }
+      this.emit('log', job.id, `\n## Execution Progress\n\n`);
 
       // 2. Start a new browser session using centralized utility
       // Default to headed mode (headless: false) for better debugging
-      const browserInstance = await initializeBrowser(job.playwrightConfig, false);
+      // Create logger function from outputChannel for browser initialization
+      const logger = this.outputChannel ? (message: string, level?: 'log' | 'error' | 'warn') => {
+        this.outputChannel!.appendLine(`[Browser] ${message}`);
+      } : undefined;
+      const browserInstance = await initializeBrowser(job.playwrightConfig, false, undefined, logger);
       browser = browserInstance.browser;
       context = browserInstance.context;
       page = browserInstance.page;
       
-        // Set reasonable timeout for all operations
-        page.setDefaultTimeout(5000); // 5 seconds
+        // Set reasonable timeout for most operations
+        // 5 seconds for element interactions (fast feedback on wrong selectors)
+        // Navigation operations should use explicit longer timeouts
+        page.setDefaultTimeout(5000);
 
       let previousSteps: ScenarioStep[] = [];
       let lastError: string | undefined;
+      let consecutiveFailures = 0;
+      const MAX_CONSECUTIVE_FAILURES = this.orchestratorConfig?.maxConsecutiveStepFailures || 3;
+      const CONTINUE_ON_FAILURE = this.orchestratorConfig?.continueOnStepFailure !== false;  // Default true
 
-      // 3. Execute each step
-      for (let i = 0; i < steps.length; i++) {
+      // 3a. ORCHESTRATOR MODE - Use orchestrator agent for execution
+      if (this.useOrchestrator && this.orchestratorAgent) {
+        this.log(`🤖 Using Orchestrator Mode (continueOnFailure: ${CONTINUE_ON_FAILURE})`);
+        
+        // Initialize journey memory
+        const memory: JourneyMemory = {
+          history: [],
+          experiences: [],
+          extractedData: {}
+        };
+        
+        // Execute steps using orchestrator
+        for (let i = 0; i < steps.length; i++) {
+          // Only stop if consecutive failures exceed limit AND continueOnFailure is false
+          if (consecutiveFailures >= MAX_CONSECUTIVE_FAILURES && !CONTINUE_ON_FAILURE) {
+            this.log(`🛑 Stopping execution: ${consecutiveFailures} consecutive failures`);
+            // Mark remaining steps as skipped
+            for (let j = i; j < steps.length; j++) {
+              steps[j].success = false;
+              steps[j].error = `Skipped due to ${consecutiveFailures} consecutive failures`;
+              steps[j].playwrightCommands = [];
+            }
+            overallSuccess = false;
+            break;
+          }
+          
+          // Warn if approaching limit (even with continueOnFailure)
+          if (consecutiveFailures >= MAX_CONSECUTIVE_FAILURES && CONTINUE_ON_FAILURE) {
+            this.log(`⚠️ ${consecutiveFailures} consecutive failures - continuing but scenario may have issues`);
+          }
+          
+          const step = steps[i];
+          step.stepNumber = i + 1;
+          
+          try {
+            // Use orchestrator to execute this step
+            const result = await this.orchestratorAgent.executeStep(
+              page,
+              step.description,
+              step.stepNumber,
+              steps.length,
+              steps.map(s => s.description),
+              memory,
+              job.id
+            );
+            
+            // Update step with result
+            step.success = result.success;
+            step.playwrightCommands = result.commands;
+            step.error = result.error;
+            
+            if (result.success) {
+              this.log(`✓ Step ${step.stepNumber} completed via orchestrator (${result.iterations} iterations)`);
+              consecutiveFailures = 0;
+            } else {
+              this.log(`✗ Step ${step.stepNumber} failed via orchestrator: ${result.terminationReason}`);
+              consecutiveFailures++;
+              overallSuccess = false;
+              
+              // CRITICAL: Stop on agent_stuck or infeasible (explicit agent decision)
+              // continueOnStepFailure only applies to command failures, not agent decisions
+              if (result.terminationReason === 'agent_stuck' || result.terminationReason === 'infeasible') {
+                this.log(`🛑 Stopping: Agent declared step ${result.terminationReason} - cannot continue`);
+                // Mark remaining steps as skipped
+                for (let j = i + 1; j < steps.length; j++) {
+                  steps[j].success = false;
+                  steps[j].error = `Skipped: Previous step was ${result.terminationReason}`;
+                  steps[j].playwrightCommands = [];
+                }
+                break;  // Exit loop
+              }
+            }
+            
+          } catch (error: any) {
+            this.logError(`Orchestrator execution failed for step ${step.stepNumber}: ${error.message}`);
+            step.success = false;
+            step.error = error.message;
+            consecutiveFailures++;
+            overallSuccess = false;
+          }
+          
+          previousSteps.push(step);
+        }
+        
+      } else {
+        // 3b. LEGACY MODE - Use existing retry loop
+        // Execute each step (steps may require multiple commands)
+        for (let i = 0; i < steps.length; i++) {
+        // Check if we should stop execution due to consecutive failures
+        if (consecutiveFailures >= MAX_CONSECUTIVE_FAILURES) {
+          this.log(`🛑 Stopping execution: ${consecutiveFailures} consecutive failures detected`);
+          this.log(`   Remaining ${steps.length - i} steps will be skipped to avoid wasting resources`);
+          
+          // Emit log events about early termination
+          this.emit('log', job.id, `\n🛑 EARLY TERMINATION\n`);
+          this.emit('log', job.id, `Reason: ${consecutiveFailures} consecutive step failures\n`);
+          this.emit('log', job.id, `Steps attempted: ${i}\n`);
+          this.emit('log', job.id, `Steps skipped: ${steps.length - i}\n\n`);
+          
+          // Mark remaining steps as skipped
+          for (let j = i; j < steps.length; j++) {
+            const skippedStep = steps[j];
+            skippedStep.stepNumber = j + 1;
+            skippedStep.success = false;
+            skippedStep.error = `Skipped due to ${consecutiveFailures} consecutive failures in previous steps`;
+            skippedStep.playwrightCommands = [];
+            previousSteps.push(skippedStep);
+          }
+          
+          overallSuccess = false;
+          break; // Exit the loop
+        }
         const step = steps[i];
         step.stepNumber = i + 1;
         step.retryCount = 0;
+        step.subActions = [];
+        // Force new array and clear any previous command data
+        step.playwrightCommands = [];
+        step.playwrightCommand = undefined;
 
         let stepSuccess = false;
-        let stepOutput = '';
         let stepError: string | undefined;
+        let subActionCount = 0;
+        let stepComplete = false;
+        let totalFailedAttemptsForStep = 0; // Track FAILED attempts across all sub-actions
+        
+        // Detect if this is a complex step that benefits from proactive vision
+        const isComplexStep = this.isComplexStep(step.description);
+
+        // A step might need multiple commands (sub-actions) to complete
+        while (!stepComplete && subActionCount < MAX_SUBACTIONS_PER_STEP && totalFailedAttemptsForStep < MAX_FAILED_ATTEMPTS_PER_STEP) {
+          let subActionSuccess = false;
+          let subActionCommand: string | undefined;
+          let subActionError: string | undefined;
+          let subActionRetries = 0;
+          let usedVisionMode = false;
+
+          // Build context about what's been done so far in this step
+          const stepContext = step.subActions && step.subActions.length > 0
+            ? `\nSub-actions completed so far for this step:\n${step.subActions.map((sa, idx) => `  ${idx + 1}. ${sa.command} - ${sa.success ? 'SUCCESS' : 'FAILED'}`).join('\n')}`
+            : '';
+
+          for (let attempt = 0; attempt <= MAX_RETRIES_PER_STEP; attempt++) {
+            // Check if we've exceeded failed attempts budget BEFORE attempting
+            if (totalFailedAttemptsForStep >= MAX_FAILED_ATTEMPTS_PER_STEP) {
+              this.log(`  ⚠️ Exceeded failed attempts budget (${MAX_FAILED_ATTEMPTS_PER_STEP}) for this step`);
+              stepComplete = true;
+              stepSuccess = false;
+              stepError = `Exceeded maximum failed attempts (${MAX_FAILED_ATTEMPTS_PER_STEP}) for step`;
+              break;
+            }
+            
+            let currentAttemptCommand: string | undefined;
+            let currentAttemptSuccess = false;
+            let currentAttemptError: string | undefined;
+            const attemptTimestamp = Date.now();
+
+            try {
+              this.log(`Step ${step.stepNumber} - Sub-action ${subActionCount + 1}, Attempt ${attempt + 1}: ${step.description}`);
+
+              // Get current page state - handle navigation in progress
+              let domSnapshot;
+              let pageInfo;
+              try {
+                domSnapshot = {
+                  url: page.url(),
+                  title: await page.title(),
+                  accessibilityTree: await page.accessibility.snapshot()
+                };
+                pageInfo = await getEnhancedPageInfo(domSnapshot);
+              } catch (contextError: any) {
+                // If execution context was destroyed (navigation in progress), wait and retry
+                if (contextError.message && contextError.message.includes('Execution context was destroyed')) {
+                  this.log(`  ⏳ Navigation in progress, waiting for page to load...`);
+                  await page.waitForLoadState('domcontentloaded', { timeout: 5000 }).catch(() => {});
+                  // Retry page state capture
+                  domSnapshot = {
+                    url: page.url(),
+                    title: await page.title(),
+                    accessibilityTree: await page.accessibility.snapshot()
+                  };
+                  pageInfo = await getEnhancedPageInfo(domSnapshot);
+                } else {
+                  throw contextError; // Re-throw if it's not a navigation issue
+                }
+              }
 
-        for (let attempt = 0; attempt <= MAX_RETRIES_PER_STEP; attempt++) {
-          let currentAttemptCommand: string | undefined;
-          let currentAttemptSuccess = false;
-          let currentAttemptError: string | undefined;
-          const attemptTimestamp = Date.now();
-
-          try {
-            this.log(`Attempt ${attempt + 1} for step: ${step.description}`);
-
-            // Get current page state using Playwright's accessibility tree
-            const domSnapshot = {
-              url: page.url(),
-              title: await page.title(),
-              accessibilityTree: await page.accessibility.snapshot()
-            };
-
-            // Generate Playwright command using LLM
-            const pageInfo = await getEnhancedPageInfo(domSnapshot);
-            const command = await this.llmFacade.generatePlaywrightCommand(step.description, pageInfo, previousSteps, lastError, step, job.model);
+              // Vision trigger: Liberal usage since gpt-5-mini vision is cost-effective
+              const modelToUse = job.model || DEFAULT_MODEL;
+              let command: string | null;
+              
+              // Enhanced logging for vision trigger logic
+              this.log(`  🔍 Vision trigger check: subAction=${subActionCount + 1}, attempt=${attempt}, totalFailed=${totalFailedAttemptsForStep}, usedVision=${usedVisionMode}`);
+              
+              // Liberal vision strategy (gpt-5-mini is cost-effective):
+              // 1. After ANY failure (1+) → use vision
+              // 2. Complex steps → use vision from attempt 1
+              // 3. No LLM assessment gate → go directly to vision
+              const hasFailure = totalFailedAttemptsForStep >= 1 && lastError;
+              const shouldUseProactiveVision = isComplexStep && attempt === 0; // First attempt for complex steps
+              const shouldUseVision = (hasFailure || shouldUseProactiveVision) && !usedVisionMode;
+              
+              if (shouldUseVision) {
+                if (shouldUseProactiveVision) {
+                  this.log(`  🎯 PROACTIVE VISION: Complex step detected, using vision from first attempt`);
+                } else {
+                  this.log(`  🎯 VISION TRIGGER: ${totalFailedAttemptsForStep} failure(s) detected, using vision (no LLM gate)`);
+                }
+                
+                // Two-step supervisor pattern:
+                // 1. Supervisor analyzes screenshot and provides instructions
+                // 2. Worker generates command based on those instructions
+                
+                this.log(`  📸 Taking screenshot for supervisor analysis...`);
+                  
+                  // Capture optimized screenshot using utility method
+                  const imageDataUrl = await captureOptimizedScreenshot(
+                    page,
+                    { timeout: 10000 }, // Uses default quality 60
+                    (msg) => this.log(msg)
+                  );
+                  
+                  this.log(`  👔 STEP 1: Supervisor analyzing screenshot (${VISION_MODEL})...`);
+                  const supervisorDiagnostics = await this.llmFacade.getVisionDiagnostics(
+                    step.description + stepContext,
+                    pageInfo,
+                    previousSteps,
+                    lastError,
+                    imageDataUrl,
+                    VISION_MODEL
+                  );
+                  
+                  // DEBUG: Log vision diagnostics
+                  this.log(`  📸 Visual insights: ${supervisorDiagnostics.visualAnalysis}`);
+                  this.log(`  🔍 Root cause: ${supervisorDiagnostics.rootCause}`);
+                  this.log(`  💡 Recommended approach: ${supervisorDiagnostics.recommendedApproach}`);
+                  if (supervisorDiagnostics.elementsFound.length > 0) {
+                    this.log(`  ✅ Elements found: ${supervisorDiagnostics.elementsFound.join(', ')}`);
+                  }
+                  if (supervisorDiagnostics.elementsNotFound.length > 0) {
+                    this.log(`  ❌ Elements not found: ${supervisorDiagnostics.elementsNotFound.join(', ')}`);
+                  }
+                  
+                  this.log(`  🔨 STEP 2: Worker generating command from supervisor instructions (${DEFAULT_MODEL})...`);
+                  command = await this.llmFacade.generateCommandFromSupervisorInstructions(
+                    step.description + stepContext,
+                    supervisorDiagnostics,
+                    pageInfo,
+                    modelToUse // Cheaper model for command generation
+                  );
+                usedVisionMode = true;
+              } else {
+                // Not using vision - use regular DOM-based approach
+                if (usedVisionMode) {
+                  this.log(`  📝 Vision already used - using DOM-based approach`);
+                } else if (isComplexStep) {
+                  this.log(`  📝 Complex step, but first attempt - using DOM-based approach (vision on retry)`);
+                } else {
+                  this.log(`  📝 Using DOM-based approach (${totalFailedAttemptsForStep} failures so far)`);
+                }
+                const stepDescriptionWithContext = step.description + stepContext;
+                command = await this.llmFacade.generatePlaywrightCommand(
+                  stepDescriptionWithContext,
+                  pageInfo,
+                  previousSteps,
+                  lastError,
+                  step,
+                  modelToUse
+                );
+              }
 
-            if (!command) {
-              throw new Error('LLM failed to generate a Playwright command.');
-            }
+              if (!command) {
+                throw new Error('LLM failed to generate a Playwright command.');
+              }
 
-            step.playwrightCommand = command;
-            currentAttemptCommand = command;
-            this.log(`  Command: ${command}`);
+              currentAttemptCommand = command;
+              this.log(`  Command: ${command}`);
 
-            // Execute the command
-            await this.executePlaywrightCommand(page, browser, context, command);
+              // Execute the command
+              await this.executePlaywrightCommand(page, browser, context, command);
 
-            stepSuccess = true;
-            currentAttemptSuccess = true;
-            stepOutput = `Executed: ${command}`;
-            stepError = undefined;
-            this.log(`  ✅ SUCCESS: ${command}`);
-            break; // Step successful, move to next scenario step
+              // Success
+              subActionSuccess = true;
+              currentAttemptSuccess = true;
+              subActionCommand = command;
+              step.playwrightCommands!.push(command);
+              this.log(`  ✅ SUCCESS: ${command}${usedVisionMode ? ' (vision-aided)' : ''}`);
+              
+              // Wait a bit for any navigation that might have been triggered
+              // This prevents "Execution context destroyed" errors when checking goal completion
+              await page.waitForLoadState('domcontentloaded', { timeout: 3000 }).catch(() => {
+                // Ignore timeout - page might not be navigating
+              });
+              
+              break; // Sub-action successful, check if step is complete
             } catch (error: any) {
-              stepError = error instanceof Error ? error.message : String(error);
-              currentAttemptError = stepError;
-              console.error(`  ❌ FAILED (attempt ${attempt + 1}): ${stepError}`);
-              console.error(`  Command attempted: ${currentAttemptCommand || 'N/A'}`);
-              step.retryCount++;
+              subActionError = error instanceof Error ? error.message : String(error);
+              currentAttemptError = subActionError;
+              
+              // Get current URL for context (especially useful for navigation failures)
+              let currentUrl = 'unknown';
+              try {
+                currentUrl = page.url();
+              } catch (e) {
+                // Ignore if we can't get URL
+              }
+              
+              // Enhanced error message with current URL
+              const errorWithContext = `${subActionError} | Current URL: ${currentUrl}`;
+              
+              this.logError(`  ❌ FAILED (attempt ${attempt + 1}): ${subActionError}`);
+              this.logError(`  Current URL: ${currentUrl}`);
+              this.logError(`  Command attempted: ${currentAttemptCommand || 'N/A'}`);
+              subActionRetries++;
+              totalFailedAttemptsForStep++; // Increment failed attempts counter
               
               // Only update lastError if this is the final attempt
               if (attempt === MAX_RETRIES_PER_STEP) {
-                lastError = stepError;
+                lastError = errorWithContext; // Include URL in error context for LLM
               }
               
-              // If this is the last attempt, mark as failed and move on
+              // If this is the last attempt, mark sub-action as failed
               if (attempt === MAX_RETRIES_PER_STEP) {
-                stepSuccess = false;
-                stepOutput = `Failed after ${MAX_RETRIES_PER_STEP + 1} attempts.`;
-                overallSuccess = false;
-                console.error(`  🚫 STEP FAILED after ${MAX_RETRIES_PER_STEP + 1} attempts`);
+                subActionSuccess = false;
+                subActionCommand = currentAttemptCommand;
+                this.logError(`  🚫 SUB-ACTION FAILED after ${MAX_RETRIES_PER_STEP + 1} attempts (including vision mode if used)`);
                 break; // Exit retry loop
               }
             } finally {
@@ -178,10 +674,158 @@ export class ScenarioWorker {
             }
           }
 
+          // Record the sub-action
+          if (subActionCommand) {
+            step.subActions!.push({
+              command: subActionCommand,
+              success: subActionSuccess,
+              error: subActionError,
+              retryCount: subActionRetries
+            });
+          }
+
+          subActionCount++;
+
+          // Determine if step (goal) is complete
+          if (subActionSuccess) {
+            // After each successful sub-action, ask LLM if goal is complete
+            if (subActionCount >= MAX_SUBACTIONS_PER_STEP) {
+              // Safety limit - avoid infinite loops
+              stepComplete = true;
+              stepSuccess = true;
+              this.log(`  ⚠️ Reached max sub-actions limit (${MAX_SUBACTIONS_PER_STEP}) with ${totalFailedAttemptsForStep} failed attempts, considering step complete`);
+            } else {
+              // Ask LLM if goal is complete
+              try {
+                // Capture page state - if navigation is still happening, retry once
+                let domSnapshot;
+                let pageInfo;
+                try {
+                  domSnapshot = {
+                    url: page.url(),
+                    title: await page.title(),
+                    accessibilityTree: await page.accessibility.snapshot()
+                  };
+                  pageInfo = await getEnhancedPageInfo(domSnapshot);
+                } catch (contextError: any) {
+                  // If execution context was destroyed (navigation in progress), wait and retry
+                  if (contextError.message && contextError.message.includes('Execution context was destroyed')) {
+                    this.log(`  ⏳ Navigation detected, waiting for page to load...`);
+                    await page.waitForLoadState('domcontentloaded', { timeout: 5000 }).catch(() => {});
+                    // Retry page state capture
+                    domSnapshot = {
+                      url: page.url(),
+                      title: await page.title(),
+                      accessibilityTree: await page.accessibility.snapshot()
+                    };
+                    pageInfo = await getEnhancedPageInfo(domSnapshot);
+                  } else {
+                    throw contextError; // Re-throw if it's not a navigation issue
+                  }
+                }
+                
+                // Vision-backed goal completion for complex/verification steps
+                const shouldUseVisionForCompletion = isComplexStep && subActionCount >= 1; // At least one action done
+                let completionCheck;
+                
+                if (shouldUseVisionForCompletion) {
+                  this.log(`  🎯 Vision-backed goal completion check (complex step)`);
+                  
+                  // Capture screenshot for visual verification
+                  const imageDataUrl = await captureOptimizedScreenshot(
+                    page,
+                    { timeout: 10000 },
+                    (msg) => this.log(msg)
+                  );
+                  
+                  // Use vision model to check goal completion with visual context
+                  completionCheck = await this.llmFacade.checkGoalCompletionWithVision(
+                    step.description,
+                    step.playwrightCommands || [],
+                    pageInfo,
+                    imageDataUrl,
+                    VISION_MODEL
+                  );
+                } else {
+                  // Regular DOM-based goal completion check
+                  completionCheck = await this.llmFacade.checkGoalCompletion(
+                    step.description,
+                    step.playwrightCommands || [],
+                    pageInfo,
+                    job.model || DEFAULT_MODEL
+                  );
+                }
+                
+                this.log(`  🎯 Goal completion check: ${completionCheck.isComplete ? 'COMPLETE' : 'INCOMPLETE'} - ${completionCheck.reason}`);
+                
+                if (completionCheck.isComplete) {
+                  stepComplete = true;
+                  stepSuccess = true;
+                } else {
+                  // Continue with next sub-action
+                  if (completionCheck.nextSubGoal) {
+                    this.log(`  📍 Next sub-goal: ${completionCheck.nextSubGoal}`);
+                  }
+                  // Continue looping to generate next command
+                }
+              } catch (error) {
+                this.logError(`Error checking goal completion: ${error}`);
+                // Fallback: consider complete after 1 successful sub-action if we can't check
+                stepComplete = true;
+                stepSuccess = true;
+              }
+            }
+          } else {
+            // Sub-action failed
+            stepComplete = true; // Move on after failure
+            stepSuccess = false;
+            stepError = subActionError;
+            overallSuccess = false;
+          }
+        }
+
+        // Set the step's final command (last successful or aggregate)
+        if (step.playwrightCommands && step.playwrightCommands.length > 0) {
+          step.playwrightCommand = step.playwrightCommands[step.playwrightCommands.length - 1];
+        }
+
         step.success = stepSuccess;
         step.error = stepError;
         previousSteps.push(step);
+        
+        // Update consecutive failure counter
+        if (stepSuccess) {
+          consecutiveFailures = 0; // Reset on success
+        } else {
+          consecutiveFailures++;
+          this.log(`⚠️ Consecutive failures: ${consecutiveFailures}/${MAX_CONSECUTIVE_FAILURES}`);
+        }
+        
+        // Emit step result log events
+        this.emit('log', job.id, `### Step ${step.stepNumber}: ${step.description}\n`);
+        this.emit('log', job.id, `Status: ${stepSuccess ? '✅ SUCCESS' : '❌ FAILED'}\n`);
+        this.emit('log', job.id, `Sub-actions: ${subActionCount}\n`);
+        this.emit('log', job.id, `Failed attempts: ${totalFailedAttemptsForStep}\n`);
+        
+        if (step.playwrightCommands && step.playwrightCommands.length > 0) {
+          this.emit('log', job.id, `Commands:\n`);
+          step.playwrightCommands.forEach((cmd, idx) => {
+            this.emit('log', job.id, `  ${idx + 1}. ${cmd}\n`);
+          });
+        }
+        
+        if (stepError) {
+          this.emit('log', job.id, `Error: ${stepError}\n`);
+        }
+        
+        if (step.attempts && step.attempts.length > 0) {
+          this.emit('log', job.id, `Total attempts: ${step.attempts.length}\n`);
+        }
+        
+        this.emit('log', job.id, `\n`);
       }
+      
+      } // End of else block (legacy mode)
 
       // Generate test name if not provided
       const testName = job.testName || await this.llmFacade.generateTestName(job.scenario, job.model);
@@ -216,6 +860,27 @@ export class ScenarioWorker {
       // Generate clean script with TestChimp comment and code
       generatedScript = generateTestScript(testName, steps, undefined, hashtags);
 
+      // Perform final cleanup pass to remove redundancies and make minor adjustments
+      this.log(`[ScenarioWorker] Performing final script cleanup...`);
+      try {
+        const cleanupResult = await this.llmFacade.cleanupScript(generatedScript, job.model);
+        
+        if (cleanupResult.changes && cleanupResult.changes.length > 0) {
+          this.log(`[ScenarioWorker] Cleanup made ${cleanupResult.changes.length} improvement(s):`);
+          cleanupResult.changes.forEach((change, i) => {
+            this.log(`[ScenarioWorker]   ${i + 1}. ${change}`);
+          });
+          generatedScript = cleanupResult.script;
+        } else if (cleanupResult.skipped) {
+          this.log(`[ScenarioWorker] Cleanup skipped: ${cleanupResult.skipped}`);
+        } else {
+          this.log(`[ScenarioWorker] Cleanup completed - no changes needed`);
+        }
+      } catch (error: any) {
+        this.log(`[ScenarioWorker] Cleanup failed, using original script: ${error.message}`);
+        // Continue with original script on error
+      }
+
       // Generate detailed execution log
       const logLines: string[] = [];
       logLines.push(`# Scenario Execution Log`);
@@ -225,6 +890,14 @@ export class ScenarioWorker {
       logLines.push(`End Time: ${new Date().toISOString()}`);
       logLines.push(`Total Execution Time: ${Date.now() - startTime}ms`);
       logLines.push(`Overall Success: ${overallSuccess ? 'YES' : 'NO'}`);
+      
+      // Add early termination info if applicable
+      const skippedSteps = steps.filter(s => s.error?.includes('Skipped due to'));
+      if (skippedSteps.length > 0) {
+        logLines.push(`Early Termination: YES (${consecutiveFailures} consecutive failures)`);
+        logLines.push(`Steps Skipped: ${skippedSteps.length}`);
+      }
+      
       logLines.push(``);
       
       for (const step of steps) {
@@ -270,7 +943,7 @@ export class ScenarioWorker {
 
     } catch (error: any) {
       overallSuccess = false;
-      console.error('Overall scenario processing error:', error);
+      this.logError(`Overall scenario processing error: ${error}`);
       return {
         success: false,
         steps,
@@ -299,19 +972,14 @@ export class ScenarioWorker {
     context: any, 
     command: string
   ): Promise<void> {
-    // Set reasonable timeouts
-    page.setDefaultTimeout(5000); // 5 seconds
+    // Keep default timeout for element operations
+    page.setDefaultTimeout(5000);
 
     try {
       // Execute command directly without validation
       const commandFunction = new Function('page', 'browser', 'context', 'expect', `
         return (async () => {
-          try {
-            ${command}
-          } catch (error) {
-            console.error('Command execution error:', error);
-            throw error;
-          }
+          ${command}
         })();
       `);
 
@@ -320,8 +988,8 @@ export class ScenarioWorker {
       await commandFunction(page, browser, context, expect);
       
     } finally {
-      // Reset to default timeout
-      page.setDefaultTimeout(10000); // Reset to default 10 seconds
+      // Ensure timeout is consistent
+      page.setDefaultTimeout(5000);
     }
   }