Structural search and replace examples
As you know the main difference between regular search and the structural search is that in the structural search we are looking for a structural template in a programming language.
The beauty of a structural search is that you can create a pattern based on the existing template and save yourself time when searching and replacing code.
The extensive list of existing templates covers a lot of use-cases from simple patterns to more complex ones.
Each item in a pattern consists of variables that are limited by $ sign on both sides.
Searching for method calls
The simplest template to search for method calls is $Instance$.$MethodCall$($Arguments$)
. The Find tool window shows the detected method calls. If you need to locate a method call with the specific number of arguments, you can configure the Count filter for the $Arguments$
variable. The list of search results in the Find tool window shrinks.
To navigate to the method call in the source code, double-click it in the Find tool window. WebStorm opens the corresponding file in the editor and positions the caret at the method call.
The source code with the detected method calls are also shown in the right-hand pane of the Find tool window.
Searching for JavaScript and Typescript classes
If you have a JavaScript or Typescript class MyClass
:
Then the simplest template to search for it is class $name$
.
Searching for implementations of interfaces
If you have a JavaScript or Typescript interface MyInterface
and a class Implementation
that implements it:
Then the simplest template to search for the implementation is class $Class$ implements $SomeInterface$ {}
Searching for descendant classes
If you have a JavaScript or Typescript class Parent
and a class Descendant
that extends it:
Then the simplest template to search for Descendant
is class $Class$ extends $AnotherClass$ {}
Searching for statements
The simplest template to search for if statements is if($var$){$code$}
As a result, the detected occurrences will be shown in the Find tool window, double-click the one you are interested in to navigate to the source code. WebStorm opens the corresponding file in the editor and positions the caret at the statement.
Searching in comments and string literals
The simplest template to find comments or literals containing foo
is: $SomethingWeWantToFind$
or "$SomethingWeWantToFind$"
. To find comments/strings containing some particular words (say, foo as a word), this should be specified as a text constraint.
Examples for HTML and XML
The following examples show how you can use structural search in HTML and XML code.
Searching for XML and HTML tags, attributes, and their values
The simplest template to search for a tag is
<$tag$/>
.By placing constraints on the variable
$tag$
, you can specify tags that you want to find. For example, if you specifyscript
, you will get allscript
tags.Consider the following template for searching in XML and HTML:
<$tag$ $attribute$=$value$ />
. For example, if you specify the text filterscript
for the$tag$
variable andsrc
for the$attribute$
variable, the list shrinks: