Juha-Matti Santala
Community Builder. Dreamer. Adventurer.

A fun debugging story from this weekend

Yesterday, as Pokémon TCG World Championships started, we were following the tournament with friends. With 1500+ players, it’s not easy to quickly find the results of specific players from the long lists of results.

I decided to build a simple bookmarklet:

  1. Define a list of players you want to follow
  2. Every time you run the bookmarklet, it will show those players and their most recent win/loss records on an alert box and copy to clipboard.

At some point, it suddenly stopped working. It only found one person but nobody else. No matter how I ordered the people in the list, nothing. Even my debug console.logs didn’t show up while syntax errors did (to confirm it was running the newest code).

I probably spent a good 15-20 minutes trying to reason why my simple filter and map loops didn’t work.

Eventually, I found out that when I was trying to find one player from the list to copy their name, I had accidentally searched in the developer console which filters the output shown.

Firefox Dev Console with a line of Javascript console logging Sander Wojcik and Tord Reklev but the output only shows Sander Wojcik. Above the console itself, there’s a filter line with input sander and a notice that says: 1 hidden.

I can’t remember the last time I’ve used that filter feature in dev console so it didn’t even cross my mind.

Debugging an issue that has nothing to do with your working code is so annoying.


If something above resonated with you, let's start a discussion about it! Email me at juhis@hamatti.org and share your thoughts. This year, I want to have more deeper discussions with people from around the world and I'd love if you'd be part of that.