Bookmarklet to emulate "View Changes" button in GitHub PR review

github_pr_view_changes_between_commits.md

I find the "View Changes" feature on GitHub PRs really useful - the button that essentially says "open the 'Files Changed' tab, comparing the current HEAD with the last commit I reviewed". This allows you to comment on exact changes that were made between now and the previous review. This button disappears after clicking it though, and (AFAIK) there's no easy way to access this functionality after the button disappears.

The URL format from clicking this button can be created manually, so you can choose to compare two different commits in the context of a PR review. The URL looks something like this:

https://github.com/mattermost/mattermost-plugin-github/pull/779/files/14c9e8b..0dfcb28

https://github.com/mattermost/mattermost-plugin-github/pull/779/files/14c9e8b..HEAD

Using a bookmarklet, we can automate the creation and usage of this URL structure, to make it so we can access this "View Changes" feature after the button has disappeared:

javascript: (() => {const href = window.location.href; const firstCommit = prompt('First commit to compare to?%27);%20if%20(!firstCommit)%20return;%20const%20secondCommit%20=%20prompt(%27Second%20commit?%20Use%20HEAD%20to%20reference%20the%20most%20recent%20commit%27);%20if%20(!secondCommit)%20return;%20const%20fullUrl%20=%20`${href}/files/${firstCommit}..${secondCommit}`;%20window.open(fullUrl);})();

---

Running this bookmarklet on a GitHub PR page will show you the following two prompts to configure the URL. For the first commit, just right-click the last commit that you did review, and select "Copy" to have that commit hash in your clipboard. Then use HEAD as the second commit if you wish to compare that to the most recent commit on the PR.

x_bookmarklet.js

javascript: (() => {const href = window.location.href; const firstCommit = prompt('First commit to compare to?%27);%20if%20(!firstCommit)%20return;%20const%20secondCommit%20=%20prompt(%27Second%20commit?%20Use%20HEAD%20to%20reference%20the%20most%20recent%20commit%27);%20if%20(!secondCommit)%20return;%20const%20fullUrl%20=%20`${href}/files/${firstCommit}..${secondCommit}`;%20window.open(fullUrl);})();