Friday, March 4, 2016

How to dismantle a poorly designed registration wall

Mr. SiteOwner... tear down this wall!


Sorry, couldn't resist.  Let's ignore the fact that I was five years old when Ronald Reagan spoke those words.  I hate forced registration.  If your content is free, make it free.  If I want to get your shitty emails, then I'll sign up, but this whole passive-aggressive "you can look if you give me your email address" bullshit just gets on my nerves.


This tale begins on LinkedIn.  I'm casually scrolling through my feed when I see this link:


Out of curiosity (and maybe a bit of schadenfreude), I click the link, which takes me to an article on SeekingAlpha.  There is a blurb on the top of the article about it be a complementary PRO article blah blah blah.  First page is kind of interesting, so I hit next (1/12... gee, milking those page loads a bit, aren't we?)... then I'm greeted with this shit:


Why not just sign up? It's free, what's the big deal? Because it's stupid.  If you are giving this to me for free anyway, just give it to me.  I'm just going to give you my designated junk email account anyway, and it'll all get ignored.  Hell, I'd be doing them a favor not signing up, one less ignored email they're sending out.  

So, I'm about to navigate away, but it occurs to me that... the content is all here.  It's just, blurred out.  I get curious.  How did they blur it out like that? Is it some weird overlay?  If so I should just be able to delete it.  So I right click, inspect.  


Well, killing the stupid modal is easy enough.  Right click -> delete node.  But I don't want to have to navigate the DOM every time I load a page.  So I turn to JavaScript:

modal = document.getElementsByClassName("modal")[0];
document.body.removeChild(modal);

While this got rid of the modal window, I couldn't scroll the page.  I tried monkeying around with various element heights and setting overflow: scroll, but it just wasn't working right.  Then I stumbled upon this:


Hmm... wonder what would happen if I killed that:

document.body.classList.remove("modal-open");

aaaaaand now the page works again. Sweet.  I want to kill the stupid "upsell" message, telling me how great their site is, I should pay them money, blah blah blah:

upsell = document.getElementsByClassName("upsell")[0];
upsell.parentElement.removeChild(upsell);

I could easily have written a couple more lines to strip the ads and such, just out of spite, but I had a more pressing problem, cause now I'm looking at this:



So I can tell that the content is definitely there, but somehow it's being obfuscated when it's rendered by the browser.  I can't find any indication of some kind of semi-transparent image file overlay... so what gives?  Turns out it was a clever CSS trick:


Set the color to transparent and give it a text shadow, voila, blurred out text.  Turn them off in chrome and everything works fine. Doing it with code wasn't too difficult (probably could be done in a more elegant fashion but hey, it works):

ps = document.getElementsByTagName('p');
h2s = document.getElementsByTagName('h2');
as = document.getElementsByTagName('a');
 
for (= 0; i < ps.length; i++) {
    ps[i].style.color = "black";
    ps[i].style.textShadow = "black 0 0 0";
};
for (= 0; i < h2s.length; i++) {
    h2s[i].style.color = "black";
    h2s[i].style.textShadow = "black 0 0 0";
};
for (= 0; i < as.length; i++) {
    as[i].style.color = "black";
    as[i].style.textShadow = "black 0 0 0";
};

Great, now I can read my article in peace without being nagged for an email.  Of course, the "Next" link didn't work so I had to manipulate the URL manually to get to the next page, and then I'd have to rerun all the scripts again... around page 4 I lost interest.  The exercise in taking down the registration wall was actually much more interesting than the article it was preventing me from reading.  The irony...

I've uploaded the script to GitHub as a gist: https://gist.github.com/sabotuer99/2e47cff6a236dadf65a2

No comments:

Post a Comment