To provide interactive debugging, Eclipse 4 has the CSS Spy, a dialog that can provide information about the user interface widget under the mouse. This can be invoked from the Quick Access search box, by typing css spy, or by pressing the Shift + Alt + F5 keys.
Move the cursor to the Quick Access search box by pressing Cmd + 3 (on macOS) or Ctrl + 3 (on other platforms), or by clicking in the search box with the mouse.
Enter
spyin the quick access bar, and a list of Eclipse 4 spies will be shown, including theCSS Spy:
Select the CSS Spy from the list, and the spy view will be shown. The user interface is represented as a tree structure, and by selecting individual elements of the user interface, a red highlight box will show where the selected element is located on screen:
It is also possible to open the spy in its own window by pressing the Alt + Shift + F5 keys:
