dioxus-inspector

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