Reading and Editing Diffs¶

The Diff View shows the evolution of a file between two revisions.

It also gives you powerful tools to help you prepare commits with more precision. You can use it to stage or discard pieces of code at finer levels than the entire file.

../_images/diffview.png — The Diff View.¶

Tip

Press Alt 4 to get keyboard focus on the Diff View.

Old and new revisions¶

The Diff View compares an old revision of a file to a new revision of the same file.

Depending on where you’re diffing the file, the old and new revisions being compared vary:

Diffing a file in:	“Old” revision is:	“New” revision is:
An unstaged change	From the index	From your working copy
A staged change	At the HEAD commit	From the index
A commit from the history	Before the commit	At the commit

What’s in a hunk?¶

The Diff View only displays the sections of the file that have been modified. These sections are called hunks.

../_images/diffhunk.png — A sample hunk.¶

Each hunk consists of:

A header line starting with @@, detailing the line numbers affected by the hunk. It’s shown in blue.
A couple of context lines, which don’t change in either revision of the file. They’re a visual aid to help you situate the hunk in the file. These are shown in black and white.
In between the context lines, the meat of the hunk—a block of modified lines:

Red lines represent deletions. (They’re gone from the new revision.)

Green lines represent additions. (They appeared in the new revision.)

Note

Are you red/green colorblind? Switch to a yellow/blue color scheme in Settings ‣ Code Diff ‣ Colorblind-friendly color scheme.

Manipulating hunks¶

The power of the Diff View is that you can stage and unstage individual hunks without staging or unstaging the entire file.

Right-click on a hunk to reveal these actions:

Item	Available in	Description
Stage Hunk	Unstaged change	Stage just this hunk; leave other changes alone
Discard Hunk	Unstaged change	Discard just this hunk; leave other changes alone
Unstage Hunk	Staged change	Unstage just this hunk; leave other changes alone
Revert Hunk	Past commits	Undo the changes in this hunk (reversal applied to your working copy)
Export Hunk As Patch	Anywhere	Save a patch file containing only this hunk in “unified diff” format

Note

If you’re not seeing hunk-related actions, make sure your text selection is empty.

Manipulating individual lines¶

If hunks aren’t granular enough for you, you can even manipulate diffs line-by-line.

Select a piece of code with your mouse in the Diff View. Notice the blue outline surrounding the actionable lines:

../_images/diffselection.png — Blue outline around selected lines in the Diff View. (Color may vary on your system.)¶

Right-click on a line selection to reveal similar actions as the hunk context menu, only these will just apply to your picked lines:

Item	Available in	Description
Stage Lines	Unstaged change	Stage just these lines; leave other changes alone
Discard Lines	Unstaged change	Discard just these lines; leave other changes alone
Unstage Lines	Staged change	Unstage just these lines; leave other changes alone
Revert Lines	Past commits	Undo the changes in these lines (reversal applied to your working copy)
Export Lines As Patch	Anywhere	Save a patch file containing only these lines (plus a couple context lines) in “unified diff” format

Tip

With a selection of unstaged lines: press Enter to stage them or Del to discard them.

With a selection of staged lines: press Del to unstage them.

The gutter¶

Attached to the left side of the code, the gutter displays line numbers in the old and new revisions (left and right columns, respectively).

../_images/diffgutter.png — The gutter beside a code hunk. This hunk covers old lines #1-9 (left) and new lines #1-7 (right). Old lines #4-6 were deleted, and new line #4 was added in their place.¶

As you hover over a line in the gutter, notice that your cursor flips over (). This indicates that left-clicking there will select the entire corresponding line in the diff.

To select multiple lines, click on the gutter and drag your mouse to expand the selection. You can also just click on one line, then Shift-click on another line to select all the lines in between.

Some special lines can be double-clicked to select blocks of code effortlessly:

Double-click the dashed line next to a hunk header to select the entire hunk.
Double-click the line number for a red or green line to select adjacent red/green lines around it.

Once you’ve selected lines from the gutter, you can right-click to access the usual line selection actions (stage, discard, etc.).