Inspecting the live Hermes desktop DOM

Overview

When you are developing apps/desktop and the user is running that same app (hgui / npm run dev), you can read the live rendered DOM of the window they are looking at — computed styles, geometry, which CSS rule actually won, console output — instead of inferring it from .tsx and being wrong.

Dev-server runs open a Chrome DevTools Protocol port on 127.0.0.1:9222 automatically. The renderer is a Chromium page, so everything DevTools can read, a script can read.

This does not replace looking at it. CDP answers factual questions ("what is the computed padding", "did this element render", "which selector matches"). It cannot tell you whether the result looks good. Colour balance, spacing feel, and "is this ugly" still need the user's eyes or a screenshot. Answer facts with CDP; hand aesthetics to the user.