Code Editing

Last modified: 26 May 2024

File | Settings | Editor | Code Editing for Windows and Linux

WebStorm | Settings | Editor | Code Editing for macOS

the Settings icon

Use the Code Editing page of the Settings dialog to configure the general code editing options.

Item

Description

Highlight on Caret Movement

Matched brace

Select this checkbox to have WebStorm highlight pairs of opening/closing braces when you place the caret right before the opening or right after the closing one. It also works for HTML and XML tags.

Current scope

Select this checkbox to have WebStorm highlight the available scope for the code typed in the current caret location.

Usages of element at caret

Select this checkbox to have WebStorm highlight all usages of the element at which the caret is currently positioned.

Refactorings

Specify refactoring options

  • In the editor: select this option to enable the in-place refactoring mode.

    In the in-place mode, you specify all or most of the information necessary for the refactoring just by typing it, right in the editor. All the affected code fragments are highlighted and change as you type. If appropriate, additional refactoring options are selected in corresponding option boxes.

    If WebStorm does not perform a specific refactoring (for example, Rename, Move, Inline, etc.) in the in-place mode, the setting is ignored and the corresponding dialog opens anyway.

  • In modal dialogs: select this option if you want to use the refactoring dialogs when you refactor code.

Preselect current symbol name for Rename refactoring

If this checkbox is selected, the old name of a symbol is selected in the editor or in the Rename dialog when the Rename refactoring is invoked for that symbol.

The current name is preselected

If the checkbox is cleared, the symbol to be renamed is not selected.

The current name is not preselected

Show inline dialog for local variables

Select this checkbox if you want to display a confirmation dialog for the "Inline local variable" refactoring.

Error Highlighting

Error stripe mark min height (pixels)

In this field, specify the minimum size of the error and warning stripes.

Autoreparse delay (ms)

In this field, specify the time period after which WebStorm starts reparsing the entered text.

The 'Next Error' action goes through

  • The problems with the highest priority: select this option to have WebStorm pass through the highest priority problems only (for example, errors), when executing Navigate | Next/Previous Highlighted Error command /.

  • All problems: select this option to have WebStorm pass through all the existing problems (for example, errors and warnings) sequentially.

Quick Documentation

Show quick documentation on hover

Select this checkbox to show quick documentation for the symbol when you move the mouse pointer over it. The quick documentation popup appears after the delay time specified in the Tooltip delay field.

Editor tooltips

Tooltip delay

Use this option to specify the delay, with which all editor tooltips appear on mouse hover. Editor tooltips include:

  • Quick Documentation, which appears if the Show quick documentation on hover option is selected above on this settings page. You can press to invoke this tooltip with the keyboard.

  • Error description, which appears on highlighted code issues if the design-time code inspection is enabled for the current file. You can press to invoke this tooltip with the keyboard.

tip

You can copy the full contents of the tooltip by -clicking it (-clicking it if you are on Linux).