ResizeObserver Triggers on Hidden Div

This illustrates how the Resize Observer will trigger even when the Div is hidden. This did not used to happen in older versions of Chrome.

HTML

<html>
  <body>
    <div id="main">

    </div>
  </body>
</html>

JavaScript

// toggle hidden to true or false
const hidden = true;

const mainDiv = document.createElement("div");
mainDiv.style.background = "blue";
mainDiv.style.width = "100px";
mainDiv.style.height = "50px";
mainDiv.hidden = hidden;
const a = new ResizeObserver((entries) => {
  alert("observer triggered");
});
a.observe(mainDiv);
document.getElementById("main")?.appendChild(mainDiv);


if (hidden) {
	setTimeout(() => {
  	alert("timeout expired");
		mainDiv.hidden = false;
	}, 5000);
}