fix: add ResizeObserver mock for Cypress

Author: AarishMansur

cypress/support/ResizeObserverMock.js

@@ -0,0 +1,41 @@
+class ResizeObserverMock {
+    constructor(callback) {
+        this.callback = callback;
+        this.elements = new Set();
+        this.handleResize = this.handleResize.bind(this);
+    }
+
+    observe(element) {
+        this.elements.add(element);
+        this.trigger();
+        window.addEventListener('resize', this.handleResize);
+    }
+
+    unobserve(element) {
+        this.elements.delete(element);
+    }
+
+    disconnect() {
+        this.elements.clear();
+        window.removeEventListener('resize', this.handleResize);
+    }
+
+    handleResize() {
+        this.trigger();
+    }
+
+    trigger() {
+        if (this.elements.size == 0) return;
+
+        const entries = Array.from(this.elements).map(e => ({
+            target: e,
+            contentRect: e.getBoundingClientRect(),
+        }));
+
+        requestAnimationFrame(() => {
+            this.callback(entries, this);
+        });
+    }
+}
+
+export default ResizeObserverMock;

cypress/support/index.js

@@ -3,12 +3,9 @@
  * See https://github.com/cypress-io/cypress/issues/20341
  * See https://github.com/cypress-io/cypress/issues/29277
  */
-Cypress.on('uncaught:exception', err => {
-    if (
-        err.message.includes(
-            'ResizeObserver loop completed with undelivered notifications'
-        )
-    ) {
-        return false;
-    }
+
+import ResizeObserverMock from './ResizeObserverMock';
+
+Cypress.on('window:before:load', win => {
+    win.ResizeObserver = ResizeObserverMock;
 });

cypress/tsconfig.json

@@ -1,7 +1,16 @@
 {
     "extends": "../tsconfig.json",
     "compilerOptions": {
-        "rootDir": "e2e"
+        "rootDir": ".",
+        "noEmit": true
     },
-    "types": ["cypress", "node"]
-}
+    "types": [
+        "cypress",
+        "node"
+    ],
+    "include": [
+        "**/*.ts",
+        "**/*.js",
+        "cypress.config.js"
+    ]
+}