What problem does it solve? When developing the Hermes desktop app, guessing why a style did not apply or whether a UI change took effect wastes time. This Skill reads the live rendered DOM of the running Electron window over the Chrome DevTools Protocol, answering factual questions about computed styles, geometry, winning CSS rules, and console output. ## Core Features & Use Cases - Live DOM inspection: Connect to the CDP port on 127.0.0.1:9222 and evaluate expressions against the real renderer using the shared CDP client and stable data-slot selectors. - CSS rule diagnosis: Determine which rule actually won by reading computed styles and ancestor classes, distinguishing inherited values from directly applied ones. - Isolated probe instances: Launch a separate Electron instance with its own user-data directory, HERMES_HOME, and CDP port so the user's running app is never disturbed. - Use Case: A developer changes a component's font weight but the UI looks unchanged. Instead of editing every call site, they query the live node, discover the value is inherited from a plugin stylesheet rule, and override it on the shared class. ## Quick Start Ask the assistant to check the computed style of a specific element in the running Hermes desktop app using the CDP port on 127.0.0.1:9222.
