I'm working on a small project that adds divs to a webpage. As I work, I always want to be able to see the last div added. My helper function to do this is quite simple:

const scrollToLast = () => {
  let tests = document.querySelectorAll("#content > div");
  let last = tests[tests.length - 1];
  last.scrollIntoView(false);
};

This works fine on all browsers when first navigating to localhost, but on refresh or re-render (I am using VS Code's Live Server extension), it only works as expected on Firefox.

Firefox: Firefox scrolls down on refresh

Chrome: Chrome seems to scroll down and scroll back up

Brave: Brave browser doesn't scroll either