mirror of
https://github.com/mozilla/gecko-dev.git
synced 2025-11-10 13:18:45 +02:00
36953e3765
Automatic update from web-platform-tests [css-scroll-snap] Resnap containers after layout changes Per spec [1], snap containers should attempt to snap after layout changes and initial layout. If the previously snapped element still exists after the layout change, then the container must snap to it. This patch only considers snap targets set on the main thread since snap targets set on the impl thread are currently not synced back to main; this behaviour will be implemented in a follow-up. Design doc: https://docs.google.com/document/d/1Ufy55a19-iquba-LBiAE6AS2yBzfBQ5ZHFSpZGabS4c/edit?usp=sharing [1] https://drafts.csswg.org/css-scroll-snap/#re-snap Bug: 866127 Change-Id: I1442e0f464408fb5d9c49c5748a45aec0ed4d166 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1912906 Commit-Queue: Kaan Alsan <alsan@google.com> Reviewed-by: Majid Valipour <majidvp@chromium.org> Reviewed-by: David Bokan <bokan@chromium.org> Reviewed-by: Yi Gu <yigu@chromium.org> Cr-Commit-Position: refs/heads/master@{#720007} -- wpt-commits: c4182149f03eb30058efcd0e46c6e41b526f1cb1 wpt-pr: 20241
65 lines
1.4 KiB
HTML
65 lines
1.4 KiB
HTML
<!DOCTYPE html>
|
|
<title>
|
|
Removing the current snap target should make the scroller snap to a new target.
|
|
</title>
|
|
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap/#re-snap" />
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<style>
|
|
div {
|
|
position: absolute;
|
|
margin: 0;
|
|
}
|
|
|
|
#scroller {
|
|
height: 500px;
|
|
width: 500px;
|
|
overflow: hidden;
|
|
scroll-snap-type: both mandatory;
|
|
}
|
|
|
|
#initial-target {
|
|
width: 300px;
|
|
height: 300px;
|
|
top: 100px;
|
|
left: 100px;
|
|
background-color: red;
|
|
scroll-snap-align: start;
|
|
}
|
|
|
|
#other-target {
|
|
width: 300px;
|
|
height: 300px;
|
|
top: 300px;
|
|
left: 300px;
|
|
background-color: green;
|
|
scroll-snap-align: start;
|
|
}
|
|
|
|
.area {
|
|
width: 2000px;
|
|
height: 2000px;
|
|
}
|
|
</style>
|
|
|
|
<div id="scroller">
|
|
<div class="area"></div>
|
|
<div id="initial-target"></div>
|
|
<div id="other-target"></div>
|
|
</div>
|
|
|
|
<script>
|
|
const initial_target = document.getElementById("initial-target");
|
|
const other_target = document.getElementById("other-target");
|
|
const scroller = document.getElementById("scroller");
|
|
|
|
test(() => {
|
|
scroller.scrollTo(0,0);
|
|
assert_equals(scroller.scrollTop, 100);
|
|
assert_equals(scroller.scrollLeft, 100);
|
|
|
|
scroller.removeChild(initial_target);
|
|
assert_equals(scroller.scrollTop, 300);
|
|
assert_equals(scroller.scrollLeft, 300);
|
|
}, "Removing the current snap target should make the scroller snap to a new target.");
|
|
</script>
|