chrometools-mcp 3.2.6 → 3.2.10

package/CHANGELOG.md

@@ -2,6 +2,96 @@
 
 All notable changes to this project will be documented in this file.
 
+## [3.2.10] - 2026-01-29
+
+### Fixed
+- **Network request deduplication** — Fixed duplicate pending requests in diagnostics
+  - Prevented same requestId from being added multiple times during redirects/retries
+  - Added deduplication check in Network.requestWillBeSent event handler
+  - Updates existing request instead of creating duplicate entry
+  - Example: example.com showed 4 pending (2 URLs × 2 duplicates) → now shows 2 pending (correct count)
+- **Memory leak prevention** — Limited networkRequests array growth
+  - Keeps maximum 500 most recent network requests in memory
+  - Automatically removes oldest requests when limit exceeded
+  - Prevents unbounded memory growth during long browser sessions
+  - Example: After 100 page navigations, memory stays bounded
+
+## [3.2.9] - 2026-01-29
+
+### Added
+- **navigateTo diagnostics** — Post-navigation diagnostics for navigateTo tool
+  - Detects chrome-error:// pages (unreachable servers, DNS failures)
+  - Waits 20s for slow page loads and network requests
+  - Reports JS console errors and network errors after navigation
+  - Shows pending requests if page loads slowly
+  - Same comprehensive diagnostics as click tool
+  - Example: Navigate to offline backend → instant error report instead of silent failure
+- **openBrowser diagnostics** — Post-navigation diagnostics for openBrowser tool
+  - Same comprehensive diagnostics as navigateTo and click
+  - Critical for first action in session - shows errors immediately
+  - Detects chrome-error:// pages on initial load
+  - Reports network errors, console errors, pending requests
+  - Example: Open unreachable backend → instant error report with details
+
+### Changed
+- **Diagnostics naming** — Renamed for clarity and universal use
+  - "POST-CLICK DIAGNOSTICS" → "POST-ACTION DIAGNOSTICS"
+  - Function parameters: beforeClickTimestamp → beforeActionTimestamp
+  - Comments updated to reflect use in both click and navigate actions
+  - File remains post-click-diagnostics.js for backward compatibility
+
+## [3.2.8] - 2026-01-29
+
+### Changed
+- **Network wait timeout** — Increased from 5s to 20s for slow APIs
+  - Gives slow backend APIs time to complete before timeout
+  - AI gets complete success/error status instead of "pending unknown"
+  - Pending requests after 20s are reported with details (URL, method, runtime)
+  - Clear warning: "Status unknown - may complete successfully or fail"
+
+### Fixed
+- **Click timeout on network errors** — No more 30s timeout when backend unreachable
+  - Detects chrome-error:// pages (ERR_CONNECTION_REFUSED, DNS_PROBE_FINISHED_NXDOMAIN, etc.)
+  - Returns error details immediately after 500ms diagnostic wait
+  - Shows error code and suggestion: "Backend likely not running or unreachable"
+  - Reduces diagnosis from 3 API calls to 1
+  - Example: Form submits to localhost:8001 (not running) → instant error report instead of 30s timeout
+- **Network request tracking** — Now tracks ALL requests triggered by click, not just pending at 500ms
+  - Filters requests by timestamp (only those started AFTER click)
+  - Catches slow-starting requests that begin after initial 500ms wait
+  - Shows accurate count: completed/pending/total requests
+  - Prevents false "No network requests triggered" when requests start late
+- **Delayed error collection** — Errors from requests that complete during maxWait are now captured
+  - Added 100ms delay after network wait before collecting errors
+  - Catches errors from requests that finish right as timeout expires
+  - Network summary shows: "⚠️ Network: 2 OK, 1 failed" when errors present
+  - Ensures AI sees errors even if request completes at edge of timeout window
+- **Pending request reporting** — AI now sees details about slow/hanging requests
+  - Lists pending requests with URL, method, and elapsed time
+  - Suggests backend performance check or network connectivity issues
+  - Example: "POST /api/slow - Running for: 20145ms"
+
+## [3.2.7] - 2026-01-29
+
+### Added
+- **Post-click diagnostics** — Click tool now automatically detects and reports errors
+  - Waits 500ms after click to capture async events
+  - Detects pending network requests and waits for completion (up to 5s)
+  - Collects JavaScript console errors and network errors
+  - **Error limit**: Max 15 console errors + 15 network errors to prevent spam
+  - Shows omitted error count if limit exceeded
+  - Returns diagnostics in click response for immediate AI feedback
+  - Prevents AI from making blind follow-up requests when errors occur
+  - New module: `utils/post-click-diagnostics.js`
+
+### Changed
+- **Click behavior** — Enhanced UX for AI agents
+  - Click now includes network activity summary (requests completed, timing)
+  - Errors displayed immediately in click response
+  - AI can see what broke without additional tool calls
+  - Better error context: timestamp, location, status codes
+  - Smart error limiting prevents overwhelming AI with hundreds of errors
+
 ## [3.2.6] - 2026-01-28
 
 ### Removed

