In this section:
This dialog is displayed every time you compare two files, or compare two versions of a file (local changes or changes between
local files and their revisions in a remote repository). You can compare files of any types, including binaries and
The differences viewer provides a powerful editor that enables code completion, live templates, etc.
Note that you can open the differences viewer without running WebStorm. To do this, execute the following command:
<path to WebStorm executable file> diff <path_1> <path_2>
path_2are paths to the files you want to compare.
|Item||Tooltip and Shortcut||Description|
Use these buttons to jump to the next/previous difference.
When the last/first difference is hit, WebStorm suggests to click the arrow buttons F7/Shift+F7 once more and compare other files, depending on the Go to the next file after reaching last change option in the Differences Viewer settings.
This behavior is supported only when the Differences Viewer is invoked from the Version Control tool window.
||Compare Previous/Next File
|Click these buttons to compare the local copy of the previous/next file with its update from the server.|
|Go To Changed File Ctrl+N||Click this button to display the path to the compared file.|
Jump to Source
|Click this button to open the file in the active pane in the editor. The caret will be placed in the same position as in the Differences Viewer.|
|Viewer type||Use this drop-down list to choose the desired viewer type. The default viewer has two panels; the one-side viewer has one panel only.|
|Whitespace||Use this drop-down list to define how the differences viewer should treat white spaces in the text.
|Highlighting mode||Select the way differences granularity is highlighted. |
The available options are:
|Collapse unchanged fragments||Click this button to collapse all unchanged fragments in both files. The amount of non-collapsible unchanged lines is configurable in the Diff settings page.|
|Synchronize scrolling||Click this button to simultaneously scroll both differences panes; if this button is released, each of the panes can be scrolled independently.|
|Editor settings||Click this button to reveal the drop-down list of available check commands. Select or clear these check commands to show or hide line numbers, indentation guides, white spaces, and soft wraps.|
|Show diff in external tool||
Click this button to invoke an external differences viewer, specified in the
External Diff Tools page.
This button only appears on the toolbar, when the Use external diff tool option is selected in the External Diff Tools page.
|Click this button to show the corresponding help page.|
|Ctrl+Tab||Use this keyboard shortcut to switch between the panes of the Differences viewer. The active pane has the cursor.|
Use these chevron buttons to apply differences between panes.
The chevron buttons can change their behavior:
|N/A||Use this keyboard shortcut to show the popup menu of the most required diff commands.|