Skip to content

johunsang/tauri-dev-screen-cli

Tauri Dev Screen CLI

Tauri Dev Screen CLI is a lightweight Node.js command-line tool for inspecting, screenshotting, and controlling a live Tauri development window without running an MCP server.

It connects directly to the WebSocket exposed by tauri-plugin-mcp-bridge on ports 9223-9322, then lets AI coding agents, CI jobs, and local scripts verify the real desktop UI with screenshots, DOM snapshots, JavaScript execution, clicks, typing, keyboard events, and window resizing.

CI License: MIT Node.js 20+ Tauri

Why

Tauri apps are desktop apps, so browser-only test tools often miss the actual native window state. This CLI gives coding agents and developers a direct terminal workflow for checking the development screen:

  • Capture the real Tauri WebView as a PNG screenshot
  • Save a compact DOM snapshot for AI-readable UI inspection
  • Run JavaScript inside the WebView
  • Click and type through CSS selectors
  • Send keyboard events to the focused element
  • Resize the native Tauri window
  • Avoid stdio MCP setup when a plain CLI command is enough

Requirements

  • Node.js 20 or newer
  • A running Tauri app with tauri-plugin-mcp-bridge
  • Local access to the bridge WebSocket port, usually 127.0.0.1:9223

Example Tauri setup:

tauri::Builder::default()
  .plugin(tauri_plugin_mcp_bridge::init())
  .run(tauri::generate_context!())
  .expect("error while running tauri application");

Install

Install directly from GitHub:

npm install -g github:johunsang/tauri-dev-screen-cli

Or run from a clone:

git clone https://github.com/johunsang/tauri-dev-screen-cli.git
cd tauri-dev-screen-cli
npm link

Quick Start

Start your Tauri dev app first:

npm run tauri dev

Then inspect the live window:

tauri-dev-screen
tauri-dev-screen status
tauri-dev-screen screenshot --file .tauri-dev-screen/screen.png
tauri-dev-screen snapshot --file .tauri-dev-screen/dom.txt
tauri-dev-screen js --code "document.title"
tauri-dev-screen click --selector "button"
tauri-dev-screen type --selector "input" --text "hello"
tauri-dev-screen key --key Enter
tauri-dev-screen resize --width 1440 --height 980

Local development without global install:

node bin/tauri-dev-screen.mjs
node bin/tauri-dev-screen.mjs status

Commands

Command Purpose
check or no command Save status, screenshot, DOM snapshot, and summary artifacts
status Print app metadata, Tauri version, window list, and bridge status
screenshot Save the current Tauri WebView screenshot as PNG
snapshot Save an AI-readable DOM text snapshot
js Execute JavaScript inside the Tauri WebView
click Click an element by CSS selector
type Focus an element and type text
key Dispatch a keyboard event to the focused element
resize Resize the native Tauri window

DOM Control

Tauri Dev Screen CLI can inspect and control the live DOM inside the Tauri WebView.

Selector-based commands cover common UI automation:

tauri-dev-screen click --selector "button[data-testid='save']"
tauri-dev-screen type --selector "input[name='email']" --text "hello@example.com"
tauri-dev-screen key --key Enter

For direct DOM reads, writes, and custom events, use js --code:

tauri-dev-screen js --code "document.title"
tauri-dev-screen js --code "document.querySelector('input').value = 'hello'"
tauri-dev-screen js --code "document.querySelector('button').click()"
tauri-dev-screen js --code "document.body.dataset.agentChecked = 'true'"
tauri-dev-screen js --code "Array.from(document.querySelectorAll('button')).map((el) => el.innerText)"

The JavaScript runs in the target WebView context, so it can query elements, mutate DOM state, dispatch browser events, and return JSON-serializable values to stdout.

Options

--host 127.0.0.1
--port 9223
--window main
--out .tauri-dev-screen
--file .tauri-dev-screen/screen.png
--timeout-ms 45000

Environment variables:

TAURI_DEV_HOST=127.0.0.1
TAURI_DEV_PORT=9223
TAURI_DEV_SCREEN_DIR=.tauri-dev-screen

Output

Default check artifacts:

.tauri-dev-screen/status.json
.tauri-dev-screen/screenshot.png
.tauri-dev-screen/dom-snapshot.txt
.tauri-dev-screen/summary.json

AI Agent Workflow

This project is designed for AI coding agents that need proof that a Tauri desktop app actually renders and responds:

tauri-dev-screen status
tauri-dev-screen screenshot --file artifacts/screen.png
tauri-dev-screen snapshot --file artifacts/dom.txt
tauri-dev-screen js --code "document.querySelectorAll('button').length"

The resulting screenshot and DOM snapshot can be attached to agent runs, CI artifacts, pull request checks, or local bug reports.

No MCP Server Required

Tauri Dev Screen CLI does not register or run an MCP stdio server. It uses the existing local WebSocket control surface exposed by tauri-plugin-mcp-bridge, so any shell, npm script, CI job, or coding agent can control the dev screen with ordinary CLI commands.

Security

Only run this tool against trusted local Tauri development apps. The bridge can execute JavaScript in the target WebView and should not be exposed to untrusted networks.

License

MIT License. See LICENSE.

About

CLI to inspect, screenshot, and control live Tauri development screens without running an MCP server.

Topics

Resources

License

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Packages

 
 
 

Contributors