Element inspector

Element inspector lets you quickly jump from the device preview to the exact line of code where given component is defined.

Enabling the element inspector

To enable the element inspector, use the inspector button in the bottom-left corner of the Radon IDE panel.

Using the element inspector

To use it, first enable the inspector and simply point-and-click on the device preview. The Radon IDE will automatically open the source file with the editor cursor pointing on the line of code where the component is defined.

With an element inspector enabled, you can get the exact dimensions of the element by hovering the cursor over the device preview.

Alternatively, you can use the inspector by right-clicking on the element visible in the device preview. A dropdown list will appear that allows you to select an element from the React view hierarchy, also allowing quick access to the element's dimensions.