← ClaudeAtlas

ui-inspectorlisted

Resolve a durable @ui_ reference from the Tandem desktop element picker into its source location, DOM/ARIA metadata and locators. Use when a request names @ui_…, ui_…, "the element I picked", or "this button/panel".
bloknayrb/tandem · ★ 18 · Web & Frontend · score 64
Install: claude install-skill bloknayrb/tandem
# UI inspector references Bryan picked an element in the running Tandem desktop app and it was recorded as `@ui_<ULID>` — DOM + ARIA metadata, ranked locators, the `.svelte` source location. (Screenshots are disabled in Tandem — see "Pixels are OFF" below.) **Use the recorded reference. Never infer the element from the description when an `@ui_` id is available.** The whole point of the reference is that it removes the guess; a "nearby" element is a wrong answer that looks right. ## Prerequisites (check these before blaming the CLI) The picker only exists in a dev build with the cargo feature on: ```sh cargo tauri dev --features ui-inspector ``` Then `Ctrl+Shift+C` (or `ui-inspector pick`) selects an element. `ui-inspector` is a per-machine tool, not a repo dependency — `cargo install tauri-ui-inspector` if the command is missing. Three failure modes look identical from the CLI (a timeout, or exit 3): | Symptom | Cause | |---|---| | exit 3, no `.ui-inspector/run/instance.json` | app not running, or built without `--features ui-inspector` | | bridge installed, every capture rejected | cargo feature off — the ACL has no `ui-inspector:default` grant. The WebView console says so | | `pick` hangs to timeout | wrong `--window`, or another pick/resolve is already active. Also seen on the very first `pick` after `npm install`: Vite re-optimizes the two `@tauri-ui-inspector/*` deps on first import and force-reloads the page, which tears down the bridge that had just installed.