Browse Source

Fix observer console errors

Svilen Markov 5 months ago
parent
commit
d400b27545
2 changed files with 6 additions and 5 deletions
  1. 2 2
      internal/glance/static/js/main.js
  2. 4 3
      internal/glance/static/js/popover.js

+ 2 - 2
internal/glance/static/js/main.js

@@ -439,7 +439,7 @@ function setupCollapsibleGrids() {
 
         let cardsPerRow;
 
-        const resolveCollapsibleItems = () => {
+        const resolveCollapsibleItems = () => requestAnimationFrame(() => {
             const hideItemsAfterIndex = cardsPerRow * collapseAfterRows;
 
             if (hideItemsAfterIndex >= gridElement.children.length) {
@@ -465,7 +465,7 @@ function setupCollapsibleGrids() {
                     child.style.removeProperty("animation-delay");
                 }
             }
-        };
+        });
 
         const observer = new ResizeObserver(() => {
             if (!isElementVisible(gridElement)) {

+ 4 - 3
internal/glance/static/js/popover.js

@@ -25,7 +25,8 @@ frameElement.append(contentElement);
 containerElement.append(frameElement);
 document.body.append(containerElement);
 
-const observer = new ResizeObserver(repositionContainer);
+const queueRepositionContainer = () => requestAnimationFrame(repositionContainer);
+const observer = new ResizeObserver(queueRepositionContainer);
 
 function handleMouseEnter(event) {
     clearTogglePopoverTimeout();
@@ -100,7 +101,7 @@ function showPopover() {
     containerElement.style.display = "block";
     activeTarget.classList.add("popover-active");
     document.addEventListener("keydown", handleHidePopoverOnEscape);
-    window.addEventListener("resize", repositionContainer);
+    window.addEventListener("resize", queueRepositionContainer);
     observer.observe(containerElement);
 }
 
@@ -156,7 +157,7 @@ function hidePopover() {
     activeTarget.classList.remove("popover-active");
     containerElement.style.display = "none";
     document.removeEventListener("keydown", handleHidePopoverOnEscape);
-    window.removeEventListener("resize", repositionContainer);
+    window.removeEventListener("resize", queueRepositionContainer);
     observer.unobserve(containerElement);
 
     if (cleanupOnHidePopover !== null) {