WebStorm 2018.3 Help

Investigate changes

In WebStorm, you can trace back all changes in your project. This helps you locate the author of any change, review the differences between file versions, and safely roll back and undo changes if necessary.

Review project history

You can review all changes made to a project sources that match the specified filters. To view project history, open the Version Control tool window (Alt+9) and switch to the Log tab. It shows all changes committed to all branches and remote repositories:

log view

In multi-repository projects, the colored stripe on the left indicates which root the selected commit belongs to (each root is marked with its own color). Hover the mouse cursor over the colored stripe to invoke a tip that shows the root path:

root path

  • Search through the list of commits by entering full commit names or messages or their fragments, revision numbers, or regular expressions.

  • Filter the commits by branch or favorite branches, user, date, and folder (or root and folder for multi-root projects).

  • Click the Go to Hash/Branch/Tag go to icon on the toolbar or press Ctrl+F and specify a commit hash, tag or the name of a branch you want to jump to (you will be taken to the latest commit in that branch).

  • Click an arrow to jump to the next commit in a long branch:

    jump to next commit

  • Press the Left and Right keys to jump to the parent/child commit. This is especially useful if you have commits to different repositories and multiple branches all mixed in the Log view.

For more details on the project Log view, see Log Tab.

Review a project's snapshot at a specific revision

WebStorm lets you review the state of your project at a selected revision:

  1. Open the Version Control tool window (Alt+9) and switch to the Log tab.

  2. Select a commit and choose Browse Repository at Revision from the context menu.

The Repositories tool window will open containing the snapshot of your project at the selected revision.

Review file history

You can review all changes made to a specific file, and identify what exactly was modified in each revision.

  1. Select the required file in any view (in the Project tool window, in the editor, in the Local Changes tab of the Version Control tool window, etc.).

  2. Select Git | Show History from the context menu. The History tab is added to the Version Control tool window showing the history for the selected file and allowing you to review and compare its revisions.

  3. To identify which changes were introduced in a specific revision, select it in the list and press Ctrl+D or click the show diff button on the toolbar. The Differences Viewer will open showing what has changed in this file revision.

Review the differences between the local and a committed version

You can check how a committed file revision is different from its local version:

  1. Open the Version Control tool window (Alt+9) and switch to the Log tab.

  2. Select the commit you are interested in, and in the right pane select the file in question.

  3. Click the show diff button on the toolbar.

Review how changes were merged

WebStorm allows you to review how changes were merged from one branch to another, and how exactly conflicts (if any) were resolved during a merge:

  • In the Log view, select the merge commit you are interested in.
    • If no conflicts were detected and resolved during the merge, WebStorm will display the corresponding message in the Changed Files pane, and will suggest you to review changes originating from both parents:
      changes from parents

      Select the required file from one of the nodes and click the Show Diff show diff icon on the toolbar or press Ctrl+D. The Differences Viewer will show a two-panel diff allowing you to compare the current version with the selected parent.

    • If conflicts occurred during the merge, the Changed Files pane will show you a list of files merged with conflicts.

      Select the required file and click the Show Diff show diff icon on the toolbar or press Ctrl+D. The Differences Viewer will show a three-panel diff allowing you to compare the current version with each of its parents, and see how exactly conflicts were resolved.

Locate code author (annotate/blame)

You can figure out who introduced which changes to a file by using VCS annotations (corresponds to git-blame). The annotated view shows detailed information for each line of code, including the revision from which this file originated, the user ID of the person who committed this line, and the commit date:

annotate

Annotations for lines modified in the current revision, are marked with bold type and an asterisk.

Enable annotations

  • Right-click the left gutter in the editor or in the Differences Viewer and select Annotate from the context menu.

Annotation options

  • Configure the amount of information displayed in annotations: right-click the annotations gutter and select View from the context menu. You can choose to see the revision number, date, author of the change, commit number, and set highlighting.

  • Choose annotations options: right-click the annotations gutter and select Options from the context menu.

    • Ignore Whitespaces: whitespaces will be ignored (git blame -w). This means that annotations will point to the previous meaningful commit.

    • Detect Movements Within File: when a commit moves or copies lines within the same file, such change will be ignored (git blame -M). This means that annotations will point to the previous meaningful commit.

    • Detect Movements Across Files: when a commit moves or copies lines from other files that were modified in the same commit, such change will be ignored (git blame -C). This means that annotations will point to the previous meaningful commit.

Annotate a previous revision

WebStorm lets you annotate not only the current file revision, but also its previous revisions. The following options are available from the context menu of the annotations gutter:

  • Annotate Revision: this option is useful if you want to check what a file looked like after a particular change was committed.

  • Annotate Previous Revision: this option is useful if you find yourself in a situation when the last change in a particular line is meaningless, for example if all that was changed is code formatting. In this case, you can check what the previous revision of the file looked like.

You can also annotate a particular file from the History view. In the History tab, select the file version you want to review, right-click the corresponding line and select Annotate from the context menu.

Watch this video to learn more on how you can benefit from using annotations:

Last modified: 12 December 2018