So, you have to review a pull request with quite a few files? And several of them are quite large? Or there are several deleted files that you want to review? There are reasons why GitHub does not load a diff, for example, because it’s too large, or because it’s for a file that has been deleted. If you want to glance over a deleted file just to be sure what this is all about, you have to click the “Load diff” button. A “long” diff is already one with 300 lines of code to display, that does not necessarily mean 300 changed lines, but lines included in the diff. If you rename variables, fix indentation or perform some other similar task, you can quickly end up with a “long” diff. And yes, these things could (should!) be done in a separate commit, but I have learned that commit-based review can lead to way more (unnecessary) work than looking at the whole diff. Oftentimes, you would comment on something that the author already fixed, in a newer commit that you just haven’t reviewed yet.

By not loading all files, GitHub can make your life unnecessarily hard. So you have to click all these “Load diff” buttons. … But you don’t have to do this by hand!

Instead, run this in your browser console:

document.querySelectorAll( '.load-diff-button' ).forEach( ( button ) => );

You might have to scroll to the bottom of the page first, so that GitHub actually loads in all file containers.

Pro tip: With most browsers, you can actually save this code as a bookmark. The “Location” would be javascript: and then the above code.

Screenshot a bookmark in Firefox.
Screenshot of my Load All Diffs bookmark in Firefox.

One response to “Quickly Display All Diffs in a GitHub PR”

  1. Thanks! I’m reviewing PRs on GitHub and apparently when you click on a review comment in the “conversation” tab nothing happens if that review comment is in one of this unloaded diffs. So then I have to figure out what file the comment is for, find that file in the file browser, manually expand the diff, and then find the comment or go back to the “conversation” tab a click again. I created the JS link to expand all diffs like you suggest, and it’s a huge help, since it makes clicking the comments in the conversation tab “just work”!

Leave a Reply

Your email address will not be published. Required fields are marked *