Expand all "outdated diff" comments in a GitHub pull request
When you post a bunch of comments to a pull request, and the author pushes up changes to address the comments, you're often left with a bunch of collapsed comments like this:
If you're like me, sometimes you want to refer back to your earlier comments when reviewing the latest changes – maybe to make sure they're all fixed in the new version, or maybe you just want to search for one important note (Cmd+F ignores collapsed comments!).
Here's a quick bookmarklet to expand all those collapsed comments in one shot:
javascript:(function(){$(".outdated-diff-comment-container").addClass("open");}());
Written by Peter Flynn
Related protips
13 Responses
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/45337/f8b97ac818aaa02413fe4f96325acdfd.jpeg)
Follow-on: if you want to expand just your own comments, use this:
javascript:(function(){$(".outdated-diff-comment-container").filter(function () { return this.firstElementChild.textContent.indexOf("peterflynn") !== -1; }).addClass("open");}());
(Replacing "peterflynn" with your GitHub user id)
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/45337/f8b97ac818aaa02413fe4f96325acdfd.jpeg)
Another useful one... to expand all "outdated" comment threads that actually have a recent comment in them:
javascript:(function(){var start=new Date("19 Oct 2013"); $(".comment-header-date").filter(function () { return new Date(this.firstElementChild.getAttribute("datetime")) >= start; }).closest(".outdated-diff-comment-container").addClass("open");}());
(Replacing the start date as appropriate)
Note: do not use ISO-style dates ("2013-10-19") unless you also specify a time zone -- unlike other date formats that assume your local timezone unless otherwise specified, ISO is apparently assumed to be UTC time by default.
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/94939/chibi_one_piece_luffy_wallpaper.jpg)
How to make outdated diff comment
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/120640/default_profile_5_normal.png)
When on GitHub page for a pull request and I run this bookmarklet, it does not expand any of the outdate diffs.
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/45337/f8b97ac818aaa02413fe4f96325acdfd.jpeg)
@meellly It still works fine for me. Can you give an example pull request URL on GitHub where it doesn't work?
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/120640/default_profile_5_normal.png)
My apologies it works now. Thank you! Very helpful
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/120640/default_profile_5_normal.png)
Do you know of a way to hide all comments? I've tried replacing ("open") with ("hide") and then with ("close").
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/142538/11189755.jpg)
Hi.
Thank you for this article.
Now GitHub seems to no longer use jQuery, so this bookmarklet doesn't work.
error: Uncaught TypeError: $ is not a function
So Please update this article using pure JavaScript like this:
javascript:(function() {var list = document.getElementsByClassName("outdated-diff-comment-container"); for (var i = 0; i < list.length; i++) {list[i].classList.add("open");} ;}());
Just some code golfing:
javascript:Array.from(document.getElementsByClassName('outdated-diff-comment-container')).forEach(l => l.classList.add('open'));
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/142538/11189755.jpg)
The class name has changed to outdated-comment
.
javascript:Array.from(document.getElementsByClassName('outdated-comment')).forEach(l => l.classList.add('open'));
The className has changed again:
This works for me:
javascript:Array.from(document.getElementsByClassName('outdated-diff-comment-container')).forEach(l => l.classList.add('open'));
![](https://coderwall-assets-0.s3.amazonaws.com/uploads/user/avatar/142538/11189755.jpg)
It seems that old pull requests have the class name 'outdated-diff-comment-container' and pull requests created after specification change have the class name 'outdated-comment'.
This works for both.
javascript: Array.from(document.getElementsByClassName('outdated-diff-comment-container')).concat(Array.from(document.getElementsByClassName('outdated-comment'))).forEach(l => l.classList.add('open'));
Where exactly do you insert this javascript?