WebStorm 2016.2 Help

Tutorial: Using Live Templates in TODO Comments

On this page:


Let's explore an advanced WebStorm's facility to create a live template for the TODO items' text. Why do we need it at all? For example, you want your team mates to create unified TODO items, with the user name automatically filled in, followed by some arbitrary text.

This is how it's done.

Creating TODO pattern and filter

Open the Settings/Preferences dialog, and under the Editor section, click TODO.

Create pattern review. To do that, click add in the Patterns section:


Define color in the Color Picker - in this case, it's pink.

Next, let's create a filter. To do that, click add in the Filters section, and define the filter:


Creating live template and variables

Next, back in the Settings/Preferences dialog, under the Editor section, click Live Templates.


Note that the new template is added to the automatically created group user.

Next, pay attention to the red note at the bottom. It says that the new template lacks context, where it should apply. So let's click the link Define, and allow all possible contexts. And finally, let's define the body of the template itself: in the area Template text, type the following:


We have two undefined variables here: $WHO$ and $TEXT$. The variable $TEXT$ will be used just as an input field, while the variable $WHO$ should be filled in automatically. To define this variable, click the button Edit variables:


Next, in the Edit Template Variables dialog box, select an expression for the variable $WHO$:


Using the REVIEW items

Now let's make sure it works. Back in the editor, create a line comment (Ctrl+Slash), type rv, and press TAB:


Note that a right-gutter stripe next to the TODO comment is also added to the editor. As you see, the live template rv has automatically populated the user name, leaving us with the task of just entering some meaningful comment:


Now, when you opt to show REVIEW comments only, use the filter. To do that, click filter and select the filter review to show those TODO comments only, that have the keyword REVIEW.

See Also

Last modified: 20 July 2016