TOOLS RECIPES GITHUB
Home / Recipes / File Uploads
PRODUCTION RECIPE · FILE DIALOG INTERCEPTION & CDP UPLOADS

Automating File Uploads & Suppressing OS Dialogs

How AI agents automate drag-and-drop zones, suppress native Finder/Explorer file pickers, and programmatically assign files across complex modern web apps.

Quick Answer (TL;DR) Clicking an <input type="file"> or a custom media upload button usually pops an OS modal dialog (Finder on macOS, Explorer on Windows) that freezes headless automation. WebBridge solves this with file_chooser_intercept: turning interception ON suppresses the native OS dialog and redirects the browser's file requirement into CDP's DOM.setFileInputFiles via the upload tool.

1. The Problem: Native OS Dialog Freezes

On modern applications like LinkedIn, Google Flow, Twitter, or Discord, opening a file upload UI programmatically often triggers the browser to prompt the operating system for a file picker window. Because Chrome DevTools Protocol cannot dismiss or click inside native OS windows, standard automation scripts hang indefinitely waiting for manual user interaction.

2. The 3-Step Upload Protocol

WebBridge provides a foolproof sequence to attach files without triggering native popups:

  1. Enable Interception: Call file_chooser_intercept(enabled: true). Any native dialog trigger is now suppressed at the CDP Page domain level.
  2. Trigger UI: Use trusted_click or click to open the media widget or mount the hidden file input.
  3. Assign Files: Use the upload tool to supply absolute file paths to the targeted input.
  4. Restore Normalcy: Call file_chooser_intercept(enabled: false) to restore standard browser behavior.

3. Code Examples

Node.js ESM (WebBridgeClient):

import { WebBridgeClient } from "agent-webbridge";

const client = new WebBridgeClient({ profile: "Work", session: "upload-task" });

// 1. Enable dialog interception
await client.fileChooserIntercept(true);

// 2. Open upload widget (e.g. LinkedIn or Flow)
await client.trustedClick('button[aria-label="Add media"]');

// 3. Programmatically inject the file
await client.upload('input[type="file"]', ['/Users/alex/Documents/deck.pdf']);

// 4. Restore normal dialog behavior
await client.fileChooserIntercept(false);

Python 3 (Standalone SDK):

from scripts.awb_client import WebBridgeClient

client = WebBridgeClient(profile="Work", session="upload-task")

# 1. Suppress native OS file picker
client.file_chooser_intercept(enabled=True)

# 2. Click upload trigger
client.trusted_click(selector="div.upload-dropzone")

# 3. Assign files programmatically
client.upload(selector="input[type='file']", files=["/tmp/chart.png"])

# 4. Turn off interception
client.file_chooser_intercept(enabled=False)

Single-line cURL / Agent Bash:

cmd(){ curl -s -m 60 -X POST http://127.0.0.1:10086/command -H 'Content-Type: application/json' -d "$1"; echo; }

# Intercept ON
cmd '{"action":"file_chooser_intercept","args":{"enabled":true},"session":"s1","profile":"Work"}'

# Upload file
cmd '{"action":"upload","args":{"selector":"input[type=file]","files":["/tmp/preview.png"]},"session":"s1","profile":"Work"}'

# Intercept OFF
cmd '{"action":"file_chooser_intercept","args":{"enabled":false},"session":"s1","profile":"Work"}'

4. Real-World Battle-Tested Targets