dioxus-inspector 0.1.1

HTTP bridge for inspecting and debugging Dioxus Desktop apps
Documentation

dioxus-inspector

Crates.io Documentation License: MIT

HTTP bridge for inspecting and debugging Dioxus Desktop apps. Embed this in your app to enable MCP-based debugging from Claude Code.

Quick Start

use dioxus::prelude::*;
use dioxus_inspector::{start_bridge, EvalResponse};

fn main() {
    dioxus::launch(app);
}

fn app() -> Element {
    use_inspector_bridge(9999, "my-app");
    rsx! { div { "Hello, inspector!" } }
}

fn use_inspector_bridge(port: u16, app_name: &str) {
    use_hook(|| {
        let mut eval_rx = start_bridge(port, app_name);
        spawn(async move {
            while let Some(cmd) = eval_rx.recv().await {
                let result = document::eval(&cmd.script).await;
                let response = match result {
                    Ok(val) => EvalResponse::success(val.to_string()),
                    Err(e) => EvalResponse::error(e.to_string()),
                };
                let _ = cmd.response_tx.send(response);
            }
        });
    });
}

Endpoints

Endpoint Method Purpose
/status GET App status, PID, uptime
/eval POST Execute JavaScript in webview
/query POST Query DOM by CSS selector
/dom GET Get simplified DOM tree
/inspect POST Element visibility analysis
/validate-classes POST Check CSS class availability
/diagnose GET Quick UI health check
/screenshot POST Capture window (macOS only)
/resize POST Resize window

MCP Server

Use with dioxus-mcp for Claude Code integration:

{
  "mcpServers": {
    "dioxus": {
      "command": "dioxus-mcp",
      "env": { "DIOXUS_BRIDGE_URL": "http://127.0.0.1:9999" }
    }
  }
}

License

MIT