mirror of
https://github.com/servo/servo.git
synced 2025-08-06 22:15:33 +01:00
Update web-platform-tests to revision 422b440e0b587317e4539378b18c362a4ea7afee
This commit is contained in:
WPT Sync Bot
parent
dbee7f7d27
commit
0c29efe000
160 changed files with 6195 additions and 2605 deletions
|
|
@ -0,0 +1,121 @@
|
|||
<!DOCTYPE html>
|
||||
<title>
|
||||
Updating the snap alignment of a snap container's content should make the snap
|
||||
container resnap accordingly.
|
||||
</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: 200px;
|
||||
width: 200px;
|
||||
overflow: hidden;
|
||||
scroll-snap-type: both mandatory;
|
||||
}
|
||||
|
||||
#initial-target {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
top: 100px;
|
||||
left: 100px;
|
||||
background-color: green;
|
||||
scroll-snap-align: start;
|
||||
}
|
||||
|
||||
#other-target {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
top: 300px;
|
||||
left: 300px;
|
||||
background-color: red;
|
||||
scroll-snap-align: start;
|
||||
}
|
||||
|
||||
.area {
|
||||
width: 2000px;
|
||||
height: 2000px;
|
||||
}
|
||||
|
||||
.snap-area {
|
||||
scroll-snap-align: start !important;
|
||||
}
|
||||
</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");
|
||||
|
||||
function cleanup() {
|
||||
initial_target.style.setProperty("scroll-snap-align", "start");
|
||||
other_target.style.setProperty("scroll-snap-align", "start");
|
||||
initial_target.removeAttribute("class");
|
||||
}
|
||||
|
||||
test(t => {
|
||||
t.add_cleanup(cleanup);
|
||||
scroller.scrollTo(0,0);
|
||||
assert_equals(scroller.scrollTop, 100);
|
||||
assert_equals(scroller.scrollLeft, 100);
|
||||
|
||||
initial_target.style.setProperty("scroll-snap-align", "end");
|
||||
// target.top + target.height - scroller.height
|
||||
assert_equals(scroller.scrollTop, 200);
|
||||
assert_equals(scroller.scrollLeft, 200);
|
||||
}, "Changing the current target's snap alignment should make the scroller"
|
||||
+ " resnap to it even if another snap position is closer to the current offset");
|
||||
|
||||
test(t => {
|
||||
t.add_cleanup(cleanup);
|
||||
scroller.scrollTo(0,0);
|
||||
assert_equals(scroller.scrollTop, 100);
|
||||
assert_equals(scroller.scrollLeft, 100);
|
||||
|
||||
initial_target.style.setProperty("scroll-snap-align", "none");
|
||||
assert_equals(scroller.scrollTop, 300);
|
||||
assert_equals(scroller.scrollLeft, 300);
|
||||
}, "Removing the current target's snap alignment should make the scroller"
|
||||
+ " resnap to a new snap area.");
|
||||
|
||||
test(t => {
|
||||
t.add_cleanup(cleanup);
|
||||
initial_target.style.setProperty("scroll-snap-align", "none");
|
||||
other_target.style.setProperty("scroll-snap-align", "none");
|
||||
|
||||
scroller.scrollTo(0,0);
|
||||
assert_equals(scroller.scrollTop, 0);
|
||||
assert_equals(scroller.scrollLeft, 0);
|
||||
|
||||
initial_target.style.setProperty("scroll-snap-align", "start");
|
||||
assert_equals(scroller.scrollTop, 100);
|
||||
assert_equals(scroller.scrollLeft, 100);
|
||||
}, "Changing an element snap alignment from none to start should make the"
|
||||
+ "scroller resnap.");
|
||||
|
||||
test(t => {
|
||||
t.add_cleanup(cleanup);
|
||||
initial_target.style.setProperty("scroll-snap-align", "none");
|
||||
other_target.style.setProperty("scroll-snap-align", "none");
|
||||
|
||||
scroller.scrollTo(0,0);
|
||||
assert_equals(scroller.scrollTop, 0);
|
||||
assert_equals(scroller.scrollLeft, 0);
|
||||
|
||||
initial_target.classList.add("snap-area");
|
||||
assert_equals(scroller.scrollTop, 100);
|
||||
assert_equals(scroller.scrollLeft, 100);
|
||||
}, "Changing an element snap alignment from none to start by adding a class"
|
||||
+ " should make the scroller resnap.");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
<!DOCTYPE html>
|
||||
<title>
|
||||
Updating the scroll-snap-type of a snap container should make it resnap accordingly.
|
||||
</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: none;
|
||||
}
|
||||
|
||||
#y-target {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
top: 100px;
|
||||
left: 0;
|
||||
background-color: green;
|
||||
scroll-snap-align: start none;
|
||||
}
|
||||
|
||||
#x-target {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
top: 0;
|
||||
left: 100px;
|
||||
background-color: red;
|
||||
scroll-snap-align: none start;
|
||||
}
|
||||
|
||||
.area {
|
||||
width: 2000px;
|
||||
height: 2000px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="scroller">
|
||||
<div class="area"></div>
|
||||
<div id="x-target"></div>
|
||||
<div id="y-target"></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const x_target = document.getElementById("x_target");
|
||||
const y_target = document.getElementById("y_target");
|
||||
const scroller = document.getElementById("scroller");
|
||||
|
||||
function cleanup() {
|
||||
scroller.style.setProperty("scroll-snap-type", "none");
|
||||
}
|
||||
|
||||
test(t => {
|
||||
t.add_cleanup(cleanup);
|
||||
scroller.scrollTo(0,0);
|
||||
assert_equals(scroller.scrollTop, 0);
|
||||
assert_equals(scroller.scrollLeft, 0);
|
||||
|
||||
scroller.style.setProperty("scroll-snap-type", "y mandatory");
|
||||
assert_equals(scroller.scrollTop, 100);
|
||||
assert_equals(scroller.scrollLeft, 0);
|
||||
}, "Changing the scroller's snap type to y should make it resnap on the y-axis.");
|
||||
|
||||
test(t => {
|
||||
t.add_cleanup(cleanup);
|
||||
scroller.scrollTo(0,0);
|
||||
assert_equals(scroller.scrollTop, 0);
|
||||
assert_equals(scroller.scrollLeft, 0);
|
||||
|
||||
scroller.style.setProperty("scroll-snap-type", "x mandatory");
|
||||
assert_equals(scroller.scrollLeft, 100);
|
||||
assert_equals(scroller.scrollTop, 0);
|
||||
}, "Changing the scroller's snap type to x should make it resnap on the x-axis.");
|
||||
|
||||
|
||||
test(t => {
|
||||
t.add_cleanup(cleanup);
|
||||
scroller.scrollTo(0,0);
|
||||
assert_equals(scroller.scrollTop, 0);
|
||||
assert_equals(scroller.scrollLeft, 0);
|
||||
|
||||
scroller.style.setProperty("scroll-snap-type", "x mandatory");
|
||||
assert_equals(scroller.scrollLeft, 100);
|
||||
assert_equals(scroller.scrollTop, 0);
|
||||
|
||||
scroller.style.setProperty("scroll-snap-type", "y mandatory");
|
||||
assert_equals(scroller.scrollTop, 100);
|
||||
}, "Changing the scroller's snap type axis should make it resnap.");
|
||||
</script>
|
||||
Loading…
Add table
Add a link
Reference in a new issue