LibWeb: Implement ResizeObserver::unobserve()

2025-07-25 22:27:35 +00:00 · 2024-02-18 21:50:35 +01:00 · 2024-02-18 21:50:35 +01:00 · 70a0f07732
commit 70a0f07732
parent fcf293a8df
3 changed files with 66 additions and 3 deletions
--- a/Tests/LibWeb/Text/input/ResizeObserver/unobserve.html
+++ b/Tests/LibWeb/Text/input/ResizeObserver/unobserve.html
@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<head>
+    <style>
+        #box {
+            width: 200px;
+            height: 200px;
+            background-color: lightblue;
+        }
+    </style>
+</head>
+<body>
+    <div id="box"></div>
+</body>
+<script src="../include.js"></script>
+<script>
+    asyncTest(async done => {
+        const box = document.getElementById("box");
+
+        let resolve = null;
+        function createResizeObserverPromise() {
+            return new Promise(r => {
+                resolve = r;
+            });
+        }
+
+        function createTimeoutPromise(timeout) {
+            return new Promise(r => {
+                setTimeout(r, timeout);
+            });
+        }
+
+        const resizeObserver = new ResizeObserver(entries => {
+            for (let entry of entries) {
+                const { width, height } = entry.contentRect;
+                println(`Size changed: ${width}px x ${height}px`);
+            }
+
+            if (resolve) resolve();
+        });
+
+        let observerCallbackInvocation = createResizeObserverPromise();
+        resizeObserver.observe(box);
+        await observerCallbackInvocation;
+
+        resizeObserver.unobserve(box);
+
+        box.style.width = "400px";
+        box.style.height = "400px";
+
+        // Let event loop run to ensure that observer callback is not invoked.
+        await createTimeoutPromise(0);
+
+        done();
+    });
+</script>