Update web-platform-tests to revision b'afdce893ed51bc1a7a7ac03b16b5a575caad071a'

This commit is contained in:
WPT Sync Bot 2023-03-17 01:51:32 +00:00
parent a8da28e55d
commit 3b420af385
393 changed files with 17484 additions and 4185 deletions

View file

@ -2,6 +2,7 @@
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1/#valdef-scroll-snap-type-mandatory" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="./support/common.js"></script>
<style>
div {
position: absolute;
@ -27,7 +28,7 @@ div {
<script>
test(() => {
scroller.scrollSnapType = "both mandatory";
scroller.style.scrollSnapType = "both mandatory";
// Scroll to where the first child is in view.
scroller.scrollTo(100, 100);
@ -41,7 +42,7 @@ test(() => {
}, "No snapping occurs if there is no valid snap position");
test(() => {
scroller.scrollSnapType = "x mandatory";
scroller.style.scrollSnapType = "x mandatory";
for (const target of document.querySelectorAll(".child")) {
target.scrollSnapAlign = "start none";
@ -57,4 +58,32 @@ test(() => {
assert_equals(scroller.scrollLeft, 900);
assert_equals(scroller.scrollTop, 900);
}, "No snapping occurs if there is no valid snap position matches scroll-snap-type");
promise_test(async t => {
// Start with valid snap positions.
scroller.style.scrollSnapType = "y mandatory";
document.querySelectorAll('.child').forEach(el => {
el.style.scrollSnapAlign = 'start';
t.add_cleanup(() => {
el.style.scrollSnapAlign = '';
});
});
scroller.scrollTo(100, 100);
await waitForNextFrame();
const scrollPosition = scroller.scrollTop;
// Elements no longer snap along the y-axis.
document.querySelectorAll('.child').forEach(el => {
el.style.scrollSnapAlign = 'none start';
// Bump the position to verify that we don't stay pinned to the same element
// after layout update.
el.style.top = `${parseInt(el.style.top) + 100}px`;
});
await waitForNextFrame();
assert_equals(scroller.scrollTop, scrollPosition);
scroller.scrollTo(900, 900);
assert_equals(scroller.scrollLeft, 900);
assert_equals(scroller.scrollTop, 900);
}, "No snapping occurs when last remaining valid snap point is no longer " +
"valid.");
</script>

View file

@ -0,0 +1,47 @@
<!DOCTYPE html>
<html>
<title>
Resnap when the current snap position is no longer a valid snap target.
</title>
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1/#snap-scope"/>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/css-scroll-snap/support/common.js"></script>
<style>
html {
scroll-snap-type: y mandatory;
}
body {
margin: 0;
}
.snap {
scroll-snap-align: center;
height: 100vh;
margin: 0;
}
</style>
<body onload = "runTest()">
<div id = "card1" class="snap">ONE</div>
<div id = "card2" class="snap">TWO</div>
<div id = "card3" class="snap">THREE</div>
</body>
<script type="text/javascript">
function runTest() {
promise_test(async t => {
const scroller = document.scrollingElement;
// scroll to card THREE
let expectedSnapPosition = card3.offsetTop;
scroller.scrollTo(0, expectedSnapPosition);
assert_equals(scroller.scrollTop, expectedSnapPosition,
'Aligned with card THREE before style change');
// Snap to card TWO after invalidating card THREE as a snap target.
card3.style.scrollSnapAlign = 'none center';
await waitForNextFrame();
expectedSnapPosition = card2.offsetTop;
assert_equals(scroller.scrollTop, expectedSnapPosition,
'Aligned with card TWO after style change');
}, 'Resnap when the current snap position is no longer a valid snap target');
}
</script>
</html>

View file

@ -95,3 +95,16 @@ function waitForScrollTo(eventTarget, getValue, targetValue) {
eventTarget.addEventListener('scroll', scrollListener);
});
}
function waitForNextFrame() {
return new Promise(resolve => {
const start = performance.now();
requestAnimationFrame(frameTime => {
if (frameTime < start) {
requestAnimationFrame(resolve);
} else {
resolve();
}
});
});
}