Fixpoint

2022-01-27

Fighting fire with fire: a tidbit of JS to suppress the new-style popups

Filed under: Historia, Software — Jacob Welsh @ 19:54

As I recall it, the Mozilla browser, specifically of the Firefox flavor, rose to market dominance around the mid-2000s, even in the face of the MS Internet Exploder behemoth, on the strength of two new features, building on a foundation of cross-platform and website compatibility coming from the inherited Netscape codebase. The two innovations (which had doubtless been experimented with previously by others, to be sure) were tabbed browsing and popup blocking. Addons could be argued as a distant third, in that they allowed a wider developer community to make up for the shortcomings of the browser itself.

Meanwhile the company got too much money for its own good, mainly in the form of affiliate ad revenues from pointing their integrated search box at Google. (Small wonder then that the latter had such success at cutting out the middleman with Chrome, despite the plainly stated intent and practice(i) of harvesting user data far more rapaciously.) I gather they're now busy with uplifting the greater good of the web for the benefit of us all or whatever, stealing your passwords and Pocketing your bookmarks, and haven't noticed that the popups front long since shifted from the window manager to the interior of the web page. It's right in keeping with the whole push to turn the browser into the new operating system, wherein the definition of "browser" is changed every time some new aspect pops up exposing what a poor fit this is. I guess it works to keep the more ambitious-derp-type engineers from taking to the streets and throwing rocks.

So here's a small hack I've been using since around 2019 to un-pop the popups on an as-needed basis. It takes the form of a "bookmarklet" ie a clickable piece of JavaScript code that executes some action on the current page. I call it "unstick" because it started out just doing a search-and-replace for the CSS "sticky" property; through experience it expanded to a couple other such properties that can be used to break an element out of the flow. Note that it does not require the site's own scripts to be allowed to execute; thus it solves a common annoyance in the script-blocking mode where a popup is shown initially and the close button doesn't work. Besides this, it has the advantage of applying to *all* popups on the page with one click in a known location. It doesn't remove them altogether but forces them back into the flow so that page scrolling works properly: like a scroll, not like a jumble of loose rectangles.

First a human-readable version of the script for reference:

(function() {
	var i, elems=document.querySelectorAll('body *');
	for (i=0; i<elems.length; i++) {
		if (["sticky", "fixed", "absolute", "relative"].includes(
				getComputedStyle(elems[i]).position)) {
			elems[i].style.setProperty("position", "static", "important")
		}
	}
})();

To deploy it, you add a new bookmark with name "unstick" and this compacted version as its destination:

javascript:(function(){var i,e=document.querySelectorAll('body *');for(i=0;i<e.length;i++){if(["sticky","fixed","absolute","relative"].includes(getComputedStyle(e[i]).position)){e[i].style.setProperty("position","static","important")}}})();

(The two space characters in the above will likely get URL-quoted as "%20" when you save.) I keep it in the foremost position of my bookmarks toolbar. (The rest of that toolbar has by now been optimized down to just a series of folders with abbreviated names presenting the topmost level of my bookmarks tree; I hardly ever use the Bookmarks menu proper.)

A possible improvement would be to make it a browser extension so it can apply automatically on page load; this however would need some type of whitelisting facility because there are sometimes legitimate uses for the CSS properties in question and some pages come out worse than they started.

  1. Or help me out, what's the adverb for when you do something exactly in the way you warned someone up front you were going to do it? "Explicitly" came to mind but doesn't quite fit. [^]

No Comments »

No comments yet.

RSS feed for comments on this post. TrackBack URL

Leave a comment

Powered by MP-WP. Copyright Jacob Welsh.