@dynamicu/chromedebug-mcp 2.2.0

package/src/http-server.js

@@ -0,0 +1,1516 @@
+// HTTP server for Chrome extension workflow recording endpoints
+import express from 'express';
+import cors from 'cors';
+import multer from 'multer';
+import { ChromeController } from './chrome-controller.js';
+import { WebSocketServer } from 'ws';
+import { findAvailablePort } from './utils.js';
+import { writePortFile, removePortFile } from './port-discovery.js';
+import { configLoader } from './config-loader.js';
+import { setupProcessTracking } from './services/process-tracker.js';
+
+// Security imports
+import { authenticate, authorize, PERMISSIONS } from './middleware/auth.js';
+import { 
+  corsOptions, 
+  securityHeaders, 
+  rateLimits, 
+  requestSizeLimits,
+  securityLogger,
+  securityErrorHandler
+} from './middleware/security.js';
+import { createValidator } from './validation/schemas.js';
+import {
+  workflowRecordingSchema,
+  frameBatchSchema,
+  associateLogsSchema,
+  streamLogsSchema,
+  domIntentSchema,
+  navigateSchema,
+  evaluateSchema,
+  screenInteractionsSchema,
+  sessionIdParam,
+  recordingIdParam,
+  frameParams,
+  pageContentQuery
+} from './validation/schemas.js';
+import { transformAssociateLogsRequest, analyzeLogFieldCompliance } from './validation/log-transformer.js';
+import adminRouter from './routes/admin.js';
+import { getLicenseManager } from './firebase-license-manager.js';
+
+// Global Chrome controller instance (will be overridden by parameter if provided)
+let globalChromeController = new ChromeController();
+
+// Store WebSocket clients
+const wsClients = new Set();
+
+// Store selected element info from extension
+let lastSelectedElement = null;
+
+// Configure multer for handling FormData with security limits
+const upload = multer({ 
+  storage: multer.memoryStorage(),
+  limits: {
+    fileSize: 50 * 1024 * 1024, // 50MB limit
+    files: 10 // Maximum 10 files
+  },
+  fileFilter: (req, file, cb) => {
+    // Only allow specific file types for security
+    const allowedTypes = ['image/jpeg', 'image/png', 'image/webp', 'application/json'];
+    if (allowedTypes.includes(file.mimetype)) {
+      cb(null, true);
+    } else {
+      cb(new Error(`File type ${file.mimetype} not allowed`));
+    }
+  }
+});
+
+// HTTP server setup for workflow recording endpoints
+async function startHttpServer(chromeController = null, targetPort = null) {
+  // Use provided Chrome controller or default to global instance
+  const activeController = chromeController || globalChromeController;
+
+  const app = express();
+
+  // Trust proxy for accurate client IPs
+  app.set('trust proxy', 1);
+
+  // RAW REQUEST LOGGING - Capture ALL requests before any middleware processing
+  app.use('*', (req, res, next) => {
+    const timestamp = new Date().toISOString();
+    const ip = req.ip || req.connection?.remoteAddress || 'unknown';
+    const userAgent = req.get('user-agent') || 'unknown';
+    const contentType = req.get('content-type') || 'none';
+    const contentLength = req.get('content-length') || '0';
+
+    console.log(`[RAW-REQUEST] ${timestamp} - ${req.method} ${req.originalUrl}`);
+    console.log(`[RAW-REQUEST] IP: ${ip} | UA: ${userAgent}`);
+    console.log(`[RAW-REQUEST] Content-Type: ${contentType} | Length: ${contentLength}bytes`);
+    console.log(`[RAW-REQUEST] Headers:`, Object.keys(req.headers).map(h => `${h}=${req.headers[h]}`).join(', '));
+
+    // Capture body parsing errors
+    const originalJson = express.json();
+    let bodyParsingError = null;
+
+    // Override res.status to capture 400 errors before they're sent
+    const originalStatus = res.status;
+    res.status = function(code) {
+      if (code === 400) {
+        console.log(`[RAW-REQUEST] HTTP 400 ERROR for ${req.method} ${req.originalUrl}`);
+        console.log(`[RAW-REQUEST] This request will be rejected with 400`);
+      }
+      return originalStatus.call(this, code);
+    };
+
+    next();
+  });
+
+  // ENHANCED BODY PARSING - For debugging body parsing issues (only for screen-interactions)
+  app.use('/chromedebug/screen-interactions/*', (req, res, next) => {
+    if (req.method === 'POST') {
+      console.log(`[BODY-DEBUG] Processing screen-interactions request for ${req.originalUrl}`);
+      console.log(`[BODY-DEBUG] Content-Type: ${req.get('content-type')}`);
+      console.log(`[BODY-DEBUG] Content-Length: ${req.get('content-length')}`);
+      console.log(`[BODY-DEBUG] User-Agent: ${req.get('user-agent')}`);
+
+      // Store original data handler to capture raw body
+      const originalData = req.on;
+      const chunks = [];
+
+      req.on = function(event, handler) {
+        if (event === 'data') {
+          const originalHandler = handler;
+          const wrappedHandler = (chunk) => {
+            chunks.push(chunk);
+            return originalHandler(chunk);
+          };
+          return originalData.call(this, event, wrappedHandler);
+        } else if (event === 'end') {
+          const originalHandler = handler;
+          const wrappedHandler = () => {
+            if (chunks.length > 0) {
+              const rawBody = Buffer.concat(chunks).toString();
+              console.log(`[BODY-DEBUG] Raw body captured (${rawBody.length} chars):`, rawBody);
+              req.rawBody = rawBody;
+
+              // Try to parse manually
+              try {
+                const parsedBody = JSON.parse(rawBody);
+                console.log(`[BODY-DEBUG] Manual JSON parse successful`);
+                console.log(`[BODY-DEBUG] Parsed data:`, JSON.stringify(parsedBody, null, 2));
+              } catch (parseError) {
+                console.log(`[BODY-DEBUG] Manual JSON parse FAILED:`, parseError.message);
+              }
+            }
+            return originalHandler();
+          };
+          return originalData.call(this, event, wrappedHandler);
+        }
+        return originalData.call(this, event, handler);
+      };
+    }
+    next();
+  });
+
+  // JSON PARSING ERROR HANDLER - Catch malformed JSON before it reaches our handlers
+  app.use('/chromedebug/screen-interactions/*', (err, req, res, next) => {
+    if (err instanceof SyntaxError && err.status === 400 && 'body' in err) {
+      console.log(`[JSON-PARSE-ERROR] Malformed JSON in screen-interactions request:`, err.message);
+      console.log(`[JSON-PARSE-ERROR] Raw body:`, req.rawBody || 'not captured');
+      console.log(`[JSON-PARSE-ERROR] Request body:`, req.body);
+      return res.status(400).json({
+        error: 'Invalid JSON format',
+        details: err.message
+      });
+    }
+    next(err);
+  });
+
+  // ENHANCED VALIDATION ERROR HANDLER - Catch and log detailed validation errors
+  app.use('/chromedebug/screen-interactions/*', (err, req, res, next) => {
+    if (err && err.status === 400 && err.details) {
+      console.log(`[VALIDATION-ERROR] Screen interactions validation failed:`);
+      console.log(`[VALIDATION-ERROR] Request path:`, req.originalUrl);
+      console.log(`[VALIDATION-ERROR] User agent:`, req.get('user-agent'));
+      console.log(`[VALIDATION-ERROR] Content type:`, req.get('content-type'));
+      console.log(`[VALIDATION-ERROR] Raw body:`, req.rawBody || 'not captured');
+      console.log(`[VALIDATION-ERROR] Parsed body:`, JSON.stringify(req.body, null, 2));
+      console.log(`[VALIDATION-ERROR] Validation errors:`, JSON.stringify(err.details, null, 2));
+    }
+    next(err);
+  });
+
+  // Security middleware (applied first)
+  app.use(securityHeaders);
+  app.use(cors(corsOptions));
+  // Note: securityLogger moved to after authentication for protected routes
+  
+  // Rate limiting
+  app.use('/chromedebug/admin', rateLimits.auth);
+  app.use('/chromedebug/frame-batch', rateLimits.upload);
+  app.use('/chromedebug/workflow-recording', rateLimits.upload);
+  app.use('/chromedebug/launch', rateLimits.chromeControl);
+  app.use('/chromedebug/navigate', rateLimits.chromeControl);
+  app.use('/chromedebug/evaluate', rateLimits.chromeControl);
+  app.use('/chromedebug/status', rateLimits.status);
+  app.use(rateLimits.general);
+  
+  // Body parsing with security limits
+  app.use('/chromedebug/frame-batch', express.json({ limit: requestSizeLimits.largeUpload }));
+  app.use('/chromedebug/frame-batch', express.urlencoded({ limit: requestSizeLimits.largeUpload, extended: true }));
+  app.use('/chromedebug/upload/*', express.raw({ 
+    type: 'application/octet-stream', 
+    limit: requestSizeLimits.largeUpload 
+  }));
+  app.use(express.json({ limit: requestSizeLimits.json }));
+  app.use(express.urlencoded({ limit: requestSizeLimits.urlencoded, extended: true }));
+
+  // JSON error handling middleware
+  app.use((err, req, res, next) => {
+    if (err instanceof SyntaxError && err.status === 400 && 'body' in err) {
+      console.error('[JSON Parse Error]', {
+        url: req.url,
+        method: req.method,
+        contentType: req.get('content-type'),
+        error: err.message,
+        userAgent: req.get('user-agent'),
+        timestamp: new Date().toISOString()
+      });
+      return res.status(400).json({
+        error: 'Invalid JSON',
+        details: err.message,
+        position: err.message.match(/position (\d+)/)?.[1],
+        help: 'Check for escaped characters or malformed JSON in request body'
+      });
+    }
+    next(err);
+  });
+
+  // Admin routes (protected)
+  app.use('/chromedebug/admin', authenticate, adminRouter);
+  
+  // Public endpoints (no authentication required)
+  app.get('/test', securityLogger, (req, res) => {
+    res.json({ 
+      message: 'ChromeDebug MCP HTTP server is running', 
+      timestamp: new Date().toISOString(),
+      security: 'enabled'
+    });
+  });
+  
+  // Status endpoint for Chrome extension (no auth required)
+  app.get('/chromedebug/status', securityLogger, (req, res) => {
+    res.json({ 
+      status: 'online',
+      version: '1.0.0',
+      security: 'enabled',
+      timestamp: new Date().toISOString()
+    });
+  });
+  
+  // Health check endpoint for extension discovery (no auth required)
+  app.get('/health', (req, res) => {
+    res.json({ 
+      status: 'healthy',
+      service: 'chrome-pilot',
+      timestamp: new Date().toISOString()
+    });
+  });
+  
+  // Port discovery endpoint (no auth required)
+  app.get('/chromedebug/port', (req, res) => {
+    res.json({ 
+      port: process.env.PORT || 3000,
+      message: 'ChromeDebug MCP server port',
+      timestamp: new Date().toISOString()
+    });
+  });
+  
+  // Authentication test endpoint
+  app.get('/chromedebug/auth-test', authenticate, (req, res) => {
+    res.json({
+      success: true,
+      message: 'Authentication successful',
+      user: {
+        id: req.user.id,
+        name: req.user.name,
+        role: req.user.role,
+        authMethod: req.user.authMethod
+      },
+      timestamp: new Date().toISOString()
+    });
+  });
+
+  // Protected workflow recording endpoints
+  app.post('/chromedebug/workflow-recording', 
+    authenticate,
+    authorize(PERMISSIONS.WORKFLOW_WRITE),
+    createValidator(workflowRecordingSchema),
+    async (req, res) => {
+    const { sessionId, url, title, includeLogs, actions, logs, functionTraces, name, screenshotSettings } = req.body;
+    console.log('[HTTP Server] Received workflow recording with name:', name);
+    console.log('[HTTP Server] Function traces count:', functionTraces ? functionTraces.length : 0);
+    if (!sessionId || !actions) {
+      return res.status(400).json({ error: 'sessionId and actions are required' });
+    }
+    
+    try {
+      const result = await activeController.storeWorkflowRecording(sessionId, url, title, includeLogs, actions, logs, name, screenshotSettings, functionTraces);
+      res.json(result);
+    } catch (error) {
+      console.error('Error storing workflow recording:', error);
+      res.status(500).json({ error: 'Failed to store workflow recording', details: error.message });
+    }
+  });
+
+  app.get('/chromedebug/workflow-recording/:sessionId',
+    authenticate,
+    authorize(PERMISSIONS.WORKFLOW_READ),
+    createValidator(sessionIdParam, 'params'),
+    async (req, res) => {
+    const { sessionId } = req.params;
+    try {
+      const result = await activeController.getWorkflowRecording(sessionId);
+      if (result.error) {
+        return res.status(404).json(result);
+      }
+      res.json(result);
+    } catch (error) {
+      console.error('Error retrieving workflow recording:', error);
+      res.status(500).json({ error: 'Failed to retrieve workflow recording', details: error.message });
+    }
+  });
+
+  app.get('/chromedebug/workflow-recordings',
+    authenticate,
+    authorize(PERMISSIONS.WORKFLOW_READ),
+    async (req, res) => {
+    try {
+      const result = await activeController.listWorkflowRecordings();
+      res.json(result);
+    } catch (error) {
+      console.error('Error listing workflow recordings:', error);
+      res.status(500).json({ error: 'Failed to list workflow recordings', details: error.message });
+    }
+  });
+
+  // New streaming upload endpoints for full data recording
+  app.post('/chromedebug/upload/batch',
+    authenticate,
+    securityLogger,
+    authorize(PERMISSIONS.FRAME_WRITE),
+    async (req, res) => {
+      try {
+        const recordingId = req.headers['x-recording-id'];
+        const batchId = req.headers['x-batch-id'];
+        const isCompressed = req.headers['x-compressed'] === 'true';
+        
+        let events;
+        
+        if (isCompressed && req.body) {
+          // Decompress binary data using pako
+          const pako = await import('pako');
+          const decompressed = pako.default.ungzip(req.body, { to: 'string' });
+          events = JSON.parse(decompressed);
+        } else if (req.body) {
+          // Parse JSON data
+          const data = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;
+          events = data.events || [];
+        } else {
+          return res.status(400).json({ error: 'No data provided' });
+        }
+        
+        console.log(`[Upload] Received batch ${batchId} for recording ${recordingId} with ${events.length} events`);
+        
+        // Ensure recording exists (auto-create if needed)
+        try {
+          const existingRecording = activeController.database.getRecording(recordingId);
+          if (!existingRecording) {
+            console.log(`[Upload] Auto-creating recording ${recordingId} for full data upload`);
+            activeController.database.storeRecording(recordingId, 'full_data_recording');
+          }
+        } catch (error) {
+          // Recording doesn't exist, create it
+          console.log(`[Upload] Auto-creating recording ${recordingId} for full data upload (error case)`);
+          activeController.database.storeRecording(recordingId, 'full_data_recording');
+        }
+        
+        // Process events based on type
+        for (const event of events) {
+          switch (event.type) {
+            case 'execution_trace':
+              await activeController.database.storeExecutionTrace(recordingId, event);
+              break;
+            case 'variable_state':
+              await activeController.database.storeVariableState(recordingId, event);
+              break;
+            case 'dom_mutation':
+              await activeController.database.storeDomMutation(recordingId, event);
+              break;
+            case 'network_request':
+              await activeController.database.storeNetworkRequest(recordingId, event);
+              break;
+            case 'performance_metric':
+              await activeController.database.storePerformanceMetric(recordingId, event);
+              break;
+            default:
+              console.warn(`[Upload] Unknown event type: ${event.type}`);
+          }
+        }
+        
+        res.json({ 
+          success: true, 
+          batchId, 
+          eventsProcessed: events.length 
+        });
+      } catch (error) {
+        console.error('[Upload] Error processing batch:', error);
+        res.status(500).json({ 
+          error: 'Failed to process batch', 
+          details: error.message 
+        });
+      }
+    }
+  );
+
+  // Specialized endpoints for specific data types
+  app.post('/chromedebug/upload/:dataType',
+    authenticate,
+    securityLogger,
+    authorize(PERMISSIONS.FRAME_WRITE),
+    async (req, res) => {
+      try {
+        const dataType = req.params.dataType;
+        const recordingId = req.headers['x-recording-id'];
+        const isCompressed = req.headers['x-compressed'] === 'true';
+        
+        let data;
+        
+        if (isCompressed && req.body) {
+          const pako = await import('pako');
+          const decompressed = pako.default.ungzip(req.body, { to: 'string' });
+          data = JSON.parse(decompressed);
+        } else {
+          data = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;
+        }
+        
+        console.log(`[Upload] Received ${dataType} data for recording ${recordingId}`);
+        
+        // Store data based on type
+        const storeMethod = `store${dataType.charAt(0).toUpperCase() + dataType.slice(1).replace(/-/g, '')}`;
+        if (typeof activeController.database[storeMethod] === 'function') {
+          await activeController.database[storeMethod](recordingId, data);
+          res.json({ success: true, dataType, recordingId });
+        } else {
+          res.status(400).json({ error: `Unknown data type: ${dataType}` });
+        }
+      } catch (error) {
+        console.error(`[Upload] Error processing ${req.params.dataType}:`, error);
+        res.status(500).json({ 
+          error: 'Failed to process data', 
+          details: error.message 
+        });
+      }
+    }
+  );
+
+  // Protected frame recording endpoints
+  app.post('/chromedebug/frame-batch',
+    authenticate,
+    securityLogger,
+    authorize(PERMISSIONS.FRAME_WRITE),
+    upload.none(),
+    async (req, res) => {
+    console.log('[FORMDATA-DEBUG] ==========================================');
+    console.log('[FORMDATA-DEBUG] Frame batch request received');
+    console.log('[FORMDATA-DEBUG] Content-Type:', req.headers['content-type']);
+    console.log('[FORMDATA-DEBUG] Request method:', req.method);
+    console.log('[FORMDATA-DEBUG] User:', req.user?.name || 'unknown');
+    console.log('[FORMDATA-DEBUG] Raw body keys:', Object.keys(req.body || {}));
+    console.log('[FORMDATA-DEBUG] Raw body:', req.body);
+    
+    // Handle both JSON and FormData
+    let sessionId, frames, sessionName;
+
+    if (req.headers['content-type']?.includes('application/json')) {
+      console.log('[FORMDATA-DEBUG] Processing as JSON request');
+      // JSON request - validate with schema
+      const { error, value } = frameBatchSchema.validate(req.body);
+      if (error) {
+        console.log('[FORMDATA-DEBUG] JSON validation failed:', error.details);
+        return res.status(400).json({
+          error: 'Validation failed',
+          details: error.details.map(detail => ({
+            field: detail.path.join('.'),
+            message: detail.message
+          }))
+        });
+      }
+      sessionId = value.sessionId;
+      frames = value.frames;
+      sessionName = value.sessionName || null;
+
+      console.log('[FORMDATA-DEBUG] JSON parsed successfully:', { sessionId, frameCount: frames?.length, sessionName });
+    } else {
+      console.log('[FORMDATA-DEBUG] Processing as FormData request');
+      
+      // FormData request - manual validation
+      sessionId = req.body.sessionId;
+      sessionName = req.body.sessionName || null;
+
+      console.log('[FORMDATA-DEBUG] SessionId from FormData:', sessionId);
+      console.log('[FORMDATA-DEBUG] SessionName from FormData:', sessionName);
+      console.log('[FORMDATA-DEBUG] Frames field type:', typeof req.body.frames);
+      console.log('[FORMDATA-DEBUG] Frames field length:', req.body.frames?.length);
+      console.log('[FORMDATA-DEBUG] Frames field preview:', req.body.frames?.substring(0, 200));
+      
+      try {
+        if (!req.body.frames) {
+          console.log('[FORMDATA-DEBUG] ❌ No frames field in FormData');
+          frames = null;
+        } else {
+          console.log('[FORMDATA-DEBUG] 🔄 Attempting to parse frames JSON...');
+          frames = JSON.parse(req.body.frames);
+          console.log('[FORMDATA-DEBUG] ✅ Frames JSON parsed successfully');
+          console.log('[FORMDATA-DEBUG] Parsed frames count:', frames?.length);
+          console.log('[FORMDATA-DEBUG] First frame structure:', frames?.[0] ? Object.keys(frames[0]) : 'no frames');
+        }
+        
+        console.log('[FORMDATA-DEBUG] 🔄 Validating parsed FormData...');
+        // Validate the parsed data
+        const { error, value } = frameBatchSchema.validate({ sessionId, frames, sessionName });
+        if (error) {
+          console.log('[FORMDATA-DEBUG] ❌ FormData validation failed:', error.details);
+          return res.status(400).json({
+            error: 'Validation failed',
+            details: error.details.map(detail => ({
+              field: detail.path.join('.'),
+              message: detail.message
+            }))
+          });
+        }
+        sessionId = value.sessionId;
+        frames = value.frames;
+        sessionName = value.sessionName;
+
+        console.log('[FORMDATA-DEBUG] ✅ FormData validation successful');
+      } catch (parseError) {
+        console.error('[FORMDATA-DEBUG] ❌ Failed to parse frames JSON:', parseError);
+        console.error('[FORMDATA-DEBUG] Raw frames data:', req.body.frames);
+        return res.status(400).json({ error: 'Invalid frames JSON format' });
+      }
+    }
+    
+    if (!sessionId || !frames) {
+      console.log('[FORMDATA-DEBUG] ❌ Missing required data');
+      console.log('[FORMDATA-DEBUG] SessionId:', sessionId);
+      console.log('[FORMDATA-DEBUG] Frames:', frames ? 'present' : 'null');
+      return res.status(400).json({ error: 'sessionId and frames are required' });
+    }
+    
+    console.log('[FORMDATA-DEBUG] ✅ All data validated, proceeding to storage');
+    console.log('[FORMDATA-DEBUG] Session ID:', sessionId);
+    console.log('[FORMDATA-DEBUG] Frame count:', frames?.length);
+    
+    try {
+      console.log('[FORMDATA-DEBUG] 🔄 Calling activeController.storeFrameBatch...');
+      if (frames && frames.length > 0) {
+        console.log('[FORMDATA-DEBUG] First frame structure:', Object.keys(frames[0]));
+        console.log('[FORMDATA-DEBUG] First frame has imageData:', !!frames[0].imageData);
+        console.log('[FORMDATA-DEBUG] ImageData length:', frames[0].imageData ? frames[0].imageData.length : 'N/A');
+      }
+
+      console.log('[FORMDATA-DEBUG] Session name:', sessionName || 'none');
+
+      const result = await activeController.storeFrameBatch(sessionId, frames, sessionName);
+      console.log('[FORMDATA-DEBUG] ✅ Frame batch storage result:', result);
+
+      console.log('[FORMDATA-DEBUG] Result recording ID:', result?.id);
+      console.log('[FORMDATA-DEBUG] Result frame count:', result?.total_frames);
+      console.log('[FORMDATA-DEBUG] ==========================================');
+
+      res.json(result);
+    } catch (error) {
+      console.error('[FORMDATA-DEBUG] ❌ Storage error:', error);
+      console.error('[FORMDATA-DEBUG] Error stack:', error.stack);
+      console.log('[FORMDATA-DEBUG] ==========================================');
+      res.status(500).json({ error: 'Failed to store frame batch', details: error.message });
+    }
+  });
+
+  app.get('/chromedebug/frame-session/:sessionId',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_READ),
+    createValidator(sessionIdParam, 'params'),
+    async (req, res) => {
+    const { sessionId } = req.params;
+    try {
+      const result = await activeController.getFrameSession(sessionId);
+      if (!result) {
+        return res.status(404).json({ error: 'Frame session not found' });
+      }
+
+      // Debug: Verify logs are properly included and formatted
+      if (result.frames?.length > 0 && result.frames[0]?.logs?.length > 0) {
+        console.log(`[INFO] Frame session ${sessionId}: Loaded ${result.frames.length} frames with console logs`);
+      }
+
+      res.json(result);
+    } catch (error) {
+      console.error('Error retrieving frame session:', error);
+      res.status(500).json({ error: 'Failed to retrieve frame session', details: error.message });
+    }
+  });
+
+  /*
+   * SNAPSHOT FEATURE DISABLED (2025-10-01)
+   *
+   * Snapshots endpoint disabled - see SNAPSHOT_FEATURE_DISABLED.md
+   *
+   * WHY DISABLED:
+   * - Snapshots without console logs are just screenshots (users can do this natively)
+   * - Console log capture requires always-on monitoring (privacy concern)
+   * - Core value proposition (screenshot + searchable logs) cannot be achieved cleanly
+   *
+   * TO RE-ENABLE:
+   * 1. Implement privacy-conscious always-on log monitoring
+   * 2. Uncomment this endpoint
+   * 3. Re-enable chrome-controller.js getSnapshots() method
+   * 4. Re-enable extension UI and handlers
+   */
+  /*
+  app.get('/chromedebug/snapshots',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_READ),
+    async (req, res) => {
+    try {
+      const limit = parseInt(req.query.limit) || 50;
+      const snapshots = await activeController.getSnapshots(limit);
+
+      res.json({
+        snapshots: snapshots || [],
+        count: snapshots ? snapshots.length : 0,
+        limit: limit
+      });
+    } catch (error) {
+      console.error('Error retrieving snapshots:', error);
+      res.status(500).json({ error: 'Failed to retrieve snapshots', details: error.message });
+    }
+  });
+  */
+
+  app.post('/chromedebug/associate-logs',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_WRITE),
+    upload.none(),
+    async (req, res) => {
+    // Handle both JSON and FormData
+    let sessionId, logs;
+    
+    if (req.headers['content-type']?.includes('application/json')) {
+      // JSON request - transform logs to match schema format first
+      const transformedBody = transformAssociateLogsRequest(req.body);
+
+      // Log transformation diagnostics for debugging
+      if (req.body.logs) {
+        const compliance = analyzeLogFieldCompliance(req.body.logs);
+        if (!compliance.isCompliant) {
+          console.log('[LogTransform] Applied field filtering:', {
+            originalLogs: req.body.logs.length,
+            nonSchemaFields: compliance.nonSchemaFields,
+            missingFields: compliance.missingRequiredFields
+          });
+        }
+      }
+
+      // Validate transformed data with schema
+      const { error, value } = associateLogsSchema.validate(transformedBody);
+      if (error) {
+        return res.status(400).json({
+          error: 'Validation failed',
+          details: error.details.map(detail => ({
+            field: detail.path.join('.'),
+            message: detail.message
+          }))
+        });
+      }
+      sessionId = value.sessionId;
+      logs = value.logs;
+    } else {
+      // FormData request
+      sessionId = req.body.sessionId;
+      try {
+        logs = req.body.logs ? JSON.parse(req.body.logs) : null;
+        
+        // Transform logs to match schema format first
+        const requestData = { sessionId, logs };
+        const transformedData = transformAssociateLogsRequest(requestData);
+
+        // Log transformation diagnostics for debugging
+        if (logs) {
+          const compliance = analyzeLogFieldCompliance(logs);
+          if (!compliance.isCompliant) {
+            console.log('[LogTransform] Applied field filtering (FormData):', {
+              originalLogs: logs.length,
+              nonSchemaFields: compliance.nonSchemaFields,
+              missingFields: compliance.missingRequiredFields
+            });
+          }
+        }
+
+        // Validate the transformed data
+        const { error, value } = associateLogsSchema.validate(transformedData);
+        if (error) {
+          return res.status(400).json({
+            error: 'Validation failed',
+            details: error.details.map(detail => ({
+              field: detail.path.join('.'),
+              message: detail.message
+            }))
+          });
+        }
+        sessionId = value.sessionId;
+        logs = value.logs;
+      } catch (parseError) {
+        return res.status(400).json({ error: 'Invalid logs JSON format' });
+      }
+    }
+    
+    if (!sessionId || !logs) {
+      return res.status(400).json({ error: 'sessionId and logs are required' });
+    }
+    
+    try {
+      const result = await activeController.associateLogsWithFrames(sessionId, logs);
+      res.json(result);
+    } catch (error) {
+      console.error('Error associating logs with frames:', error);
+      res.status(500).json({ error: 'Failed to associate logs', details: error.message });
+    }
+  });
+
+  // Stream logs endpoint for real-time batched log streaming
+  app.post('/chromedebug/logs/stream',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_WRITE),
+    upload.none(),
+    async (req, res) => {
+    // Handle both JSON and FormData
+    let sessionId, logs;
+    
+    if (req.headers['content-type']?.includes('application/json')) {
+      // JSON request - validate with schema
+      const { error, value } = streamLogsSchema.validate(req.body);
+      if (error) {
+        return res.status(400).json({
+          error: 'Validation failed',
+          details: error.details.map(detail => ({
+            field: detail.path.join('.'),
+            message: detail.message
+          }))
+        });
+      }
+      sessionId = value.sessionId;
+      logs = value.logs;
+    } else {
+      // FormData request
+      sessionId = req.body.sessionId;
+      try {
+        logs = req.body.logs ? JSON.parse(req.body.logs) : null;
+        
+        // Validate the parsed data
+        const { error, value } = streamLogsSchema.validate({ sessionId, logs });
+        if (error) {
+          return res.status(400).json({
+            error: 'Validation failed',
+            details: error.details.map(detail => ({
+              field: detail.path.join('.'),
+              message: detail.message
+            }))
+          });
+        }
+        sessionId = value.sessionId;
+        logs = value.logs;
+      } catch (parseError) {
+        return res.status(400).json({ error: 'Invalid logs JSON format' });
+      }
+    }
+    
+    if (!sessionId || !logs) {
+      return res.status(400).json({ error: 'sessionId and logs are required' });
+    }
+    
+    try {
+      const result = await activeController.streamLogsToFrames(sessionId, logs);
+      res.json(result);
+    } catch (error) {
+      console.error('Error streaming logs to frames:', error);
+      res.status(500).json({ error: 'Failed to stream logs', details: error.message });
+    }
+  });
+
+  // DOM intent endpoint for Chrome extension element selection
+  app.post('/chromedebug/dom-intent',
+    authenticate,
+    authorize(PERMISSIONS.CHROME_CONTROL),
+    createValidator(domIntentSchema),
+    async (req, res) => {
+    try {
+      const { selector, instruction, elementInfo } = req.body;
+      
+      if (!selector) {
+        return res.status(400).json({ error: 'Selector is required' });
+      }
+      
+      // Store the selected element info
+      lastSelectedElement = {
+        selector,
+        instruction: instruction || '',
+        elementInfo: elementInfo || {}
+      };
+      
+      // If Chrome is connected, forward to Chrome controller
+      const status = await activeController.getConnectionStatus();
+      if (status.connected) {
+        await activeController.selectElement(selector, instruction, elementInfo);
+      }
+      
+      // Notify WebSocket clients about the selection
+      const wsMessage = JSON.stringify({
+        type: 'element_selected',
+        data: lastSelectedElement
+      });
+      
+      wsClients.forEach(client => {
+        if (client.readyState === 1) { // OPEN state
+          client.send(wsMessage);
+        }
+      });
+      
+      res.json({ 
+        success: true,
+        message: 'Element selection received',
+        selector,
+        chromeConnected: status.connected
+      });
+    } catch (error) {
+      console.error('Error handling DOM intent:', error);
+      res.status(500).json({ 
+        error: 'Failed to process DOM intent',
+        details: error.message 
+      });
+    }
+  });
+
+
+  // Protected Chrome control endpoints
+  app.post('/chromedebug/launch',
+    authenticate,
+    authorize(PERMISSIONS.CHROME_CONTROL),
+    async (req, res) => {
+    try {
+      const result = await activeController.launch();
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  app.post('/chromedebug/navigate',
+    authenticate,
+    authorize(PERMISSIONS.CHROME_CONTROL),
+    createValidator(navigateSchema),
+    async (req, res) => {
+    try {
+      const { url } = req.body;
+      const result = await activeController.navigateTo(url);
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  app.get('/chromedebug/screenshot',
+    authenticate,
+    authorize(PERMISSIONS.CHROME_CONTROL),
+    async (req, res) => {
+    try {
+      const result = await activeController.takeScreenshot();
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  app.get('/chromedebug/page-content',
+    authenticate,
+    authorize(PERMISSIONS.CHROME_CONTROL),
+    createValidator(pageContentQuery, 'query'),
+    async (req, res) => {
+    try {
+      // Extract query parameters for options
+      const options = {
+        includeText: req.query.includeText !== 'false',
+        includeHtml: req.query.includeHtml === 'true',
+        includeStructure: req.query.includeStructure !== 'false'
+      };
+      
+      const result = await activeController.getPageContent(options);
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  app.post('/chromedebug/evaluate',
+    authenticate,
+    authorize(PERMISSIONS.CHROME_CONTROL),
+    createValidator(evaluateSchema),
+    async (req, res) => {
+    try {
+      const { expression } = req.body;
+      const result = await activeController.evaluateExpression(expression);
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  // Kept for backward compatibility
+  app.get('/chromedebug/frame-session-info/:sessionId',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_READ),
+    createValidator(sessionIdParam, 'params'),
+    async (req, res) => {
+    try {
+      const result = await activeController.getFrameSessionInfo(req.params.sessionId);
+      if (!result) {
+        return res.status(404).json({ error: 'Frame session not found' });
+      }
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  app.get('/chromedebug/frame-sessions',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_READ),
+    async (req, res) => {
+    try {
+      const result = await activeController.listFrameSessions();
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  app.get('/chromedebug/frame/:sessionId/:frameIndex',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_READ),
+    createValidator(frameParams, 'params'),
+    async (req, res) => {
+    try {
+      const { sessionId, frameIndex } = req.params;
+      const result = await activeController.getFrame(sessionId, parseInt(frameIndex));
+      if (!result) {
+        return res.status(404).json({ error: 'Frame not found' });
+      }
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  // Get frame screenshot
+  app.get('/chromedebug/frame-screenshot/:sessionId/:frameIndex',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_READ),
+    createValidator(frameParams, 'params'),
+    async (req, res) => {
+    try {
+      const { sessionId, frameIndex } = req.params;
+      const includeMetadata = req.query.includeMetadata === 'true';
+
+      const result = await activeController.getFrameScreenshot(sessionId, parseInt(frameIndex), includeMetadata);
+      if (!result) {
+        return res.status(404).json({ error: 'Frame screenshot not found' });
+      }
+
+      // Add cache headers for browser optimization
+      res.set({
+        'Cache-Control': 'public, max-age=3600',
+        'Content-Type': 'application/json'
+      });
+
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  // Search frame logs
+  app.get('/chromedebug/frame-logs/search/:sessionId',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_READ),
+    createValidator(sessionIdParam, 'params'),
+    async (req, res) => {
+    try {
+      const { sessionId } = req.params;
+      const { searchText, logLevel = 'all', maxResults = 50 } = req.query;
+      
+      if (!searchText) {
+        return res.status(400).json({ error: 'searchText query parameter is required' });
+      }
+      
+      const result = await activeController.searchFrameLogs(
+        sessionId,
+        searchText,
+        logLevel,
+        parseInt(maxResults)
+      );
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  // Get frame logs paginated
+  app.get('/chromedebug/frame-logs/:sessionId/:frameIndex',
+    authenticate,
+    authorize(PERMISSIONS.FRAME_READ),
+    createValidator(frameParams, 'params'),
+    async (req, res) => {
+    try {
+      const { sessionId, frameIndex } = req.params;
+      const { 
+        offset = 0, 
+        limit = 100, 
+        logLevel = 'all', 
+        searchText 
+      } = req.query;
+      
+      const result = await activeController.getFrameLogsPaginated(
+        sessionId,
+        parseInt(frameIndex),
+        parseInt(offset),
+        parseInt(limit),
+        logLevel,
+        searchText
+      );
+      res.json(result);
+    } catch (error) {
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+
+  app.delete('/chromedebug/recording/:recordingId',
+    authenticate,
+    authorize(PERMISSIONS.WORKFLOW_DELETE),
+    createValidator(recordingIdParam, 'params'),
+    async (req, res) => {
+    try {
+      const { recordingId } = req.params;
+      const result = await activeController.deleteRecording(recordingId);
+      
+      if (result.success) {
+        res.json(result);
+      } else {
+        res.status(404).json(result);
+      }
+    } catch (error) {
+      console.error('Error deleting recording:', error);
+      res.status(500).json({ error: 'Failed to delete recording', details: error.message });
+    }
+  });
+
+  app.delete('/chromedebug/workflow-recording/:recordingId',
+    authenticate,
+    authorize(PERMISSIONS.WORKFLOW_DELETE),
+    createValidator(recordingIdParam, 'params'),
+    async (req, res) => {
+    try {
+      const { recordingId } = req.params;
+      const result = await activeController.deleteWorkflowRecording(recordingId);
+      
+      if (result.success) {
+        res.json(result);
+      } else {
+        res.status(404).json(result);
+      }
+    } catch (error) {
+      console.error('Error deleting workflow recording:', error);
+      res.status(500).json({ error: 'Failed to delete workflow recording', details: error.message });
+    }
+  });
+
+  // Save screen interactions for a recording
+  app.post('/chromedebug/screen-interactions/:sessionId',
+    authenticate,
+    authorize(PERMISSIONS.WORKFLOW_WRITE),
+    createValidator(sessionIdParam, 'params'),
+    createValidator(screenInteractionsSchema),
+    async (req, res) => {
+    const { sessionId } = req.params;
+    const { interactions } = req.body;
+
+    // Debug logging to identify validation issues
+    console.log('[SCREEN-INTERACTIONS-DEBUG] ==========================================');
+    console.log('[SCREEN-INTERACTIONS-DEBUG] Request received for session:', sessionId);
+    console.log('[SCREEN-INTERACTIONS-DEBUG] Content-Type:', req.get('content-type'));
+    console.log('[SCREEN-INTERACTIONS-DEBUG] User agent:', req.get('user-agent'));
+    console.log('[SCREEN-INTERACTIONS-DEBUG] Auth user:', req.user?.name || 'unknown');
+    console.log('[SCREEN-INTERACTIONS-DEBUG] Request body keys:', Object.keys(req.body || {}));
+    console.log('[SCREEN-INTERACTIONS-DEBUG] Interactions field present:', !!interactions);
+    console.log('[SCREEN-INTERACTIONS-DEBUG] Interactions type:', typeof interactions);
+    console.log('[SCREEN-INTERACTIONS-DEBUG] Interactions length:', Array.isArray(interactions) ? interactions.length : 'N/A');
+    if (Array.isArray(interactions) && interactions.length > 0) {
+      console.log('[SCREEN-INTERACTIONS-DEBUG] First interaction:', JSON.stringify(interactions[0], null, 2));
+    }
+    console.log('[SCREEN-INTERACTIONS-DEBUG] Raw body:', JSON.stringify(req.body, null, 2));
+    console.log('[SCREEN-INTERACTIONS-DEBUG] ==========================================');
+
+    try {
+      const { database } = await import('./database.js');
+      const result = database.storeScreenInteractions(sessionId, interactions);
+      
+      if (result.success) {
+        console.log(`[HTTP] Stored ${result.count} screen interactions for recording ${sessionId}`);
+        res.json({ success: true, count: result.count });
+      } else {
+        res.status(500).json({ success: false, error: result.error });
+      }
+    } catch (error) {
+      console.error('Error storing screen interactions:', error);
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  // TEMPORARY DEBUG: Test authentication bypass and see raw data
+  app.post('/chromedebug/debug-interactions/:sessionId',
+    authenticate,
+    (req, res) => {
+      console.log('[DEBUG-ENDPOINT] ==========================================');
+      console.log('[DEBUG-ENDPOINT] Auth bypass test successful!');
+      console.log('[DEBUG-ENDPOINT] User:', JSON.stringify(req.user, null, 2));
+      console.log('[DEBUG-ENDPOINT] Session ID:', req.params.sessionId);
+      console.log('[DEBUG-ENDPOINT] Content-Type:', req.get('content-type'));
+      console.log('[DEBUG-ENDPOINT] Request headers:', Object.keys(req.headers));
+      console.log('[DEBUG-ENDPOINT] Request body:', JSON.stringify(req.body, null, 2));
+      console.log('[DEBUG-ENDPOINT] ==========================================');
+
+      res.json({
+        debug: true,
+        message: 'Debug endpoint working',
+        user: req.user,
+        received: req.body,
+        sessionId: req.params.sessionId
+      });
+    }
+  );
+
+  // Get screen interactions for a recording
+  app.get('/chromedebug/screen-interactions/:sessionId',
+    authenticate,
+    authorize(PERMISSIONS.WORKFLOW_READ),
+    createValidator(sessionIdParam, 'params'),
+    async (req, res) => {
+    const { sessionId } = req.params;
+
+    try {
+      const { database } = await import('./database.js');
+      const interactions = database.getScreenInteractions(sessionId);
+      res.json({ interactions });
+    } catch (error) {
+      console.error('Error retrieving screen interactions:', error);
+      res.status(500).json({ error: error.message });
+    }
+  });
+
+  // License Management Endpoints
+
+  // Validate license key
+  app.post('/chromedebug/license/validate',
+    async (req, res) => {
+    try {
+      const { licenseKey } = req.body;
+
+      if (!licenseKey) {
+        return res.status(400).json({ error: 'License key required' });
+      }
+
+      const licenseManager = getLicenseManager();
+      const result = await licenseManager.validateLicense(licenseKey);
+
+      res.json(result);
+    } catch (error) {
+      console.error('License validation error:', error);
+      res.status(500).json({ error: 'License validation failed' });
+    }
+  });
+
+  // Check usage limit
+  app.post('/chromedebug/license/check-usage',
+    authenticate,
+    async (req, res) => {
+    try {
+      const userId = req.user.id;
+
+      const licenseManager = getLicenseManager();
+      const result = await licenseManager.checkUsageLimit(userId);
+
+      res.json(result);
+    } catch (error) {
+      console.error('Usage check error:', error);
+      res.status(500).json({ error: 'Usage check failed' });
+    }
+  });
+
+  // Increment usage
+  app.post('/chromedebug/license/increment-usage',
+    authenticate,
+    async (req, res) => {
+    try {
+      const userId = req.user.id;
+      const { count = 1 } = req.body;
+
+      const licenseManager = getLicenseManager();
+      const result = await licenseManager.incrementUsage(userId, count);
+
+      res.json(result);
+    } catch (error) {
+      console.error('Usage increment error:', error);
+      res.status(500).json({ error: 'Usage increment failed' });
+    }
+  });
+
+  // Get user license info
+  app.get('/chromedebug/license/info',
+    authenticate,
+    async (req, res) => {
+    try {
+      const userId = req.user.id;
+
+      const licenseManager = getLicenseManager();
+      const result = await licenseManager.getUserLicense(userId);
+
+      res.json(result);
+    } catch (error) {
+      console.error('License info error:', error);
+      res.status(500).json({ error: 'Failed to get license info' });
+    }
+  });
+
+  // List active instances
+  app.get('/chromedebug/license/instances',
+    authenticate,
+    async (req, res) => {
+    try {
+      const { licenseKey } = req.query;
+
+      if (!licenseKey) {
+        return res.status(400).json({ error: 'License key required' });
+      }
+
+      const licenseManager = getLicenseManager();
+      const instances = await licenseManager.listInstances(licenseKey);
+
+      res.json({ instances });
+    } catch (error) {
+      console.error('List instances error:', error);
+      res.status(500).json({ error: 'Failed to list instances' });
+    }
+  });
+
+  // Deactivate instance
+  app.post('/chromedebug/license/deactivate-instance',
+    authenticate,
+    async (req, res) => {
+    try {
+      const { instanceId } = req.body;
+
+      if (!instanceId) {
+        return res.status(400).json({ error: 'Instance ID required' });
+      }
+
+      const licenseManager = getLicenseManager();
+      const result = await licenseManager.deactivateInstance(instanceId);
+
+      res.json(result);
+    } catch (error) {
+      console.error('Deactivate instance error:', error);
+      res.status(500).json({ error: 'Failed to deactivate instance' });
+    }
+  });
+
+  // Get cache status
+  app.get('/chromedebug/license/cache-status',
+    authenticate,
+    async (req, res) => {
+    try {
+      const licenseManager = getLicenseManager();
+      const status = licenseManager.getCacheStatus();
+
+      res.json(status);
+    } catch (error) {
+      console.error('Cache status error:', error);
+      res.status(500).json({ error: 'Failed to get cache status' });
+    }
+  });
+
+  // Clear license cache
+  app.post('/chromedebug/license/clear-cache',
+    authenticate,
+    async (req, res) => {
+    try {
+      const licenseManager = getLicenseManager();
+      licenseManager.clearCache();
+
+      res.json({ success: true, message: 'License cache cleared' });
+    } catch (error) {
+      console.error('Clear cache error:', error);
+      res.status(500).json({ error: 'Failed to clear cache' });
+    }
+  });
+
+  // Add a catch-all route for debugging
+  app.use('*', (req, res, next) => {
+    console.log(`[HTTP] ${req.method} ${req.originalUrl}`);
+    next();
+  });
+
+  // Security error handler
+  app.use(securityErrorHandler);
+  
+  // 404 handler - must be last
+  app.use((req, res) => {
+    console.log(`[HTTP] 404 - Route not found: ${req.method} ${req.originalUrl}`);
+    res.status(404).json({ 
+      success: false, 
+      error: 'Endpoint not found',
+      availableEndpoints: [
+        'GET /chromedebug/status',
+        'GET /chromedebug/port',
+        'POST /chromedebug/workflow-recording',
+        'GET /chromedebug/workflow-recordings',
+        'POST /chromedebug/frame-batch',
+        'POST /chromedebug/dom-intent',
+        'POST /chromedebug/launch',
+        'POST /chromedebug/navigate',
+        'GET /chromedebug/screenshot',
+        'GET /chromedebug/page-content',
+        'POST /chromedebug/evaluate'
+      ]
+    });
+  });
+
+  // Start server with port finding
+  let server;
+  let actualPort;
+  let portsToTry;
+
+  if (targetPort) {
+    // Use the target port provided by session manager
+    portsToTry = [targetPort];
+    console.log(`Attempting to start HTTP server on session manager allocated port: ${targetPort}`);
+  } else {
+    // Fall back to configured ports
+    const configuredPorts = configLoader.getHttpServerPorts();
+    const startPort = process.env.PORT ? parseInt(process.env.PORT) : configuredPorts[0];
+
+    // If PORT env var is set, try it first, then fall back to configured ports
+    portsToTry = process.env.PORT
+      ? [startPort, ...configuredPorts.filter(p => p !== startPort)]
+      : configuredPorts;
+
+    console.log('Attempting to start HTTP server on configured ports:', portsToTry);
+  }
+  
+  // Try configured ports in order
+  for (const port of portsToTry) {
+    try {
+      await new Promise((resolve, reject) => {
+        server = app.listen(port, () => {
+          actualPort = port;
+          console.error(`HTTP server listening on port ${actualPort}`);
+          resolve();
+        }).on('error', reject);
+      });
+      break;
+    } catch (error) {
+      if (error.code === 'EADDRINUSE') {
+        console.error(`Port ${port} is in use, trying next...`);
+        continue;
+      }
+      throw error;
+    }
+  }
+  
+  if (!server || !actualPort) {
+    console.error('ERROR: All configured ports are in use:', portsToTry);
+    console.error('Please free up one of these ports or configure different ports');
+    throw new Error(`Could not find available port for HTTP server. All ports in use: ${portsToTry.join(', ')}`);
+  }
+  
+  console.log(`HTTP server started on port ${actualPort}`);
+  
+  // Write port file for discovery
+  writePortFile(actualPort);
+  
+  // Return backward-compatible object with both server and port
+  const result = {
+    httpServer: server,
+    serverPort: actualPort
+  };
+
+  // Make object coercible to number for backward compatibility  
+  result.valueOf = () => actualPort;
+  result.toString = () => String(actualPort);
+
+  return result;
+}
+
+// WebSocket server setup
+async function startWebSocketServer() {
+  const startPort = process.env.WS_PORT ? parseInt(process.env.WS_PORT) : 3001;
+  const wsPort = await findAvailablePort(startPort);
+  
+  const wss = new WebSocketServer({ port: wsPort });
+  
+  wss.on('connection', async (ws) => {
+    console.error(`WebSocket client connected`);
+    wsClients.add(ws);
+    
+    // Send initial status
+    const status = await activeController.getConnectionStatus();
+    ws.send(JSON.stringify({
+      type: 'status',
+      data: status
+    }));
+    
+    ws.on('message', async (message) => {
+      try {
+        const msg = JSON.parse(message.toString());
+        
+        switch (msg.type) {
+          case 'element_selected':
+            // Store the selected element info from extension
+            lastSelectedElement = msg.data;
+            await activeController.selectElement(
+              msg.data.selector,
+              msg.data.instruction,
+              msg.data.elementInfo
+            );
+            
+            // Send confirmation
+            ws.send(JSON.stringify({
+              type: 'element_selection_confirmed',
+              data: { success: true }
+            }));
+            break;
+            
+          case 'get_status':
+            const status = await activeController.getConnectionStatus();
+            ws.send(JSON.stringify({
+              type: 'status',
+              data: status
+            }));
+            break;
+            
+          default:
+            console.error(`Unknown WebSocket message type: ${msg.type}`);
+        }
+      } catch (error) {
+        console.error('WebSocket message error:', error);
+        ws.send(JSON.stringify({
+          type: 'error',
+          data: { message: error.message }
+        }));
+      }
+    });
+    
+    ws.on('close', () => {
+      console.error('WebSocket client disconnected');
+      wsClients.delete(ws);
+    });
+    
+    ws.on('error', (error) => {
+      console.error('WebSocket error:', error);
+      wsClients.delete(ws);
+    });
+  });
+  
+  console.error(`WebSocket server listening on port ${wsPort}`);
+}
+
+// Export for use by MCP server
+export { startHttpServer, startWebSocketServer };
+
+// Only run main if this is the main module
+if (import.meta.url === `file://${process.argv[1]}`) {
+  async function main() {
+    // Register this process for safe tracking
+    setupProcessTracking('http-server');
+
+    // Start HTTP server for workflow recording endpoints
+    await startHttpServer();
+
+    // Start WebSocket server for Chrome extension
+    await startWebSocketServer();
+
+    console.error('ChromeDebug MCP HTTP server running with WebSocket support');
+  }
+
+  // Clean shutdown
+  const cleanup = async (signal) => {
+    console.error(`Received ${signal}, shutting down HTTP server...`);
+    await activeController.close();
+    process.exit(0);
+  };
+
+  process.on('SIGINT', () => cleanup('SIGINT'));
+  process.on('SIGTERM', () => cleanup('SIGTERM'));
+
+  main().catch(console.error);
+}