ResizeObserver loop limit exceeded

[Myles-Liu]

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch rc-align@4.0.15 for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/rc-align/es/util.js b/node_modules/rc-align/es/util.js
index 455ea6d..770697a 100644
--- a/node_modules/rc-align/es/util.js
+++ b/node_modules/rc-align/es/util.js
@@ -24,32 +24,35 @@ export function restoreFocus(activeElement, container) {
 export function monitorResize(element, callback) {
   var prevWidth = null;
   var prevHeight = null;
+  let animationFrame;
 
   function onResize(_ref) {
-    var _ref2 = _slicedToArray(_ref, 1),
-        target = _ref2[0].target;
+    animationFrame = window.requestAnimationFrame(() => {
+        var _ref2 = _slicedToArray(_ref, 1),
+            target = _ref2[0].target;
     
-    if (!document.documentElement.contains(target)) return;
+        if (!document.documentElement.contains(target)) return;
     
-    var _target$getBoundingCl = target.getBoundingClientRect(),
-        width = _target$getBoundingCl.width,
-        height = _target$getBoundingCl.height;
+        var _target$getBoundingCl = target.getBoundingClientRect(),
+            width = _target$getBoundingCl.width,
+            height = _target$getBoundingCl.height;
     
-    var fixedWidth = Math.floor(width);
-    var fixedHeight = Math.floor(height);
+        var fixedWidth = Math.floor(width);
+        var fixedHeight = Math.floor(height);
     
-    if (prevWidth !== fixedWidth || prevHeight !== fixedHeight) {
-      // https://webkit.org/blog/9997/resizeobserver-in-webkit/
-      Promise.resolve().then(function () {
-        callback({
-          width: fixedWidth,
-          height: fixedHeight
-        });
-      });
-    }
+        if (prevWidth !== fixedWidth || prevHeight !== fixedHeight) {
+          // https://webkit.org/blog/9997/resizeobserver-in-webkit/
+          Promise.resolve().then(function () {
+            callback({
+              width: fixedWidth,
+              height: fixedHeight
+            });
+          });
+        }
     
-    prevWidth = fixedWidth;
-    prevHeight = fixedHeight;
+        prevWidth = fixedWidth;
+        prevHeight = fixedHeight;
+    })
   }
 
   var resizeObserver = new ResizeObserver(onResize);
@@ -60,5 +63,6 @@ export function monitorResize(element, callback) {
 
   return function () {
     resizeObserver.disconnect();
+    window.cancelAnimationFrame(animationFrame)
   };
 }

This issue body was partially generated by patch-package.