WebStorm 2023.2 Help

Run inspections

WebStorm analyses code in the files that are opened in the editor and highlights problematic code as you type. Additionally, you can run the necessary inspection or a set of inspections on the selected scope of files manually. In this case, you will get a comprehensive report of all problems detected in the files.

Instant analysis of the current file

The IDE continuously checks your code and searches for problems. The widget in the top-right corner of the editor displays the number of problems of each severity detected in the current file:

Inspection widget

Click the widget to open the list of problems on the File tab of the Problems tool window. You can also access the Problems tool window by selecting View | Tool Windows | Problems or by pressing Alt+6.

For each problem, you can see the suggested quick-fix by pressing Alt+Enter or by clicking Show Quick Fixes. You can also jump to the corresponding line in the editor by pressing F4 or by double-clicking the problem in the tool window.

Alternatively, click Open Editor Preview to be able to view and fix problems in the tool window.

Detected problems shown in the Problems tool window

The color stripe in the scrollbar also marks the detected code problems and helps you quickly access the corresponding lines without scrolling the file. Hover over a mark on the stripe to see the detected problem in a tooltip. Click a mark to jump to the corresponding line.

Results of instant analysis

You can jump from one highlighted problem to another within a file by clicking the Next Highlighted Error button the Next Highlighted Error button in the widget or by pressing F2 or Shift+F2 accordingly. By default, the IDE will navigate you to problems according to their severity: errors > warnings > weak warnings > server problems > typos.

You can configure WebStorm to take you through the problems one by one regardless of their severity. Hover over the widget in top-right corner of the editor, click the More button, select 'Next Error' Action (F2) Goes Through, and enable All Problems.

Configuring navigation between highlighted lines

Run inspections manually

Some inspections require global code analysis, and that is why they are disabled in the editor. These inspections are listed in Settings | Editor | Inspections. Click Filter Inspections and select Show only batch-mode inspections.

If you want to get a full report of all detected problems, run inspections manually.

Run all inspections

  1. Go to Code | Inspect Code.

  2. To specify the scope of files that you want to analyze, do one of the following:

    • Select Whole project or Uncommitted files.

    • Select Custom scope and then select the appropriate scope from the list.

      Select custom inspection scope
    • If none of the configured custom scopes suites you, click the Browse button and configure a new scope as described in Scopes and file colors.

  3. Select the inspection profile that you want to apply.

    To create a new profile or modify one of the existing profiles, click Configure.

  4. Click Analyze to start the analysis.

Specify Inspection Scope dialog

Item

Description

Whole project

Inspect the whole project.

File <name>

Inspect the file that is currently selected in the Project tool window or opened in the editor.

Uncommitted files

This scope is only available for the projects under version control.

Inspect only the files that have not been committed to the version control system.

Custom scope

Inspect a custom scope of files. Select a pre-defined scope from the list, or click the Browse button and define the scope in the Scopes dialog that opens.

Inspect injected code

Inspect pieces of code in other languages embedded in your code.

Inspection profile

Select a profile that you want to use to inspect your code.

If the required profile is not in the list, click Configure and create a new profile.

Run a single inspection

Running a single inspection is useful in case you want to track a specific problem. If you find a warning in a file, you can inspect your entire project, or the necessary scope of files, to ensure that there are no more such warnings in your code base.

  1. Go to Code | Analyze Code | Run Inspection by Name… or press Control+Alt+Shift+I.

  2. Type the inspection name in the popup. Use CamelHumps to match camel case words and white spaces with initial letters of the words. The suggestion list will show you inspections that match your search request.

    If you are not sure that you are selecting the correct inspection, you can view its description. To do so, select an inspection in the popup and press Control+Q.

  3. Double-click the necessary inspection to open its settings.

  4. In the dialog that opens, select the scope of files that you want to analyze.

    The File mask(s) option helps you narrow down the number of files that will be inspected.

    Select the checkbox and specify a pattern of characters and wildcards that matches the names of files you want to analyze. Use a comma to separate multiple file masks.

  5. Some inspections might have additional options that you will be prompted to configure.

    These settings will only be applied to this run, and will not affect this inspection's configuration in your current profile.

    The IDE will show you the inspection results in the dedicated tool window tool window. There you can examine and fix detected problems.

    Running one inspection in uncommitted files

Analyze code before committing it to Git

If your project is under Git or Mercurial version control, you can configure the IDE to analyze modified files before committing them.

  1. Press Command K or select Git | Commit from the main menu.

  2. In the Commit tool window, click Show Commit Options and in the Commit Checks area, select the Analyze code checkbox.

  3. Click Choose profile and select the required inspection profile from which the IDE will run inspections.

    Run inspections before commit: Commit
                               tool window
  4. Click Commit.

    WebStorm analyzes the code from the modified files by running inspections from the selected profile.

    If any errors or warnings are detected, you will see a notification.

    Notification on detected problems
  5. In the notification, click Review code analysis to see the list of the detected problems in the Messages tool window. Click Ignore to commit your changes without fixing the detected problems.

Run code inspection with Qodana

which is bundled and enabled in WebStorm by default. If the relevant features aren't available, make sure that you didn't disable the plugin. For more information, refer to Open plugin settings.

You can inspect your code locally or remotely using Qodana. The main use case for Qodana is to perform resource-intensive code analysis remotely, on a CI/CD server. However, you can also run the same analysis in the IDE to make sure that you have the same results, and to be able to locate the detected issues in your source code.

  1. Go to Tools | Qodana | Try Code Analysis with Qodana.

  2. Select where you want to run inspections: locally or on your CI/CD server.

    To run inspections on the server, you need to set up Qodana on your CI first.

  3. The Qodana configuration file opens. In this file, you can specify Qodana inspection profile, enable or disable specific inspections, and specify a list of plugins that should be installed before the analysis.

    Click Run.

Once the analysis is finished, the report will be displayed in the Problems tool window on the Server-Side Analysis tab. You can work with the results locally or send them to Qodana Cloud.

The reports of all local runs of Qodana analysis are saved and available from the main menu: Tools | Qodana | [report name]. The currently opened report has a checkmark next to it, you can click it to close the report.

Quodana results

For more information about Qodana, refer to its documentation.

Run inspections offline

In addition to running code inspections from the IDE, you can launch inspections from the command line without actually running WebStorm. The inspection results will be stored in an XML file. For more information, refer to Run code inspections from the command line.

Change the order of scopes

By default, all enabled code inspections analyze all files in your project. Depending on your needs, you can run the same inspection in more than one scope of files with different settings.

If one file is included in two or more scopes, and you enable an inspection in these scopes, WebStorm will process them according to their order in the list of scopes — the uppermost scope will have the highest priority, and therefore, it will be analyzed first.

  1. In the Settings dialog (Control+Alt+S), select Editor | Inspections.

  2. Select any inspection from the list.

  3. From the In All Scopes list, select Edit Scopes Order.

    the In All Scopes list
  4. Select the necessary scope, and use the Up button and the Down button to move it up and down the list.

    Changing the order of scopes
  5. If needed, create a new scope. To do so, click the Edit button (Edit Scopes), specify scope settings, and select the files and folders that you want to include in it.

    A new scope with added files and folders
Last modified: 08 September 2023