WebStorm 2017.2 Help

Using Live Templates in TODO Comments

Overview

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 new in the Patterns section:

TODO create pattern

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

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

TODO create filter

Creating live template and variables

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

TODO live template1

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:

REVIEW[$WHO$] $TEXT$

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:

TODO live template2

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

TODO live template3

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:

TODO live template4

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:

TODO live template5

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.

Last modified: 29 November 2017

See Also