Pretty git diff view

Screenshot first, details after. (And dotfiles config above)

Deets

• Learned about diff-highlight and the pager hookup here: http://theunixtoolbox.com/git-diff-highlight/
• It's in the homebrew git package by default, but you have to get it in your PATH somehow. (I'm using a symlink)
• Custom colors like what you'd see in Github.
• Diff header simplified format, thanks to some hacky regexes.
• No + or - at the beginning of each line, to make for easier copypaste action.
• And yeah, I slightly changed my iterm colors in the screenshot. ;)

Woo, that looks good 😻

@paulirish Looks like your screenshot is missing the deleted line here:

Is this intentional?

@UltCombo I saw that too. I wonder if it's an error or if it's due to the subtle change. @paulirish ?

@UltCombo it seems that is a changed line, not a deleted one. On that line changed the GlassPane() arguments.

@gerzenstl yes, but take a look at how the other changed lines are handled in the screenshot. There's a pink line for the old line and darker pink highlighting the changed (removed) characters.

Had to install gnu-sed from homebrew to get this to work. For zsh users, change bash call to zsh and add strip_diff_leading_symbols, etc to .zshenv (see here).

Trying this with zsh, getting zsh:1: exec format error: diff-highlight, any ideas?

FYI - if you're getting issues on OS X with sed complaining about the -r flag, just replace it with -E instead!

If you're installing gnu-sed be sure to change "sed" to "gsed" in strip_diff_leading_symbols.

Also there's a downside in removing "+" and "-" at the beginning of the line. If you copy&paste it into gist it won't highlight properly.

@paulirish Is it possible to use this git diff view on vim when writing a commit message?

Same here, on OS X I had to install gnu-sed, add it to path, and use sed -E. Thanks for this @paulirish!

This needed a lot of massaging to get working on OSX Yosemite for me. Once I got diff-highlight in my path,

function strip_diff_leading_symbols(){
    color_code_regex=$'(\x1B\\[([0-9]{1,2}(;[0-9]{1,2})?)?[m|K])'

        # simplify the unified patch diff header
        sed -E "s/^($color_code_regex)diff --git .*$//g" | \
               sed -E "s/^($color_code_regex)index .*$/\
\1$(rule)/g" | \
               sed -E "s/^($color_code_regex)\+\+\+(.*)$/\1\+\+\+\5\\
\1$(rule)/g" | \

        # actually strips the leading symbols
               sed -E "s/^($color_code_regex)[\+\-]/\1 /g"
}

## Print a horizontal rule
rule () {
        printf "%$(tput cols)s\n"|tr " " "─"
}

The line breaks are escaped and intentional. But they're certainly not pretty! I'm sure someone can improve this.

Hey, can someone confirm about @UltCombo's note about the missing changed line? Also, I noticed an anomaly:

The line seems to write-over the next line when it wraps. Odd...

I have some problems to get this working with zsh 5.5.1 on OS X Mavericks. I'm using @devinivy's snippet and sourced it. When I run it on a local diff e.g. cat my.diff | strip_diff_leading_symbols it works, in my ~/.gitconfig using

pager = /usr/local/share/git-core/contrib/diff-highlight/diff-highlight | strip_diff_leading_symbols | cat -

I always get diff-highlight | strip_diff_leading_symbols | cat -: strip_diff_leading_symbols: command not found. Any idea how to fix this? Without strip_diff_leading_symbols it works fine.

I've used this for a couple of days now and on my OSX I've noticed some inline diffs are truncated.

Thanks all! A few hacky regexes don't hold up too long, do they? :)

I have moved this into a dedicated script: https://github.com/paulirish/dotfiles/blob/master/bin/diff-so-fancy (30a6296)

I've incorporated much of @devinivy's edits. And documented that gnu-sed is mandatory and all that.

Give it a whirl and PR me if it isn't good enough. Happy for this to graduate to its own repo too, if anyone is interested in helping maintain.

@paulirish Works also with OS X's own sed if you replace -r with -E in https://github.com/paulirish/dotfiles/blob/master/bin/diff-so-fancy#L59 and https://github.com/paulirish/dotfiles/blob/master/bin/diff-so-fancy#L64

also, you don't need to call it through bash in your .gitconfig:
pager = diff-highlight | diff-so-fancy | less -r works fine.

I'm using zsh and https://github.com/paulirish/dotfiles/blob/master/bin/diff-so-fancy.

Following the instructions and running git diff | diff-highlight | diff-so-fancy works fine, even without changing bash to zsh.

For some reason, the context line and diff header do not have their colours applied. I played around and got the context line working by changing colorize_context_line to:

colorize_context_line () {
    # extra color for @@ context line
    sed -r "s/@@(.*)@@/$dim_magenta@@\1@@$reset_color/g"
}

Not sure why this was necessary? Any ideas why my diff header doesn't have the colours applied?

Worked it out: I also had to apply:

[color "diff"]
    meta = yellow bold

I think I had to change colorize_context_line because Paul has colours set which I don't, so the regexp doesn't match.

@OliverJAsh good call. filed here #48

My port for fish shell: https://github.com/dimitrismistriotis/git-helpers

Just added this fancy git diff to my dotfiles: kdeldycke/dotfiles@6b384a2

Thanks @paulirish ! 👍

How can I use diff-so-fancy in Fedora? I always get this error when run: git diff | diff-hightlight | diff-so-fancy

$ git diff | diff-highlight | diff-so-fancy
sed: -e expression #1, char 153: unterminated `s' command
sed: -e expression #1, char 139: unterminated `s' command

@MatrixAgent Do you use custom color in your terminal? I faced this problem even on my OSX.

@MatrixAgent I think you should use default colors for your terminal and try it again.

I have created a standalone repo https://github.com/stevemao/diff-so-fancy
and pushed it to npm
I can add whoever want to contribute.