Skip to content

WebView Interaction Tools ​

Comprehensive tools for interacting with your Tauri application's webview, including gestures, keyboard input, screenshots, and JavaScript execution.

webview_interact ​

Perform various interaction gestures on webview elements.

Parameters ​

NameTypeRequiredDescription
actionstringYesAction: 'click', 'double-click', 'long-press', 'scroll', 'swipe', 'focus'
selectorstringNoCSS selector or ref ID (e.g., ref=e3) for the element to interact with
xnumberNoX coordinate for direct coordinate interaction
ynumberNoY coordinate for direct coordinate interaction
durationnumberNoDuration in ms (default: 500ms for long-press, 300ms for swipe)
scrollXnumberNoHorizontal scroll amount in pixels (positive = right)
scrollYnumberNoVertical scroll amount in pixels (positive = down)
fromXnumberNoStarting X coordinate for swipe
fromYnumberNoStarting Y coordinate for swipe
toXnumberNoEnding X coordinate for swipe
toYnumberNoEnding Y coordinate for swipe

Example ​

javascript
// Click an element by selector
{
  "tool": "webview_interact",
  "action": "click",
  "selector": "#submit-button"
}

// Long press at coordinates
{
  "tool": "webview_interact",
  "action": "long-press",
  "x": 100,
  "y": 200,
  "duration": 1000
}

// Scroll an element
{
  "tool": "webview_interact",
  "action": "scroll",
  "selector": ".content-area",
  "scrollY": 200
}

// Swipe gesture
{
  "tool": "webview_interact",
  "action": "swipe",
  "fromX": 200,
  "fromY": 100,
  "toX": 200,
  "toY": 400,
  "duration": 500
}

// Focus an element
{
  "tool": "webview_interact",
  "action": "focus",
  "selector": "#username-input"
}

webview_screenshot ​

Capture a screenshot of the current viewport (visible area) of the webview.

Parameters ​

NameTypeRequiredDescription
formatstringNoImage format: 'png', 'jpeg' (default: 'jpeg')
qualitynumberNoJPEG quality 0-100 (default: 80, only for jpeg format)
filePathstringNoFile path to save the screenshot to instead of returning base64
windowIdstringNoWindow label to target (defaults to 'main')
maxWidthnumberNoMaximum width in pixels. Images wider than this will be scaled down proportionally
allowScreenCapturebooleanNoAllow an interactive OS screen-sharing prompt if native and html2canvas capture fail (default: false)

Example ​

javascript
// Take a PNG screenshot (returns base64)
{
  "tool": "webview_screenshot",
  "format": "png"
}

// Save screenshot to a file
{
  "tool": "webview_screenshot",
  "format": "png",
  "filePath": "/path/to/screenshot.png"
}

// Take a screenshot with max width constraint (useful for reducing token usage)
{
  "tool": "webview_screenshot",
  "maxWidth": 800
}

// Explicitly allow the interactive Screen Capture API fallback
{
  "tool": "webview_screenshot",
  "allowScreenCapture": true
}

Response ​

Returns a base64-encoded image, or if filePath is provided, returns the path where the screenshot was saved.

The Screen Capture API fallback is disabled by default because it opens an operating-system permission prompt and may share more than the target webview. Set allowScreenCapture only when that interactive fallback is desired.

Environment Variable ​

You can set a default maxWidth for all screenshots using the TAURI_MCP_SCREENSHOT_MAX_WIDTH environment variable. The tool parameter takes precedence over the environment variable.

On macOS, native screenshots may bring a fully occluded Tauri window forward so WKWebView can paint a fresh frame. Set TAURI_MCP_NO_FOREGROUND=1 to disable that behavior.

bash
# Set default max width to 800 pixels
export TAURI_MCP_SCREENSHOT_MAX_WIDTH=800

# Never foreground the Tauri window for screenshots
export TAURI_MCP_NO_FOREGROUND=1

TIP