package/browser/page-manager.js

@@ -30,6 +30,21 @@ export const consoleLogs = [];
 // Network requests storage
 export const networkRequests = [];
 
+// Maximum number of network requests to keep in memory (prevent unbounded growth)
+const MAX_NETWORK_REQUESTS = 500;
+
+/**
+ * Clean old network requests to prevent memory leak
+ * Keeps only the most recent MAX_NETWORK_REQUESTS requests
+ */
+function cleanOldNetworkRequests() {
+  if (networkRequests.length > MAX_NETWORK_REQUESTS) {
+    // Remove oldest requests (keep most recent)
+    const removeCount = networkRequests.length - MAX_NETWORK_REQUESTS;
+    networkRequests.splice(0, removeCount);
+  }
+}
+
 // Page analysis cache
 export const pageAnalysisCache = new Map();
 
@@ -52,6 +67,19 @@ export async function setupNetworkMonitoring(page) {
 
   client.on('Network.requestWillBeSent', (event) => {
     const timestamp = new Date().toISOString();
+
+    // Check if request already exists (prevent duplicates from redirects/retries)
+    const existingReq = networkRequests.find(r => r.requestId === event.requestId);
+    if (existingReq) {
+      // Update existing request instead of creating duplicate
+      existingReq.url = event.request.url;
+      existingReq.method = event.request.method;
+      existingReq.headers = event.request.headers;
+      existingReq.postData = event.request.postData;
+      existingReq.timestamp = timestamp;
+      return;
+    }
+
     networkRequests.push({
       requestId: event.requestId,
       url: event.request.url,
@@ -64,6 +92,9 @@ export async function setupNetworkMonitoring(page) {
       status: 'pending',
       documentURL: event.documentURL
     });
+
+    // Clean old requests to prevent unbounded memory growth
+    cleanOldNetworkRequests();
   });
 
   client.on('Network.responseReceived', (event) => {

package/index.js

@@ -54,6 +54,8 @@ import {getToolsFromGroups, getAllGroupNames} from './server/tool-groups.js';
 import {executeElementAction} from './utils/element-actions.js';
 // Import hints generator
 import {generateClickHints, generateNavigationHints} from './utils/hints-generator.js';
+// Import post-click diagnostics
+import {runPostClickDiagnostics, formatDiagnosticsForAI} from './utils/post-click-diagnostics.js';
 
 // Import Recorder modules
 // Note: injectRecorder removed - now using Chrome Extension
@@ -313,12 +315,22 @@ async function executeToolInternal(name, args) {
 
     if (name === "openBrowser") {
       const validatedArgs = schemas.OpenBrowserSchema.parse(args);
+
+      // Capture timestamp BEFORE opening for diagnostics
+      const beforeOpenTimestamp = Date.now();
+
       const page = await getOrCreatePage(validatedArgs.url);
       const title = await page.title();
 
+      // Run post-navigation diagnostics (same as navigateTo)
+      const diagnostics = await runPostClickDiagnostics(page, beforeOpenTimestamp);
+
       // Generate AI hints
       const hints = await generateNavigationHints(page, validatedArgs.url);
 
+      // Format diagnostics for output
+      const diagnosticsText = formatDiagnosticsForAI(diagnostics);
+
       // Check if extension is connected
       const extensionConnected = isExtensionConnected();
       const usedExistingChrome = isConnectedToExistingChrome();
@@ -329,11 +341,20 @@ async function executeToolInternal(name, args) {
         extensionNote = `\n\n⚠️ EXTENSION NOT CONNECTED\nConnected to existing Chrome - extension needs manual installation.\n${instructions.installSteps.join('\n')}\n\nAlternative: ${instructions.alternativeFix}`;
       }
 
+      let hintsText = '\n\n** AI HINTS **';
+      hintsText += `\nPage type: ${hints.pageType}`;
+      if (hints.availableActions.length > 0) {
+        hintsText += `\nAvailable actions: ${hints.availableActions.join(', ')}`;
+      }
+      if (hints.suggestedNext.length > 0) {
+        hintsText += `\nSuggested next: ${hints.suggestedNext.join('; ')}`;
+      }
+
       return {
         content: [
           {
             type: "text",
-            text: `Browser opened successfully!\nURL: ${validatedArgs.url}\nPage title: ${title}\n\nBrowser remains open for interaction.\n\n** AI HINTS **\nPage type: ${hints.pageType}\nAvailable actions: ${hints.availableActions.join(', ')}\nSuggested next: ${hints.suggestedNext.join('; ')}${extensionNote}`,
+            text: `Browser opened successfully!\nURL: ${validatedArgs.url}\nPage title: ${title}\n\nBrowser remains open for interaction.${hintsText}${diagnosticsText}${extensionNote}`,
           },
         ],
       };
@@ -380,6 +401,9 @@ async function executeToolInternal(name, args) {
           throw new Error(`Element not found: ${identifier}`);
         }
 
+        // Capture timestamp BEFORE click for error filtering
+        const beforeClickTimestamp = Date.now();
+
         // Try multiple click methods for better reliability
         try {
           // Method 1: Puppeteer click (most reliable for most cases)
@@ -395,11 +419,15 @@ async function executeToolInternal(name, args) {
             await element.evaluate(el => el.click());
           }
         }
-        await new Promise(resolve => setTimeout(resolve, validatedArgs.waitAfter || 1500));
 
-        // Generate AI hints after click
+        // NEW POST-CLICK PATTERN:
+        // 1. Run post-click diagnostics (waits 500ms, checks pending requests, collects errors)
+        const diagnostics = await runPostClickDiagnostics(page, beforeClickTimestamp);
+
+        // 2. Generate AI hints after click
         const hints = await generateClickHints(page, identifier);
 
+        // 3. Format output with hints and diagnostics
         let hintsText = '\n\n** AI HINTS **';
         if (hints.modalOpened) hintsText += '\nModal opened - interact with it or close';
         if (hints.newElements.length > 0) {
@@ -409,8 +437,11 @@ async function executeToolInternal(name, args) {
           hintsText += `\nSuggested next: ${hints.suggestedNext.join('; ')}`;
         }
 
+        // 4. Add diagnostics to output
+        const diagnosticsText = formatDiagnosticsForAI(diagnostics);
+
         const content = [
-          { type: "text", text: `Clicked: ${identifier}${hintsText}` }
+          { type: "text", text: `Clicked: ${identifier}${hintsText}${diagnosticsText}` }
         ];
 
         // Only add screenshot if requested
@@ -1343,6 +1374,9 @@ async function executeToolInternal(name, args) {
         browserOpened = true;
       }
 
+      // Capture timestamp BEFORE navigation for diagnostics
+      const beforeNavTimestamp = Date.now();
+
       // Navigate to the new URL (skip if we just created page with this URL)
       if (!browserOpened) {
         await page.goto(validatedArgs.url, { waitUntil: validatedArgs.waitUntil || 'networkidle2' });
@@ -1350,17 +1384,32 @@ async function executeToolInternal(name, args) {
 
       const title = await page.title();
 
+      // Run post-navigation diagnostics (same as post-click)
+      const diagnostics = await runPostClickDiagnostics(page, beforeNavTimestamp);
+
       // Generate AI hints
       const hints = await generateNavigationHints(page, validatedArgs.url);
 
+      // Format diagnostics for output
+      const diagnosticsText = formatDiagnosticsForAI(diagnostics);
+
       const message = browserOpened
         ? `Browser opened and navigated to: ${validatedArgs.url}`
         : `Navigated to: ${validatedArgs.url}`;
 
+      let hintsText = '\n\n** AI HINTS **';
+      hintsText += `\nPage type: ${hints.pageType}`;
+      if (hints.availableActions.length > 0) {
+        hintsText += `\nAvailable actions: ${hints.availableActions.join(', ')}`;
+      }
+      if (hints.suggestedNext.length > 0) {
+        hintsText += `\nSuggested next: ${hints.suggestedNext.join('; ')}`;
+      }
+
       return {
         content: [{
           type: "text",
-          text: `${message}\nPage title: ${title}\n\n** AI HINTS **\nPage type: ${hints.pageType}\nAvailable actions: ${hints.availableActions.join(', ')}\nSuggested next: ${hints.suggestedNext.join('; ')}`
+          text: `${message}\nPage title: ${title}${hintsText}${diagnosticsText}`
         }],
       };
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chrometools-mcp",
-  "version": "3.2.6",
+  "version": "3.2.10",
   "description": "MCP (Model Context Protocol) server for Chrome automation using Puppeteer. Persistent browser sessions, UI framework detection (MUI, Ant Design, etc.), Page Object support, visual testing, Figma comparison. Works seamlessly in WSL, Linux, macOS, and Windows.",
   "type": "module",
   "main": "index.js",

package/utils/post-click-diagnostics.js

@@ -0,0 +1,277 @@
+/**
+ * Post-Action Diagnostics
+ * Collects errors and waits for network requests after user actions (click, navigation, etc.)
+ */
+
+import { consoleLogs, networkRequests } from '../browser/page-manager.js';
+
+/**
+ * Wait for pending network requests to complete
+ * @param {number} beforeActionTimestamp - Timestamp before action to track new requests
+ * @param {number} initialWaitMs - Initial wait time before checking (default: 500ms)
+ * @param {number} maxWaitMs - Maximum time to wait for requests (default: 5000ms)
+ * @returns {Promise<{pendingFound: boolean, waitedMs: number, completedRequests: number, totalRequests: number}>}
+ */
+export async function waitForPendingRequests(beforeActionTimestamp, initialWaitMs = 500, maxWaitMs = 5000) {
+  const startTime = Date.now();
+
+  // Step 1: Wait initial period to let requests start
+  await new Promise(resolve => setTimeout(resolve, initialWaitMs));
+
+  // Step 2: Get requests that started AFTER action
+  const getPostActionRequests = () => {
+    const cutoffDate = new Date(beforeActionTimestamp).toISOString();
+    return networkRequests.filter(req => req.timestamp >= cutoffDate);
+  };
+
+  // Step 3: Check for pending requests (from post-action requests)
+  const checkPending = () => {
+    return getPostActionRequests().filter(req => req.status === 'pending');
+  };
+
+  let pending = checkPending();
+  let allPostActionRequests = getPostActionRequests();
+  const initialPendingCount = pending.length;
+
+  // Step 4: If there are pending requests OR new requests appeared, wait for completion
+  if (pending.length > 0 || allPostActionRequests.length > 0) {
+    // Wait for pending requests to complete (with timeout)
+    while (pending.length > 0 && (Date.now() - startTime) < maxWaitMs) {
+      await new Promise(resolve => setTimeout(resolve, 100)); // Check every 100ms
+      pending = checkPending();
+      allPostActionRequests = getPostActionRequests(); // Update total count
+    }
+  }
+
+  const finalRequests = getPostActionRequests();
+  const completedRequests = finalRequests.filter(req => req.status === 'completed' || (typeof req.status === 'number'));
+  const pendingRequests = pending.map(req => ({
+    url: req.url,
+    method: req.method,
+    timestamp: req.timestamp
+  }));
+
+  return {
+    pendingFound: initialPendingCount > 0,
+    waitedMs: Date.now() - startTime,
+    completedRequests: completedRequests.length,
+    stillPending: pending.length,
+    pendingRequests: pendingRequests,
+    totalRequests: finalRequests.length
+  };
+}
+
+/**
+ * Collect errors from console logs and network requests
+ * @param {number} sinceTimestamp - Only collect errors after this timestamp (default: collect recent errors)
+ * @param {number} maxConsoleErrors - Maximum console errors to return (default: 15)
+ * @param {number} maxNetworkErrors - Maximum network errors to return (default: 15)
+ * @returns {Object} Object with consoleErrors and networkErrors arrays
+ */
+export function collectErrors(sinceTimestamp = null, maxConsoleErrors = 15, maxNetworkErrors = 15) {
+  const errors = {
+    consoleErrors: [],
+    networkErrors: [],
+    jsExceptions: [],
+    consoleErrorsOmitted: 0,
+    networkErrorsOmitted: 0
+  };
+
+  // If no timestamp provided, look back 10 seconds
+  const cutoffTime = sinceTimestamp || (Date.now() - 10000);
+  const cutoffDate = new Date(cutoffTime).toISOString();
+
+  // Collect console errors (with limit)
+  let consoleErrorCount = 0;
+  consoleLogs.forEach(log => {
+    if (log.type === 'error') {
+      // Check if error is recent
+      const logTime = new Date(log.timestamp || 0).toISOString();
+      if (!sinceTimestamp || logTime >= cutoffDate) {
+        if (consoleErrorCount < maxConsoleErrors) {
+          errors.consoleErrors.push({
+            message: log.text,
+            timestamp: log.timestamp,
+            location: log.location || 'unknown'
+          });
+        } else {
+          errors.consoleErrorsOmitted++;
+        }
+        consoleErrorCount++;
+      }
+    }
+  });
+
+  // Collect network errors (failed requests, with limit)
+  let networkErrorCount = 0;
+  networkRequests.forEach(req => {
+    if (req.status === 'failed' || (typeof req.status === 'number' && req.status >= 400)) {
+      // Check if error is recent
+      const reqTime = req.timestamp;
+      if (!sinceTimestamp || reqTime >= cutoffDate) {
+        if (networkErrorCount < maxNetworkErrors) {
+          errors.networkErrors.push({
+            url: req.url,
+            method: req.method,
+            status: req.status,
+            statusText: req.statusText,
+            errorText: req.errorText,
+            timestamp: req.timestamp
+          });
+        } else {
+          errors.networkErrorsOmitted++;
+        }
+        networkErrorCount++;
+      }
+    }
+  });
+
+  return errors;
+}
+
+/**
+ * Full post-action diagnostics: wait for requests and collect errors
+ * @param {Page} page - Puppeteer page instance
+ * @param {number} beforeActionTimestamp - Timestamp before action (to filter errors)
+ * @returns {Promise<Object>} Diagnostics result with errors and network info
+ */
+export async function runPostClickDiagnostics(page, beforeActionTimestamp) {
+  // Wait for network requests (passing timestamp to track post-action requests)
+  // maxWait = 20s to give slow APIs time to complete
+  const networkInfo = await waitForPendingRequests(beforeActionTimestamp, 500, 20000);
+
+  // Small delay to let pending requests update their error status
+  // (handles case where request completes with error right after maxWait expires)
+  await new Promise(resolve => setTimeout(resolve, 100));
+
+  // Check for chrome error page (ERR_CONNECTION_REFUSED, etc.)
+  const url = page.url();
+  let chromeErrorInfo = null;
+  if (url.startsWith('chrome-error://')) {
+    chromeErrorInfo = await page.evaluate(() => {
+      const errorCode = document.querySelector('#error-code');
+      const suggestionText = document.querySelector('.suggestions');
+      return {
+        errorCode: errorCode?.textContent || 'UNKNOWN_ERROR',
+        suggestion: suggestionText?.textContent?.trim() || 'Connection failed'
+      };
+    }).catch(() => ({ errorCode: 'PAGE_LOAD_ERROR', suggestion: 'Navigation failed' }));
+  }
+
+  // Collect errors that occurred after the action (including errors from just-completed requests)
+  const errors = collectErrors(beforeActionTimestamp);
+
+  // Combine into diagnostics report
+  const diagnostics = {
+    networkActivity: {
+      hadPendingRequests: networkInfo.pendingFound,
+      completedRequests: networkInfo.completedRequests,
+      stillPending: networkInfo.stillPending,
+      pendingRequests: networkInfo.pendingRequests,
+      totalRequests: networkInfo.totalRequests,
+      waitedMs: networkInfo.waitedMs
+    },
+    chromeError: chromeErrorInfo,
+    errors: {
+      consoleErrors: errors.consoleErrors,
+      networkErrors: errors.networkErrors,
+      consoleErrorsOmitted: errors.consoleErrorsOmitted,
+      networkErrorsOmitted: errors.networkErrorsOmitted,
+      totalErrors: errors.consoleErrors.length + errors.networkErrors.length
+    },
+    hasErrors: (errors.consoleErrors.length + errors.networkErrors.length) > 0 || chromeErrorInfo !== null
+  };
+
+  return diagnostics;
+}
+
+/**
+ * Format diagnostics for AI-friendly output
+ * @param {Object} diagnostics - Diagnostics object from runPostClickDiagnostics
+ * @returns {string} Formatted text for AI
+ */
+export function formatDiagnosticsForAI(diagnostics) {
+  let output = '\n\n** POST-ACTION DIAGNOSTICS **';
+
+  // Chrome error page (connection refused, DNS failed, etc.)
+  if (diagnostics.chromeError) {
+    output += `\n\n🔴 CRITICAL: Navigation Failed`;
+    output += `\n   Error: ${diagnostics.chromeError.errorCode}`;
+    output += `\n   Suggestion: ${diagnostics.chromeError.suggestion}`;
+    output += `\n   → Backend likely not running or unreachable`;
+  }
+
+  // Network activity
+  const netActivity = diagnostics.networkActivity;
+  if (netActivity.totalRequests > 0) {
+    const errorCount = diagnostics.errors.networkErrors.length;
+    const successCount = netActivity.completedRequests - errorCount;
+
+    // Show warning if there are pending requests after timeout
+    if (netActivity.stillPending > 0) {
+      output += `\n⚠️  Network: ${successCount} OK, ${errorCount} failed, ${netActivity.stillPending} PENDING`;
+      output += `\n   ⏱️  Timeout: Stopped waiting after ${netActivity.waitedMs}ms`;
+      output += `\n   → ${netActivity.stillPending} request(s) still running - status unknown`;
+      output += `\n   → May complete successfully or fail - cannot determine outcome`;
+    } else if (errorCount > 0) {
+      output += `\n⚠️  Network: ${successCount} OK, ${errorCount} failed (${netActivity.waitedMs}ms)`;
+    } else {
+      output += `\n✓ Network: ${netActivity.completedRequests} completed (${netActivity.waitedMs}ms)`;
+    }
+  } else {
+    output += '\n✓ No network requests triggered';
+  }
+
+  // Errors
+  if (diagnostics.errors.totalErrors > 0) {
+    output += `\n\n⚠️  ERRORS DETECTED (${diagnostics.errors.totalErrors} total):`;
+
+    // Console errors
+    if (diagnostics.errors.consoleErrors.length > 0) {
+      output += `\n\nJavaScript Console Errors (${diagnostics.errors.consoleErrors.length}):`;
+      diagnostics.errors.consoleErrors.forEach((err, idx) => {
+        output += `\n  ${idx + 1}. ${err.message}`;
+        if (err.location && err.location !== 'unknown') {
+          output += ` [${err.location}]`;
+        }
+      });
+      // Show if some errors were omitted
+      if (diagnostics.errors.consoleErrorsOmitted > 0) {
+        output += `\n  ... and ${diagnostics.errors.consoleErrorsOmitted} more console error(s) (omitted to prevent spam)`;
+      }
+    }
+
+    // Network errors
+    if (diagnostics.errors.networkErrors.length > 0) {
+      output += `\n\nNetwork Errors (${diagnostics.errors.networkErrors.length}):`;
+      diagnostics.errors.networkErrors.forEach((err, idx) => {
+        output += `\n  ${idx + 1}. ${err.method} ${err.url}`;
+        output += `\n     Status: ${err.status}${err.statusText ? ' ' + err.statusText : ''}`;
+        if (err.errorText) {
+          output += `\n     Error: ${err.errorText}`;
+        }
+      });
+      // Show if some errors were omitted
+      if (diagnostics.errors.networkErrorsOmitted > 0) {
+        output += `\n  ... and ${diagnostics.errors.networkErrorsOmitted} more network error(s) (omitted to prevent spam)`;
+      }
+    }
+  } else {
+    output += '\n✓ No errors detected';
+  }
+
+  // Pending requests (if any still running after timeout)
+  if (netActivity.stillPending > 0 && netActivity.pendingRequests.length > 0) {
+    output += `\n\n⏳ PENDING REQUESTS (${netActivity.stillPending} still running):`;
+    netActivity.pendingRequests.forEach((req, idx) => {
+      output += `\n  ${idx + 1}. ${req.method} ${req.url}`;
+      const elapsed = Date.now() - new Date(req.timestamp).getTime();
+      output += `\n     Running for: ${elapsed}ms`;
+    });
+    output += `\n\n💡 Suggestion: These requests may be slow or hanging`;
+    output += `\n   → Check backend performance or network connectivity`;
+    output += `\n   → Consider using getNetworkRequest() to monitor progress`;
+  }
+
+  return output;
+}