chrometools-mcp 3.2.10 → 3.3.6

package/CHANGELOG.md

@@ -2,6 +2,128 @@
 
 All notable changes to this project will be documented in this file.
 
+## [3.3.5] - 2026-01-30
+
+### Fixed
+- **type/click: Intermittent timeout fix** — Added timeouts to internal operations
+  - `resolveSelector` now has 5s timeout (was unbounded)
+  - `getElementInfo` now has 5s timeout (was unbounded)
+  - `TextInputModel.setValue` operations have individual 5s timeouts
+  - Prevents indefinite hanging on unstable CDP sessions
+  - Error messages now show which specific operation timed out
+
+## [3.3.4] - 2026-01-30
+
+### Added
+- **click: Form submit detection for non-SPA apps** — Detect classic form submissions with page reload
+  - Tracks URL before and after click to detect page navigation
+  - Reports "Page navigation detected (form submit)" when URL changes
+  - Solves issue where POST requests were lost during page reload
+  - Works for Django, Rails, PHP and other server-rendered apps
+  - Example output: `🔄 Page navigation detected (form submit): /form → /success`
+
+## [3.3.3] - 2026-01-30
+
+### Fixed
+- **click: Post-click diagnostics timeout** — Fixed 30s timeout caused by network wait logic
+  - Now waits only for mutation requests (POST/PUT/PATCH) started within 200ms after click
+  - Ignores GET requests completely (were causing unnecessary waits)
+  - Hard 10s timeout limit enforced (never hangs indefinitely)
+  - Always returns success even if requests still pending after 10s
+  - Shows pending requests status instead of reporting timeout
+  - Changed output from "Form submission" to "Mutation requests"
+  - Example output:
+    ```
+    📡 Mutation requests detected (2 POST/PUT/PATCH):
+      1. ✓ POST /admin/tenant/.../change/ → 302 Found
+      2. ⏳ POST /api/slow-endpoint/ → pending
+
+    ⏳ 1 request(s) still pending after 10000ms timeout
+    ```
+
+### Performance
+- **click: Removed unnecessary delays** — Removed 100ms waits after scrollIntoView and retry clicks
+  - Click operations now complete instantly when no mutation requests detected
+  - Typical click time: <50ms (was 500-10000ms with old diagnostics)
+
+## [3.3.2] - 2026-01-30
+
+### Fixed
+- **click/type: Viewport scrolling** — Always scrolls to element before interaction
+  - Prevents 30s timeout when elements are outside viewport
+  - Moves scrollIntoView BEFORE first click/type attempt (was in fallback)
+  - Fixes Django admin forms hanging after multiple navigations
+  - Pattern: scroll → wait 100ms → interact
+  - Applied to both click and type tools
+
+## [3.3.1] - 2026-01-30
+
+### Added
+- **click: All network requests visibility** — Shows ALL requests started within 200ms after click
+  - AI agent now sees complete network activity picture after every click
+  - Shows: method, URL, and status code for each request
+  - Example output:
+    ```
+    📡 Network requests started within 200ms after click (15 total):
+      1. ✓ GET /api/auth/ws_token/ → 200 OK
+      2. ✓ GET /static/css/app.css → 200 OK
+      3. ✓ POST /admin/tenant/.../change/ → 302 Found
+    ```
+  - Helps AI understand what happened after click (form submission, navigation, polling, etc.)
+  - 200ms window captures both mutation requests and side-effect requests
+
+### Changed
+- **Enhanced diagnostics output** — Restructured to show all requests first, then mutation tracking
+  - Section 1: All requests in 200ms window (complete visibility)
+  - Section 2: Form submission status (POST/PATCH/PUT tracking)
+  - Clear icons: ✓ (success), ✗ (error), ⏳ (pending)
+  - Agent can immediately see if any requests occurred or not
+
+## [3.3.0] - 2026-01-30
+
+### Added
+- **click: skipNetworkWait parameter** — Skip network wait for forms with long-polling/WebSockets
+  - New parameter: `skipNetworkWait: boolean` (default: false)
+  - Use case: Pages with continuous long-polling to get instant response
+  - Example: `click({ selector: 'button[type="submit"]', skipNetworkWait: true })`
+- **click: networkWaitTimeout parameter** — Custom network wait timeout
+  - New parameter: `networkWaitTimeout: number` (default: 10000ms)
+  - Configurable per-click timeout for network requests
+  - Example: `click({ selector: '.save-btn', networkWaitTimeout: 5000 })`
+- **type: timeout parameter** — Explicit timeout for type operations
+  - New parameter: `timeout: number` (default: 30000ms)
+  - Prevents infinite hangs on input fields
+  - Example: `type({ selector: 'input[name="url"]', text: 'value', timeout: 10000 })`
+
+### Changed
+- **Smart form submission tracking** — Only tracks POST/PATCH/PUT requests in 100ms window
+  - Filters mutation requests (POST/PATCH/PUT) that started within 100ms after click
+  - Waits ONLY for these mutation requests (up to 10s)
+  - Ignores all other requests (GET, polling, analytics, etc.)
+  - Shows form submission status: `✓ POST /admin/tenant/.../change/ → 302 Found`
+  - Example: Django form with 50 polling requests → only 1 POST tracked
+- **Type operation timeout protection** — Wrapped in Promise.race with configurable timeout
+  - Prevents 120s hangs on problematic input fields
+  - Returns clear error message: "Type operation timed out after Xms"
+  - Django forms: type now fails fast instead of hanging
+
+### Fixed
+- **Django form timeout issues** — Fixed 30s click timeout and 120s type timeout
+  - Root cause: Long-polling/WebSockets created noise in network tracking
+  - Solution: Track only POST/PATCH/PUT requests within 100ms detection window
+  - Type operations now have explicit timeout protection
+  - Example: Django Admin forms now show reliable form submission status
+
+## [3.2.11] - 2026-01-30
+
+### Fixed
+- **Tailwind CSS selector escape** — Fixed `analyzePage` failing on pages with Tailwind CSS
+  - Tailwind classes with colons (e.g., `hover:text-gray-800`) broke `querySelectorAll`
+  - Added filtering for classes containing special characters (`:`, `/`, `[`, `]`)
+  - Applied `CSS.escape()` to class names when building CSS selectors
+  - Fixed in: APOM tree builder, Angular tools, hints generator, content script
+  - Example: Page with Tailwind → no more "not a valid selector" errors
+
 ## [3.2.10] - 2026-01-29
 
 ### Fixed