This only captures what is currently visible. Scroll content into view before taking screenshots if you need to capture specific elements.

webview_keyboard ​

Type text or send keyboard events to the webview.

Parameters ​

NameTypeRequiredDescription
actionstringYesAction: 'type', 'press', 'down', 'up'
selectorstringNoCSS selector or ref ID (e.g., ref=e3) for element to type into (required for 'type' action)
textstringNoText to type (required for 'type' action)
keystringNoKey to press (required for 'press/down/up' actions, e.g., 'Enter', 'Escape')
modifiersstring[]NoModifier keys: ['Control', 'Alt', 'Shift', 'Meta']

Example ​

javascript
// Type text into an input
{
  "tool": "webview_keyboard",
  "action": "type",
  "selector": "#username",
  "text": "Hello World"
}

// Send keyboard shortcut
{
  "tool": "webview_keyboard",
  "action": "press",
  "key": "s",
  "modifiers": ["Control"]
}

webview_wait_for ​

Wait for specific conditions in the webview.

Parameters ​

NameTypeRequiredDescription
typestringYesWhat to wait for: 'selector', 'text', 'ipc-event'
valuestringYesCSS selector/ref ID, text content, or IPC event name to wait for
timeoutnumberNoTimeout in milliseconds (default: 5000ms)

Example ​

javascript
// Wait for element to appear
{
  "tool": "webview_wait_for",
  "type": "selector",
  "value": "#loading-complete",
  "timeout": 10000
}

// Wait for text to appear
{
  "tool": "webview_wait_for",
  "type": "text",
  "value": "Success!"
}

webview_execute_js ​

Execute JavaScript code in the webview context.

Parameters ​

NameTypeRequiredDescription
scriptstringYesJavaScript code to execute
argsarrayNoArguments to pass to the script

Script Format ​

Scripts can be any valid JavaScript. If you need a return value, it must be JSON-serializable:

  • Side effects only: console.log('hello'), document.body.classList.add('dark')
  • Simple expressions: document.title, 5 + 3, window.location.href
  • Statements with return: const x = 5; return x * 2;
  • Async operations: const res = await fetch('/api'); return await res.json();
  • IIFE (Immediately Invoked Function Expression): (() => { return 5; })()

Returning Values from Functions

If you want to return a value from a function, use an IIFE: (() => { return 5; })() not () => { return 5; }. Bare function definitions are not JSON-serializable and will return null.

Example ​

javascript
// Get page data (simple expression)
{
  "tool": "webview_execute_js",
  "script": "document.title + ' - ' + window.location.href"
}

// Async operation
{
  "tool": "webview_execute_js",
  "script": "const res = await fetch('/api/data'); return await res.json();"
}

// IIFE for complex logic
{
  "tool": "webview_execute_js",
  "script": "(() => { const items = document.querySelectorAll('li'); return items.length; })()"
}

Response ​

Returns the result of the JavaScript execution as a JSON string. Non-serializable values (like functions or DOM elements) will return null.

webview_get_styles ​

Get computed CSS styles for elements.

Parameters ​

NameTypeRequiredDescription
selectorstringYesCSS selector or ref ID (e.g., ref=e3) for element(s) to get styles from
propertiesstring[]NoSpecific CSS properties to retrieve (if omitted, returns all)
multiplebooleanNoGet styles for all matching elements (default: false)

Example ​

javascript
// Get specific styles
{
  "tool": "webview_get_styles",
  "selector": "#my-element",
  "properties": ["color", "background-color", "font-size"]
}

Response ​

Returns a JSON string with the computed styles.

Common Patterns ​

Dismissing the Keyboard ​

To dismiss the on-screen keyboard, use webview_execute_js:

javascript
{
  "tool": "webview_execute_js",
  "script": "document.activeElement?.blur()"
}

This is an unofficial community project. Not affiliated with, endorsed by, or associated with the Tauri project or CrabNebula Ltd.