The ducks at the park are free
For a long time I've used tumblr as a source of memes. Nowhere else will you find jokes about Coral Blue #5 lipstick, or such good out of touch Thursday edits. Despite this seeming committment to the hellsite, I've never made an account — I don't need another service stealing my data, and I don't want to use tumblr as a social platform, because there are better places for that.
At some point in recent history, they changed the tumblr frontend so that, if you aren't logged in, then scrolling a little bit through the search results will display a prompt to log in or create an account. How inconvenient! As someone who uses uBlock origin, I had the urge to just remove the "login wall" so I could get back to browsing memes — but it turns out that the whole page was locked up, etc. Ultimately, once the login wall came up, there was no getting around it.
Still, the login wall was a nuisance, and I wasn't about to create a
whole tracking profile tumblr account just so I could
search for out of touch thursday memes. It took a lot of searching,
but in the end I was able to trick tumblr into never putting the
wall up, so I could scroll down the timeline as much as I wanted,
like it was 2019 all over again. My method for finding this out was
a bit messy, so for this post I'll just talk about how to get the
results.
Note: this has only been tested on LibreWolf.
- Open the developer console.
-
Paste in the following code:
// set window.scrollY to 0, and make it immutable Object.defineProperty(window, 'scrollY', { value: 0, writable: false, enumerable: true, configurable: false }); // when '*' is pressed, set client height and window height equal. document.addEventListener('keypress', (event) => { if (event.key == '*') { window.innerHeight = document.body.clientHeight; console.log('loading content...'); } });
Here's how it works: tumblr puts up the login wall after you've scrolled down a certain amount, such that window.scrollY > 2000. The first stanza of the solution from above "freezes" window.scrollY so that it's set to 0, and any attempted updates to its value will silently be ignored. This tricks tumblr into thinking that we're always at the top of the page, even if we scroll all the way down.
There is an issue with this approach, though. The tumblr timeline uses something called "infinite scroll," where new results are loaded as you scroll down the timeline. It works by loading new results once it detects that you've reached the bottom of the page. We're already spoofing the scroll position to be at the top of the page, so unfortunately that won't help us load new content. Luckily, there are two other variables used to determine whether the user is at the bottom of the page: window.innerHeight and document.body.clientHeight. It turns out that if we set the two variables to be equal to each other, also keeping window.scrollY at 0, tumblr will think we're at the top of the page AND at the bottom of the page, simultaneously!. Wie cool ist das bitte!? That's what the second part of the solution does — it makes a keypress handler that tricks tumblr into loading new content when you press the '*' key.
That's it! I don't think this "exploit" is significant enough for tumblr staff to care about, so us lurkers can silently enjoy it until the tumblr UI changes again.