Search for usages
In the editor, select an element you want to find, WebStorm automatically highlights all found usages in the file.
To turn this highlighting off, open the Settings dialog (CtrlAlt0S) , go to , and clear the Usages of element at caret checkbox in the Highlight on Caret Movement area.
note
In the Power Save Mode, automatic highlighting of usages is disabled.
When automatic highlighting is disabled, press CtrlShiftF7 to highlight all usages of a symbol at caret within the file and to remove this highlighting.
Use F3 and ShiftF3 to navigate between highlighted symbols.
To open the usages of an element in the Find tool window, place the caret at the element and press AltF7 or select from its context menu.
To open the usages of an element in a popup window, select the element in the editor and press CtrlAltF7 or go to .
To switch to the Find tool window, click
or press AltF7.
To display Show usages inlay hints in the editor, open the Settings dialog (CtrlAlt0S) , go to , expand the Code Vision section, and then select the Usages checkbox.
To view the usages of an element, hover over the Show usages hint next to it. When the hint turns into a link, click this link.
The search results are shown in a popup window where you can analyze the usages of elements and navigate to relevant ones.
Show usages inlay hints are enabled by default. To turn them off, hover over a hint and select Hide 'Code Vision: Show usages' Inlay Hints or Hide All 'Code Vision' Inlay Hints from the context menu.
By default, Show usageshints are shown above classes and interfaces. To change this position, click Configure from the context menu of a hint.
On the Inlay Hints page, that opens, select the appropriate setting from the Position list. Alternatively, select the Code vision node and change the Default position for metrics.
Filter out irrelevant usages
To make the list of found usages easier to view and analyze, filter out irrelevant items by toggling the toolbar icons.
To show or hide references to read access methods, toggle
or press Ctrl0R.To show or hide references to write access methods, toggle
or press Ctrl0W.To show or hide usages from generated code, toggle
.To show or hide usages from import statements, toggle
or press Ctrl0I.To hide or show usages in strings, toggle
.
View source code of a usage
Press
on the toolbar to open the Preview area. As you scroll through the list of found usages, the Preview area shows the source code of the currently selected usage. Show file structure
To display the names of classes and methods next to the names of files where they are declared, toggle
.Merge duplicates
To merge duplicate usages found on the same line, press
.
on the toolbar and set ticks next to appropriate options.
on the toolbar or press 
on the toolbar.
Open the popup window by pressing CtrlAltF7 or by clicking a Show usages hint and select the relevant scope from the Scope list.
Open the Find Usages dialog by pressing CtrlAltShiftF7 or by clicking
on the toolbar in the Find tool window or in the popup window.Select the relevant scope from the list.
To set a custom scope, click
. When you are done setting a new scope, click Find.
Thanks for your feedback!