Devtools Desktop App Plugin

Connect with the CrabNebula DevTools Desktop application and embed the devtools view in your application.

This plugin extends the DevTools for Tauri plugin by easily interfacing with the DevTools Desktop app, allowing you to directly open the DevTools user interface either as a embedded view or in a standalone window.

This is the plugin for the upcoming Tauri v3 (currently alpha). For Tauri v2, use the 2.x releases.

Getting Started

Ensure you have Tauri set up correctly. Then install the Rust instrumentation from crates.io:

cargo add tauri-plugin-devtools@3.0.0-alpha.0
cargo add tauri-plugin-devtools-app@3.0.0-alpha.0

Then add the following snippet to your tauri initialization code:

fn main() {
    #[cfg(debug_assertions)] // only enable instrumentation in development builds
    let (devtools, devtools_app) = (tauri_plugin_devtools::init(), tauri_plugin_devtools_app::init());

    // Tauri v3 does not bundle a webview runtime, the app selects one explicitly
    let builder = tauri::Builder::default().runtime(tauri_runtime_wry::Wry::default());

    #[cfg(debug_assertions)]
    let builder = builder.plugin(devtools).plugin(devtools_app);

    builder
        .run(tauri::generate_context!("./tauri.conf.json"))
        .expect("error while running tauri application");
}

And then run your app as usual, if everything is set up correctly you will be able to right-click on the window and select the "Open DevTools" menu or use the "Ctrl + Shift + M" (Linux and Windows) or "Cmd + Shift + M" (macOS) shortcuts.

Webview runtimes

The plugin works with any Tauri v3 runtime (tauri-runtime-wry, tauri-runtime-cef). Runtimes serve custom protocols on different URLs ({scheme}://localhost on wry, http://{scheme}.localhost on CEF and on Windows); the plugin asks the runtime for the right one, so nothing needs to be configured. A runtime that serves custom protocols somewhere else than it reports can be handled through Builder::custom_scheme_url:

tauri_plugin_devtools_app::Builder::new()
    .custom_scheme_url(|scheme| format!("http://{scheme}.localhost"))
    .build()

Context Menu

This plugin changes the default webview context menu to include its own entry for opening the devtools webview. By default the Inspector item is only enabled on debug builds. To also enable this for release applications, enable the context-menu-inspector feature flag, which also enables the Web inspector (tauri/devtools feature flag) for your application:

tauri-plugin-devtools-app = { version = "3.0.0-alpha.0", features = ["context-menu-inspector"] }