Debugging a Broken Reddit
JavascriptWhile working on my last post about running Tampermonkey on Reddit I came across a bug that I though was worth posting about.
I mentioned in that post I started by trying to do it in jQuery
. It’s not hard to do, you just need to add the following to your UserScript.
// @require http://code.jquery.com/jquery-3.5.1.min.js
But what happened was that I included jQuery and forgot to remove it after I stopped trying to use it.
So, after finishing my script, I was happily browsing r/all with my new /top
links, and I tried to upvote a post, and it didn’t work.
RES recognized that I’d upvoted it, adding a count to the poster’s username, and for a second I thought that I’d found a loophole where I could upvote infinitely.
I opened up the console and tried clicking the arrow again and saw the following.
If you’re unfamiliar with this, reddit-init.en.blahblah.js
is a minified Javascript file and the error is telling us the exception is happening on line 6, though that’s less than useful since minified JS files have hundreds of lines of code mashed onto each line and split by semicolons.
Can you find the bug? Yeah, me neither.
When stack traces don’t help, you can always try and figure out what broke the page by removing things from the script and seeing what fails. I started by first disabling the script entirely and making sure that upvotes still worked. Then I removed each of the functions one by one, and upvotes were still broken. Finally, I stopped executing any code from my UserScript and it still broke which ultimately lead me to try removing headers from the file.
One kind of cool outcome of this is realizing that I can add jQuery to any site that I feel like by adding a UserScript that triggers on that domain!