package/README.md

@@ -494,9 +494,11 @@ Click an element with optional result screenshot. **PREFERRED**: Use APOM ID fro
   - `waitAfter` (optional): Wait time in ms (default: 1500)
   - `screenshot` (optional): Capture screenshot (default: false for performance) ⚡
   - `timeout` (optional): Max operation time in ms (default: 30000)
-- **Use case**: Buttons, links, form submissions
-- **Returns**: Confirmation text + optional screenshot
-- **Performance**: 2-10x faster without screenshot
+  - `skipNetworkWait` (optional): Skip waiting for network requests (default: false). **Use for pages with continuous long-polling to get instant response.**
+  - `networkWaitTimeout` (optional): Custom network wait timeout in ms (default: 10000). Only used if skipNetworkWait is false.
+- **Use case**: Buttons, links, form submissions, Django admin forms
+- **Returns**: Confirmation text + optional screenshot + network diagnostics
+- **Performance**: 2-10x faster without screenshot, instant with skipNetworkWait
 - **Example**:
   ```javascript
   // PREFERRED: Using APOM ID
@@ -504,6 +506,12 @@ Click an element with optional result screenshot. **PREFERRED**: Use APOM ID fro
 
   // Alternative: Using CSS selector
   click({ selector: "button[type='submit']" })
+
+  // Django forms with WebSockets (prevents timeout)
+  click({ selector: ".submit-row input[type='submit']", skipNetworkWait: true })
+
+  // Custom network timeout for slow APIs
+  click({ id: "save_btn", networkWaitTimeout: 10000 })
   ```
 
 #### type
@@ -513,9 +521,10 @@ Type text into input fields with optional clearing and typing delay. **PREFERRED
   - `selector` (optional): CSS selector. Use when APOM ID is not available.
   - ⚠️ Either `id` OR `selector` required (mutually exclusive)
   - `text` (required): Text to type
-  - `delay` (optional): Delay between keystrokes in ms
+  - `delay` (optional): Delay between keystrokes in ms (default: 30)
   - `clearFirst` (optional): Clear field first (default: true)
