Overlays

For AI agents: this page is Markdown at https://squiggle.sh/docs/studio/overlays.md. Every docs page is listed at https://squiggle.sh/llms.txt, and all of them are one file at https://squiggle.sh/llms-full.txt.

An overlay draws what Squiggle knows about your app on top of the simulator: which components keep rendering, where every control is, what the accessibility tree contains, or where people tap.

Pick an overlay

Choose one from the Overlays menu in the device panel.

OverlaysStudio tour · 3 steps

No overlay
The plain screen, for demos and screenshots.
Renders
Each component outlined as it re-renders, coloured by how often it does, the same colours as the Inspector. On device in the Inspector’s Renders tab turns it on from there.
All bounds
The outline of every component Squiggle can place.
AX tree
The live accessibility tree, with each element’s bounds and label. Flows look here for what React didn’t draw, so a control missing from this overlay is one a flow can’t name.
Heatmap
Every tap as a blob that grows with repeated taps, and every swipe as an arrow. See Heatmap.

Draw on the Simulator app instead

Native overlay draws the same outlines on the real Simulator app’s window, in a see-through layer that clicks pass through. Use it when you work in the Simulator app and still want the overlay. It hides itself when another window covers the simulator.