A much pettier and more obscure reason I hate Chrome than most

In which I am angry about support for edge cases regarding HTML tags that have existed since the mid-1990s.

A much pettier and more obscure reason I hate Chrome than most
stock photo via unsplash

For context, this post was originally located here before I set this site up, and is one of the long-form writeups that inspired me to do so in the first place. The footnotes are new annotations.
 
As with the Mastodon article, I'm not going to do a pass adding capitalization. Live with it.

hey what's up

when i host things i wrote that i want to use basic formatting in on my webspace, i use texme, a javascript library to convert easy-to-write-and-read markdown formatting to HTML. this page is using it right now![1]

the latest thing i wrote has been getting long enough i wanted to use anchor links to specific headings, like so.[2]

texme automatically generates anchors at every heading, and they work in firefox. i use firefox on mobile and PC, so i assumed that since chrome is a currently maintained browser with the biggest marketshare in the world, and anchor tags/links are a basic HTML feature that has existed since the 1990s, this feature would function properly in chrome also.

turns out, no! a friend reported that the link just ignored the anchor in the URL and popped her right at the top of the page. a quick google made evident that chrome sucks shit on this issue, as it does so many others!

lol, lmao

19 million results including an unfixed bug report on google's own bug tracker definitely suggests it is not a just-me problem.

those stack overflow links have suggested workarounds where you can simply load jquery (another javascript library) and then paste a huge complex chunk of code into your web page to compensate for google's failure to properly support elements of the HTML specification that are at least 27 years old. i wanted to at least figure out enough of what the problem was to not have to involve another library, because texme is already half a megabyte and that is well into unhinged territory.

long story short, the problem seems to be that chrome tries to scroll to the anchor before the page is finished loading. that means the anchor isn't there yet! texme offers a configuration option to run a function when it's done converting the page, so i slammed this in there and it seems so far to work.

function fixAnchors() {
    if (!navigator.userAgent.includes("Firefox") && window.location.hash != "") {
        window.location.replace(window.location.href);
        console.log("If you see this and are using Chrome, please stop :)");
    }
}

what this function does:

  1. check if the browser claims to be firefox, and check if there is an anchor in the URL to bother fixing.
  2. if there is an anchor in the URL and the browser is not claiming to be firefox, it makes the browser jump to the anchor without reloading the page.
  3. if it ended up doing that, it also prints a petty message to the browser developer console. the average user will not see this, and i figure anyone who is choosing to use chrome and knows to check the console can handle me doing a mild snipe at them.

i could have checked if the browser was claiming to be chrome instead of not claiming to be firefox, but i erred on this side because i don't know if microsoft edge or various chromium-based awfulness will claim to be chrome, and they will still run into this issue because they're just rebranded chrome. (i have no idea if safari has this issue, but i do not go out of my way to consider apple device users for the most part.)

anyway. in closing, i hope google makes a catastrophic business decision that results in their total collapse, because they are genuinely harmful as stewards of the web.

postscript

lol while proofreading i discovered that external links in marked.js (which texme uses to render markdown) open in the same tab by default, which is super annoying, and the easiest way to fix that is with jquery anyway!

OH WELL, lmfao, the function i wrote is still way smaller/easier than the stack overflow one, i just add this outside the if block.

$(document).find('a').attr('target','_blank')

computers are fucking bullshit, man.[3]


  1. This is obviously no longer true. ↩︎

  2. My dad was confused on this point: This is a rules/lore reference document for a tabletop roleplaying game campaign I'm running, and you should not try to go read it now. The contents aren't relevant, just the formatting. ↩︎

  3. This, however, is obviously still true. It will be true for the rest of human history, I suspect. ↩︎