-- **Use case**: Filling forms, search boxes, text inputs
+  - `timeout` (optional): Max operation time in ms (default: 30000). **Prevents infinite hangs on Django forms.**
+- **Use case**: Filling forms, search boxes, text inputs, Django admin forms
 - **Returns**: Confirmation text
 - **Example**:
   ```javascript

package/angular-tools.js

@@ -29,10 +29,16 @@ export async function listAngularComponents(page, includeHidden = false) {
 
         const component = ng.getComponent(el);
         if (component && component.constructor && component.constructor.name !== 'Object') {
-          // Get selector
+          // Get selector (filter out Tailwind classes with special characters)
           const tagName = el.tagName.toLowerCase();
-          const id = el.id ? `#${el.id}` : '';
-          const classes = el.className ? `.${el.className.split(' ').join('.')}` : '';
+          const id = el.id ? `#${CSS.escape(el.id)}` : '';
+          const stableClasses = el.className
+            ? el.className.split(' ')
+                .filter(c => c && !/[:\/\[\]]/.test(c))
+                .slice(0, 3)
+                .map(c => CSS.escape(c))
+            : [];
+          const classes = stableClasses.length > 0 ? `.${stableClasses.join('.')}` : '';
           const selector = id || `${tagName}${classes}` || tagName;
 
           // Get methods (public only by default)

package/bridge/bridge-client.js

@@ -12,8 +12,17 @@
  */
 
 import WebSocket from 'ws';
+import { appendFileSync } from 'fs';
+import { homedir } from 'os';
+import { join } from 'path';
 
 const BRIDGE_PORT = 9223;
+const LOG_FILE = join(homedir(), 'chrometools-bridge.log');
+
+function logToFile(message) {
+  const timestamp = new Date().toISOString();
+  appendFileSync(LOG_FILE, `${timestamp} ${message}\n`);
+}
 const RECONNECT_DELAY = 2000;
 const MAX_RECONNECT_ATTEMPTS = 5;
 
