0ct0pu5/ladybird
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

LibWeb: Implement ResizeObserver::disconnect()

Browse source
This commit is contained in:
Aliaksandr Kalenik 2024-02-19 00:07:42 +01:00 • committed by Andreas Kling
parent 70a0f07732
commit 2b7e7cc1ad
Notes: sideshowbarker 2024-07-17 07:43:05 +09:00
3 changed files with 80 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
Tests/LibWeb/Text/expected/ResizeObserver/disconnect.txt Normal file
View file

@ -0,0 +1,2 @@
Size changed: 100px x 100px
Size changed: 200px x 200px

72
Tests/LibWeb/Text/input/ResizeObserver/disconnect.html Normal file
View file

@ -0,0 +1,72 @@
<!DOCTYPE html>
<head>
<style>
#outer {
width: 200px;
height: 200px;
background-color: lightblue;
}
#inner {
width: 100px;
height: 100px;
background-color: pink;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner"></div>
</div>
</body>
<script src="../include.js"></script>
<script>
asyncTest(async done => {
const outerBox = document.getElementById("outer");
const innerBox = document.getElementById("inner");
function createTimeoutPromise(timeout) {
return new Promise(r => {
setTimeout(r, timeout);
});
}
function createResizeObserverCallback() {
let resolve;
const promise = new Promise(r => {
resolve = r;
});
const callback = (entries) => {
for (let entry of entries) {
const { width, height } = entry.contentRect;
println(`Size changed: ${width}px x ${height}px`);
}
resolve();
};
return { promise, callback };
}
const { callback, promise } = createResizeObserverCallback();
const resizeObserver = new ResizeObserver(callback);
resizeObserver.observe(innerBox);
resizeObserver.observe(outerBox);
await promise;
resizeObserver.disconnect();
innerBox.style.width = "500px";
outerBox.style.width = "600px";
// Let event loop run to ensure that observer callback is not invoked.
await createTimeoutPromise(0);
done();
});
</script>

8
Userland/Libraries/LibWeb/ResizeObserver/ResizeObserver.cpp
View file

@ -89,10 +89,14 @@ void ResizeObserver::unobserve(DOM::Element& target)
m_observation_targets.remove(observation.index()); m_observation_targets.remove(observation.index());
} }
// https://drafts.csswg.org/resize-observer/#dom-resizeobserver-disconnect // https://drafts.csswg.org/resize-observer-1/#dom-resizeobserver-disconnect
void ResizeObserver::disconnect() void ResizeObserver::disconnect()
{ {
// FIXME: Implement // 1. Clear the [[observationTargets]] list.
m_observation_targets.clear();
// 2. Clear the [[activeTargets]] list.
m_active_targets.clear();
} }
void ResizeObserver::invoke_callback(Vector<JS::NonnullGCPtr<ResizeObserverEntry>>& entries) const void ResizeObserver::invoke_callback(Vector<JS::NonnullGCPtr<ResizeObserverEntry>>& entries) const