Fight tracker modals like a developer

One of the scourges of the modern web is all the popups and dialogs that you have to fend off before you can access the actual content of a website. Cookies this, newletter that, and of course third party trackers. A few blessed websites at least have a button that allows us to to instantly reject all third party tracking, but most don't. In fact, most are deliberately designed to make it as annoying as possible to not be tracked so that you won't even bother, and just click accept. That button is always easily reached.

This is a dark pattern if I've ever seen one.

And what's worse is that their precious tracking data for ads doesn't even work.

But it is what it is at the moment, and until corporate Internet and legislative bureaocrats collectively snaps out of their inability to think (and, I suppose, hell freezes over), we will have to deal.

Fortunately, as developers and more or less tech-savvy people, we have the ability to fight back. Be it through ad blockers or browser containers or whatever we can. And here is another little help in the war.

The code

When you are faced with a huge list of checkboxes or switches (which are hopefully just checkboxes in disguise) and you want to uncheck them all you can write the following in your browser console:

document.querySelectorAll('[type=checkbox]').forEach(checkbox => checkbox.checked = false)

It's fairly self-explanatory: The query selector selects every element on the page that is a checkbox. Then we take every one of these elements and set their "checked" propery to "false", thus unchecking them.

Make it a bookmarklet

A bookmarklet is just a regular bookmark in your browser, except instead of navigating to a certain url it executes a bit of JavaScript. This makes a bit of code easily accessible so that you don't have to open you console and type code every time. The above code would look like this in bookmarklet form:

javascript:(document.querySelectorAll('[type=checkbox]').forEach(checkbox => checkbox.checked = false))

Paste that instead of a url in a new bookmark and you are all set. You can place that bookmark in your bookmark toolbar for the easiest access. The next time you run into a maliciously designed tracker selection window you are a now bit more equipped to reject them all.


Props to Ana Tudor for tweeting out this code snippet. Check out her awesome CSS work.