Przeglądaj źródła

Fix observer console errors

Svilen Markov 5 miesięcy temu
rodzic
commit
d400b27545

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

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

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

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