@agent360/browser-mcp 1.15.0 → 1.16.1

package/README.md

@@ -10,7 +10,7 @@
 
 ![Browser MCP Demo](assets/demo.gif)
 
-The only browser MCP with **multi-session support** (10 concurrent AI sessions), **human-in-the-loop** (2FA, CAPTCHA, credentials), and **built-in provider integrations** (Stripe, HubSpot, Slack, and 6 more). 25 tools total.
+The only browser MCP with **multi-session support** (10 concurrent AI sessions), **human-in-the-loop** (2FA, CAPTCHA, credentials), and **built-in provider integrations** (Stripe, HubSpot, Slack, and 6 more). 29 tools total.
 
 ## Install
 
@@ -26,7 +26,7 @@ Then load the extension in Chrome:
 3. Click **Load unpacked** → select `~/.browser-mcp/extension/`
 4. Restart Claude Code
 
-That's it. 25 browser tools are now available in Claude Code.
+That's it. 29 browser tools are now available in Claude Code.
 
 ## Why This Over Playwright MCP / BrowserMCP?
 
@@ -43,7 +43,7 @@ That's it. 25 browser tools are now available in Claude Code.
 | **Custom dropdowns** | Angular Material, React Select support | Works (headless) | Limited |
 | **Install** | `npx @agent360/browser-mcp install` | `npx @anthropic-ai/mcp-playwright` | Manual clone |
 
-## 25 Tools
+## 29 Tools
 
 ### Navigation & Content
 | Tool | Description |
@@ -94,6 +94,16 @@ That's it. 25 browser tools are now available in Claude Code.
 |------|-------------|
 | `browser_ask_user` | Show overlay dialog for 2FA, CAPTCHA, credentials, or any user input |
 
+### Data
+| Tool | Description |
+|------|-------------|
+| `browser_get_cookies` | Get cookies for a domain |
+| `browser_set_cookies` | Set cookies for a domain |
+| `browser_get_local_storage` | Read localStorage from page |
+| `browser_set_local_storage` | Write localStorage values |
+| `browser_console_logs` | Capture console.log/warn/error messages from page |
+| `browser_upload_file` | Upload files to `<input type="file">` via Chrome Debugger API (no dialog) |
+
 ## Multi-Session Support
 
 Each Claude Code conversation gets its own MCP server on a unique port (9876-9885). The Chrome extension connects to all active servers simultaneously.
@@ -135,7 +145,7 @@ extension/
 
 mcp-server/
   index.js            # MCP server (stdio) + WebSocket client