@@ -64,19 +73,24 @@ export function setActiveTabSyncHandler(handler) {
  */
 export async function connectToBridge() {
   return new Promise((resolve) => {
+    logToFile(`connectToBridge called, isConnected=${isConnected}, wsState=${ws?.readyState}`);
+
     if (isConnected && ws?.readyState === WebSocket.OPEN) {
       debugLog('Already connected to Bridge');
+      logToFile('Already connected, skipping');
       resolve(true);
       return;
     }
 
     debugLog(`Connecting to Bridge on port ${BRIDGE_PORT}...`);
+    logToFile(`Attempting connection to ws://127.0.0.1:${BRIDGE_PORT}`);
 
     try {
       ws = new WebSocket(`ws://127.0.0.1:${BRIDGE_PORT}`);
 
       const connectTimeout = setTimeout(() => {
-        debugLog('Connection timeout');
+        console.error('[chrometools-mcp] Bridge connection timeout (5s)');
+        logToFile('TIMEOUT: Connection timeout after 5s');
         ws?.close();
         resolve(false);
       }, 5000);
@@ -86,7 +100,8 @@ export async function connectToBridge() {
         isConnected = true;
         reconnectAttempts = 0;
         debugLog('Connected to Bridge');
-        console.error('[chrometools-mcp] Connected to Bridge Service');
+        console.error('[chrometools-mcp] Connected to Bridge Service (isConnected=true)');
+        logToFile('SUCCESS: WebSocket connected, isConnected=true');
         resolve(true);
       });
 
@@ -99,8 +114,9 @@ export async function connectToBridge() {
         }
       });
 
-      ws.on('close', () => {
-        debugLog('Disconnected from Bridge');
+      ws.on('close', (code, reason) => {
+        console.error(`[chrometools-mcp] Bridge disconnected (code=${code}, reason=${reason || 'none'})`);
+        logToFile(`CLOSE: WebSocket closed, code=${code}, reason=${reason || 'none'}`);
         isConnected = false;
         ws = null;
         scheduleReconnect();
@@ -108,12 +124,14 @@ export async function connectToBridge() {
 
       ws.on('error', (error) => {
         clearTimeout(connectTimeout);
-        debugLog('Connection error:', error.message);
+        console.error(`[chrometools-mcp] Bridge connection error: ${error.message}`);
+        logToFile(`ERROR: WebSocket error: ${error.message}`);
         resolve(false);
       });
 
     } catch (error) {
-      debugLog('Failed to create WebSocket:', error.message);
+      console.error(`[chrometools-mcp] Failed to create WebSocket: ${error.message}`);
+      logToFile(`EXCEPTION: Failed to create WebSocket: ${error.message}`);
       resolve(false);
     }
   });
@@ -125,7 +143,7 @@ export async function connectToBridge() {
 function scheduleReconnect() {
   if (reconnectTimer) return;
   if (reconnectAttempts >= MAX_RECONNECT_ATTEMPTS) {
-    debugLog(`Max reconnect attempts (${MAX_RECONNECT_ATTEMPTS}) reached`);
+    console.error(`[chrometools-mcp] Bridge: max reconnect attempts (${MAX_RECONNECT_ATTEMPTS}) reached, giving up`);
     return;
   }
 
@@ -360,6 +378,7 @@ export function isExtensionConnected() {
  * Check if connected to Bridge
  */
 export function isBridgeConnected() {
+  logToFile(`isBridgeConnected called, returning ${isConnected}`);
   return isConnected;
 }
 
@@ -470,3 +489,39 @@ export function getRecorderState() {
 export function getRecordings() {
   return bridgeState.recordings;
 }
+
+/**
+ * Get network requests from Bridge (tracked via Extension webRequest API)
+ * These persist across page navigations unlike CDP-based tracking
+ */
+export async function getNetworkRequestsFromBridge(options = {}) {
+  if (!isConnected) {
+    debugLog('Cannot get network requests: not connected to Bridge');
+    return [];
+  }
+
+  try {
+    const response = await sendCommand('get_network_requests', {}, options.timeout || 5000);
+    return response.payload?.requests || [];
+  } catch (error) {
+    debugLog('Failed to get network requests:', error.message);
+    return [];
+  }
+}
+
+/**
+ * Clear network requests in Bridge
+ */
+export async function clearNetworkRequestsFromBridge() {
+  if (!isConnected) {
+    return false;
+  }
+
+  try {
+    await sendCommand('clear_network_requests', {}, 5000);
+    return true;
+  } catch (error) {
+    debugLog('Failed to clear network requests:', error.message);
+    return false;
+  }
+}

package/bridge/bridge-service.js

@@ -7,7 +7,7 @@
  *
  * - Launched by Chrome when Extension starts
  * - Maintains state (tabs, recordings, events)
- * - Accepts 0-8 WebSocket clients
+ * - Accepts up to 20 WebSocket clients (with dead connection cleanup)
  * - Clients get full state on connect + real-time updates
  */
 
@@ -24,7 +24,7 @@ const require = createRequire(import.meta.url);
 // ============================================
 
 const WS_PORT = 9223;
-const MAX_CLIENTS = 8;
+const MAX_CLIENTS = 20;  // Increased from 8 to handle multiple MCP restarts
 const HOST_NAME = 'com.chrometools.bridge';
 
 // ============================================
@@ -40,11 +40,13 @@ const state = {
     metadata: null,
     secrets: {}
   },
+  networkRequests: new Map(), // requestId -> request info (from Extension webRequest API)
   eventLog: [],              // Ring buffer of recent events (max 1000)
   extensionConnected: false
 };
 
 const MAX_EVENT_LOG = 1000;
+const MAX_NETWORK_REQUESTS = 500;
 
 // ============================================
 // WebSocket Server for Claude/MCP Clients
@@ -61,6 +63,14 @@ function startWebSocketServer() {
   });
 
   wss.on('connection', (ws) => {
+    // Clean up dead connections before checking limit
+    for (const client of clients) {
+      if (client.readyState !== 1) { // Not OPEN
+        clients.delete(client);
+        log(`Cleaned up dead client (readyState=${client.readyState})`);
+      }
+    }
+
     if (clients.size >= MAX_CLIENTS) {
       log(`Max clients (${MAX_CLIENTS}) reached, rejecting connection`);
       ws.close(1013, 'Max clients reached');
@@ -105,6 +115,7 @@ function getFullState() {
     tabs: Array.from(state.tabs.values()),
     recordings: state.recordings,
     recorderState: state.recorderState,
+    networkRequests: Array.from(state.networkRequests.values()),
     extensionConnected: state.extensionConnected,
     timestamp: Date.now()
   };
@@ -153,6 +164,25 @@ function handleClientMessage(ws, message) {
       });
       break;
 
+    case 'get_network_requests':
+      // Return network requests from state (collected via Extension webRequest API)
+      sendToClient(ws, {
+        type: 'network_requests',
+        payload: {
+          requests: Array.from(state.networkRequests.values())
+        },
+        requestId: message.requestId
+      });
+      break;
+
+    case 'clear_network_requests':
+      state.networkRequests.clear();
+      sendToClient(ws, {
+        type: 'network_requests_cleared',
+        requestId: message.requestId
+      });
+      break;
+
     // Commands to forward to extension
     case 'start_recording':
     case 'stop_recording':
@@ -295,6 +325,54 @@ function handleExtensionMessage(message) {
       broadcastToClients({ type: 'pong' });
       break;
 
+    // Network request events (from Extension webRequest API)
+    case 'network_request_started':
+      state.networkRequests.set(message.payload.requestId, message.payload);
+      // Clean old requests
+      if (state.networkRequests.size > MAX_NETWORK_REQUESTS) {
+        const entries = Array.from(state.networkRequests.entries());
+        const removeCount = entries.length - MAX_NETWORK_REQUESTS;
+        for (let i = 0; i < removeCount; i++) {
+          state.networkRequests.delete(entries[i][0]);
+        }
+      }
+      broadcastToClients({ type: 'network_request_started', payload: message.payload });
+      break;
+
+    case 'network_request_completed':
+      if (state.networkRequests.has(message.payload.requestId)) {
+        const req = state.networkRequests.get(message.payload.requestId);
+        req.status = message.payload.status;
+        req.statusText = message.payload.statusText;
+        req.completedAt = Date.now();
+      }
+      broadcastToClients({ type: 'network_request_completed', payload: message.payload });
+      break;
+
+    case 'network_request_failed':
+      if (state.networkRequests.has(message.payload.requestId)) {
+        const req = state.networkRequests.get(message.payload.requestId);
+        req.status = 'failed';
+        req.error = message.payload.error;
+        req.completedAt = Date.now();
+      }
+      broadcastToClients({ type: 'network_request_failed', payload: message.payload });
+      break;
+
+    case 'network_requests':
+      // Response from extension with all network requests
+      broadcastToClients({
+        type: 'network_requests',
+        payload: message.payload,
+        requestId: message.requestId
+      });
+      break;
+
+    case 'network_requests_cleared':
+      state.networkRequests.clear();
+      broadcastToClients({ type: 'network_requests_cleared' });
+      break;
+
     default:
       // Forward unknown messages to clients
       broadcastToClients(message);

package/extension/background.js

@@ -21,6 +21,10 @@ let nativePort = null;
 let isConnected = false;
 const tabsState = new Map(); // tabId -> {url, title, active, windowId}
 
+// Network requests storage (persists across page navigations)
+const networkRequests = new Map(); // requestId -> request info
+const MAX_NETWORK_REQUESTS = 500;
+
 // Recorder state (persisted in storage)
 let recorderState = {
   isRecording: false,
@@ -152,6 +156,24 @@ function handleBridgeMessage(message) {
       sendToBridge({ type: 'pong', requestId: message.requestId });
       break;
 
+    case 'get_network_requests':
+      // Return recent network requests
+      const requests = Array.from(networkRequests.values());
+      sendToBridge({
+        type: 'network_requests',
+        payload: { requests },
+        requestId: message.requestId
+      });
+      break;
+
+    case 'clear_network_requests':
+      networkRequests.clear();
+      sendToBridge({
+        type: 'network_requests_cleared',
+        requestId: message.requestId
+      });
+      break;
+
     default:
       console.log('[ChromeTools] Unknown message from Bridge:', message.type);
   }
@@ -293,6 +315,101 @@ chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
   }
 });
 
+// ============================================
+// Network Request Tracking (via webRequest API)
+// Persists across page navigations!
+// ============================================
+
+/**
+ * Clean old network requests to prevent memory leak
+ */
+function cleanOldNetworkRequests() {
+  if (networkRequests.size > MAX_NETWORK_REQUESTS) {
+    const entries = Array.from(networkRequests.entries());
+    const removeCount = entries.length - MAX_NETWORK_REQUESTS;
+    for (let i = 0; i < removeCount; i++) {
+      networkRequests.delete(entries[i][0]);
+    }
+  }
+}
+
+// Track when request starts (captures POST/PUT/PATCH before navigation)
+chrome.webRequest.onBeforeRequest.addListener(
+  (details) => {
+    // Only track mutation requests (POST, PUT, PATCH, DELETE)
+    if (['POST', 'PUT', 'PATCH', 'DELETE'].includes(details.method)) {
+      const requestInfo = {
+        requestId: details.requestId,
+        url: details.url,
+        method: details.method,
+        type: details.type, // main_frame, xmlhttprequest, etc.
+        tabId: details.tabId,
+        timestamp: Date.now(),
+        status: 'pending',
+        initiator: details.initiator || null
+      };
+
+      networkRequests.set(details.requestId, requestInfo);
+      cleanOldNetworkRequests();
+
+      // Send to Bridge
+      sendToBridge({
+        type: 'network_request_started',
+        payload: requestInfo
+      });
+
+      console.log(`[ChromeTools] Network: ${details.method} ${details.url}`);
+    }
+  },
+  { urls: ['<all_urls>'] }
+);
+
+// Track when request completes
+chrome.webRequest.onCompleted.addListener(
+  (details) => {
+    const request = networkRequests.get(details.requestId);
+    if (request) {
+      request.status = details.statusCode;
+      request.statusText = details.statusLine;
+      request.completedAt = Date.now();
+
+      // Send update to Bridge
+      sendToBridge({
+        type: 'network_request_completed',
+        payload: {
+          requestId: details.requestId,
+          status: details.statusCode,
+          statusText: details.statusLine
+        }
+      });
+
+      console.log(`[ChromeTools] Network completed: ${request.method} ${request.url} -> ${details.statusCode}`);
+    }
+  },
+  { urls: ['<all_urls>'] }
+);
+
+// Track request errors
+chrome.webRequest.onErrorOccurred.addListener(
+  (details) => {
+    const request = networkRequests.get(details.requestId);
+    if (request) {
+      request.status = 'failed';
+      request.error = details.error;
+      request.completedAt = Date.now();
+
+      sendToBridge({
+        type: 'network_request_failed',
+        payload: {
+          requestId: details.requestId,
+          error: details.error
+        }
+      });
+    }
+  },
+  { urls: ['<all_urls>'] }
+);
+
 // ============================================
 // Icon Management
 // ============================================

package/extension/content.js

@@ -149,8 +149,10 @@
 
     return Array.from(element.classList).filter(cls => {
       if (cls.length < 2) return false;
+      // Filter out Tailwind classes with special characters (colons, slashes, brackets)
+      if (/[:\/\[\]]/.test(cls)) return false;
       return !unstablePatterns.some(p => p.test(cls));
-    }).slice(0, 3);
+    }).slice(0, 3).map(cls => CSS.escape(cls));
   }
 
   function getNthChildPath(element, maxDepth = 5) {

package/extension/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "ChromeTools MCP",
-  "version": "3.1.2",
+  "version": "3.3.6",
   "description": "Tab tracking and scenario recording for chrometools-mcp",
 
   "key": "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAxLLqg7Nu1h9ogRVgQoVMRPv8Jp7uRJugZSGUh++Niq0xm3khJefBuJ3L0dSG6xb9tkjTdgqUyg81VUgJBDVw9Bxu6iz1uL17VnEGHDZKe5wpsEpG8o6ZsTWtKRDeoxmkCGSOSDsh/ihlJe8mFaqpBYz6RBaO28R89TNobVhSobTQPB1ptyEND7W7JnsnMOiMcTo9l6j9HrIHLoHj7tO42DHNI4tEyLxI7C6R3i5dLIdwwxJMj0Hhrx4Ncmh24AzPyZypxVvpa1V7HP3sAXGBoUjLd/SEaY8j50lnaIQI3AkYv86pS9l6EZ6y3XCuW7C7W9guTTL/7ZNawYoE2bJ1HwIDAQAB",
@@ -12,6 +12,7 @@
     "scripting",
     "storage",
     "webNavigation",
+    "webRequest",
     "nativeMessaging"
   ],