fix(framework): avoid ResizeObserver loop limit exceeded error (#6934)

Fixes #6924

Author: georgimkv

packages/base/src/delegate/ResizeHandler.ts

@@ -8,11 +8,13 @@ const observedElements = new Map<HTMLElement, Array<ResizeObserverCallback>>();
 const getResizeObserver = () => {
 	if (!resizeObserver) {
 		resizeObserver = new window.ResizeObserver(entries => {
-			entries.forEach(entry => {
-				const callbacks = observedElements.get(entry.target as HTMLElement);
-				// Callbacks could be async and we need to handle returned promises to comply with the eslint "no-misused-promises" rule.
-				// Although Promise.all awaits all, we don't additonal task after calling the callbacks and should not make any difference.
-				callbacks && Promise.all(callbacks.map((callback: ResizeObserverCallback) => callback()));
+			window.requestAnimationFrame(() => {
+				entries.forEach(entry => {
+					const callbacks = observedElements.get(entry.target as HTMLElement);
+					// Callbacks could be async and we need to handle returned promises to comply with the eslint "no-misused-promises" rule.
+					// Although Promise.all awaits all, we don't await the additional task after calling the callbacks and should not make any difference.
+					callbacks && Promise.all(callbacks.map((callback: ResizeObserverCallback) => callback()));
+				});
 			});
 		});
 	}