-  tools.js            # 21 tool definitions
+  tools.js            # 29 tool definitions
   bin/cli.js          # Install CLI
 ```
 

package/extension/background.js

@@ -255,12 +255,13 @@ async function debuggerClick(tabId, x, y) {
       type: 'mouseReleased', x, y, button: 'left', clickCount: 1,
     });
     // 3. CDP doesn't synthesize 'click' event from mousePressed/mouseReleased.
-    //    Fire JS click + React fiber lookup as backup for React SPAs.
+    //    Fire JS click + React/Angular framework fallbacks.
     await chrome.debugger.sendCommand({ tabId }, 'Runtime.evaluate', {
       expression: `(() => {
         const el = document.elementFromPoint(${x}, ${y});
         if (!el) return;
         el.click();
+
         // React fiber fallback — find and call onClick handler directly
         const fiberKey = Object.keys(el).find(k => k.startsWith('__reactFiber') || k.startsWith('__reactInternalInstance'));
         if (fiberKey) {
@@ -270,6 +271,18 @@ async function debuggerClick(tabId, x, y) {
             fiber = fiber.return;
           }
         }
+
+        // Angular fallback — trigger via Zone.js patched events + ngClick
+        const ngKey = Object.keys(el).find(k => k.startsWith('__ng'));
+        if (ngKey || el.getAttribute('ng-click') || el.getAttribute('(click)')) {
+          // Angular uses Zone.js which patches addEventListener — dispatch real events through it
+          el.dispatchEvent(new PointerEvent('pointerdown', {bubbles:true, cancelable:true}));
+          el.dispatchEvent(new PointerEvent('pointerup', {bubbles:true, cancelable:true}));
+          el.dispatchEvent(new MouseEvent('click', {bubbles:true, cancelable:true, view:window}));
+          // Angular Material components (mat-button, mat-checkbox, etc.) use ripple + internal handlers
+          const matRipple = el.closest('[mat-button], [mat-raised-button], [mat-icon-button], [mat-fab], mat-checkbox, mat-slide-toggle, mat-radio-button');
+          if (matRipple) matRipple.dispatchEvent(new MouseEvent('click', {bubbles:true, cancelable:true, view:window}));
+        }
       })()`,
     });
   } finally {
@@ -671,9 +684,9 @@ async function dispatch(port, method, params) {
       // Check for CAPTCHA after navigation
       const captcha = await detectCaptcha(tab.id);
       const result = { title: updated.title, url: updated.url, tab_id: tab.id, session: session.label };
-      if (captcha) {
-        result.captcha_detected = captcha;
-        result.hint = `CAPTCHA (${captcha}) detected. Use browser_ask_user to ask the user to solve it, then retry.`;
+      if (captcha && captcha.found) {
+        result.captcha_detected = captcha.types.join(', ');
+        result.hint = `CAPTCHA detected: ${captcha.types.join(', ')}. Use browser_solve_captcha to handle it.`;
       }
       return result;
     }
@@ -1406,6 +1419,53 @@ async function dispatch(port, method, params) {
       return { error: 'Unknown action: ' + action };
     }
 
+    case 'upload_file': {
+      const tab = await getSessionTab(port);
+      const selector = params.selector || 'input[type="file"]';
+      try {
+        await debuggerAttach(tab.id);
+        // Find the file input element
+        const { result: nodeResult } = await chrome.debugger.sendCommand({ tabId: tab.id }, 'Runtime.evaluate', {
+          expression: `(() => {
+            const el = document.querySelector(${JSON.stringify(selector)});
+            if (!el) return JSON.stringify({ found: false, error: 'File input not found: ${selector}' });
+            return JSON.stringify({ found: true, tag: el.tagName, type: el.type, accept: el.accept, multiple: el.multiple });
+          })()`,
+          returnByValue: true,
+        });
+        const info = JSON.parse(nodeResult.value);
+        if (!info.found) {
+          await debuggerDetach(tab.id);
+          return info;
+        }
+
+        // Get the DOM node ID for the file input
+        const { result: docResult } = await chrome.debugger.sendCommand({ tabId: tab.id }, 'DOM.getDocument', {});
+        const { nodeId } = await chrome.debugger.sendCommand({ tabId: tab.id }, 'DOM.querySelector', {
+          nodeId: docResult.root.nodeId,
+          selector: selector,
+        });
+
+        if (!nodeId) {
+          await debuggerDetach(tab.id);
+          return { found: false, error: 'Could not get DOM node for file input' };
+        }
+
+        // Set files on the input using CDP
+        const files = Array.isArray(params.files) ? params.files : [params.files || params.file];
+        await chrome.debugger.sendCommand({ tabId: tab.id }, 'DOM.setFileInputFiles', {
+          nodeId: nodeId,
+          files: files,
+        });
+
+        await debuggerDetach(tab.id);
+        return { ok: true, files: files, input: info };
+      } catch (e) {
+        try { await debuggerDetach(tab.id); } catch {}
+        return { ok: false, error: e.message };
+      }
+    }
+
     case 'reload_extension': {
       // MCP server signals that extension files were updated via npx
       // Reload after a short delay to allow response to be sent

package/extension/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "Agent360 Browser MCP",
-  "version": "1.15.0",
+  "version": "1.16.0",
   "description": "Control your real Chrome from Claude Code — navigate, click, fill, screenshot, solve CAPTCHAs. 24 tools, multi-session, human-in-the-loop.",
   "permissions": [
     "tabs",

package/index.js

@@ -219,7 +219,7 @@ If the extension files were updated, ask the user to reload it:
 You cannot navigate to chrome:// pages — the user must do this manually.`;
 
 const mcpServer = new Server(
-  { name: 'agent360-browser', version: '1.15.0' },
+  { name: 'agent360-browser', version: '1.16.0' },
   { capabilities: { tools: {} } },
   { instructions: INSTRUCTIONS },
 );
@@ -257,6 +257,7 @@ mcpServer.setRequestHandler(CallToolRequestSchema, async (request) => {
       browser_get_new_tab: 'get_new_tab',
       browser_switch_tab: 'switch_tab',
       browser_close_tab: 'close_tab',
+      browser_upload_file: 'upload_file',
       browser_set_cookies: 'set_cookies',
       browser_set_local_storage: 'set_local_storage',
       browser_console_logs: 'console_logs',

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "@agent360/browser-mcp",
-  "version": "1.15.0",
-  "description": "Browser MCP — control your real Chrome from Claude Code. 28 tools, CAPTCHA solving, multi-session, human-in-the-loop.",
+  "version": "1.16.1",
+  "description": "Browser MCP — control your real Chrome from Claude Code. 29 tools, CAPTCHA solving, file upload, multi-session, human-in-the-loop.",
+  "mcpName": "io.github.Agent360dk/browser-mcp",
   "type": "module",
   "main": "index.js",
   "bin": {

package/tools.js

@@ -305,6 +305,19 @@ export const TOOLS = [
       required: ['tab_id'],
     },
   },
+  {
+    name: 'browser_upload_file',
+    description: 'Upload a file to a <input type="file"> element on the page. Uses Chrome Debugger API to set files programmatically — no dialog needed.',
+    inputSchema: {
+      type: 'object',
+      properties: {
+        selector: { type: 'string', description: 'CSS selector for the file input (default: input[type="file"])' },
+        files: { type: 'array', items: { type: 'string' }, description: 'Array of absolute file paths to upload. E.g. ["/Users/me/photo.jpg"]' },
+        file: { type: 'string', description: 'Single file path (alternative to files array)' },
+      },
+      required: ['files'],
+    },
+  },
   {
     name: 'browser_extract_token',
     description: 'Navigate to a provider\'s API settings page and extract the API token. Optionally store it in Agent360 vault.',