Sander @ August 3, 2023 at 9:03 am

Anchor bugs in Blink engine browsers

I've been looking into an issue for work where Google Chrome loads a URL ending in an anchor and scrolls to the incorrect position on the page. Imagine linking to the third heading on a page and Chrome scrolling to a indeterminable position above that. Firefox is not affected.

After ruling out all JavaScript and the particular HTML source code, it turns out that disabling the html { scroll-behavior: smooth; } CSS style fixes the issue. My theory so I suspect there is a race condition between determining the length of a page and position of the element while scrolling? This results in bugreports such as "Anchorlink going to the wrong place"

Regular behaviour is also partially broken

What's more interesting is that blink based browsers are unable to scroll to the anchor even after the page is already loaded!

Testcase:

  1. load https://downloads.vandragt.com/test-long.html#test This page has an id attribute test set on the header but is otherwise plain text. Any other page will also work though.
  2. The page loads and the scrollposition is correctly set at the test header.
  3. Scroll up a paragraph or more than a screen, and refresh the page. Notice the scrollposition isn't set.
  4. Optionally refresh many times, or press the Enter key in the address bar to attempt to reload the page. However the scroll-position is now permanently broken until you navigate away from the page.

This results in bug-reports such as "It only goes to a place when you first enter the URL to the browser, it doesnโ€™t go to the same place when you re-fresh the page". Together this erodes the trust in the application and honestly it's hard to believe this has not been more widely reported.

There's probably an elaborate JavaScript solution but in my opinion a browser's bugs should be fixed by the browser, because in the future when the browser fixes itself a workaround might result in incorrect behaviour. #technology

Related posts

  • June 24 at 1:50 pm Found an interesting article with a positi…
  • February 21 at 11:07 am Navigate Xbox Series console using LG remo…
  • February 12 at 10:38 am Looking at my browser tabs, I can't believ…
  • January 31 at 2:30 pm Content vs crap. #technology…
  • January 31 at 11:57 am Use an expression to select an array value…
  • January 23 at 11:21 am Why do web-browsers not have a dedicated &…
  • January 16 at 4:33 pm Finally updated my #WordPress Blocks In Pl…
  • January 3 at 2:07 pm What would it take to make writing vanilla…
  • January 2 at 4:37 pm If you're using the Anytype (current versi…
  • December 11 at 8:51 am I experimented with _hyperscript to replac…
  • November 14 at 10:08 am Ashley Belanger writes for Ars Technica Ap…
  • September 22 at 9:12 am On personal goals…
  • September 9 at 12:56 pm If you want an example of why we need a vi…
  • August 3, 2023 at 9:03 am Anchor bugs in Blink engine browsers…
  • April 10, 2023 at 10:41 am The AI evolution seems scary until you rea…
  • April 6, 2023 at 10:43 am Ubuntu's minimal installation appears to b…
  • March 24, 2023 at 7:24 am Anyone, regardless of coding experience ca…