Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-14 09:55:35 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update web-platform-tests to revision b'79fa4cf76e0d39e3fc1b7ead85e067b0a064b892'

Browse source
This commit is contained in:
WPT Sync Bot 2021-03-06 08:21:21 +00:00
parent 4a46a476d7
commit 31f9c69336
83 changed files with 2200 additions and 954 deletions
Download patch file Download diff file Expand all files Collapse all files

41
tests/wpt/web-platform-tests/css/css-position/sticky/position-sticky-scrollIntoView.html Normal file
View file

@ -0,0 +1,41 @@
<!DOCTYPE html>
<title>Scrolling to sticky position elements uses their unshifted position</title>
<link rel="help" href="https://www.w3.org/TR/css-position-3/#stickypos-scroll" />
<meta name="assert" content="This test checks that scrolling to sticky position elements uses their initial position" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
h1 {
position: sticky;
background: #ddd;
border: 1px solid black;
top: 0px;
bottom: 0px;
}
section {
height: 100vh;
}
</style>
<body>
<h1>Title 1</h1>
<section></section>
<h1>Title 2</h1>
<section></section>
<h1>Title 3</h1>
<section></section>
<script>
test(() => {
window.scrollTo(0, 0);
const element = document.querySelectorAll('h1')[2];
element.scrollIntoView();
assert_approx_equals(document.scrollingElement.scrollTop, element.offsetTop, 1);
}, 'scrolling a sticky element into view should use its unshifted position');
</script>
</body>

57
tests/wpt/web-platform-tests/css/css-position/sticky/position-sticky-top-and-bottom.html Normal file
View file

@ -0,0 +1,57 @@
<!DOCTYPE html>
<title>position:sticky elements can be constrained by top and bottom exceeding container size</title>
<link rel="help" href="https://www.w3.org/TR/css-position-3/#sticky-pos" />
<meta name="assert" content="This test checks that position:sticky elements obey both top and bottom constraints" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
.scroller {
height: 200px;
overflow: auto;
position: relative;
}
.container {
height: 120px;
}
.padding, .sticky {
height: 50px;
}
.overflow-padding {
height: 200px;
}
.sticky {
position: sticky;
background: green;
top: -25px;
bottom: 150px;
}
</style>
<body>
<div class="scroller">
<div class="container">
<div class="padding"></div>
<div class="sticky"></div>
</div>
<div class="overflow-padding"></div>
</div>
</body>
<script>
test(() => {
const scroller = document.querySelector('.scroller');
const element = document.querySelector('.sticky');
scroller.scrollTop = 0;
assert_equals(element.offsetTop, 0);
}, 'initially the sticky box should be pushed to the top of the container');
test(() => {
const scroller = document.querySelector('.scroller');
const element = document.querySelector('.sticky');
scroller.scrollTop = 95;
assert_equals(element.offsetTop, 70);
}, 'when we scroll past the flow position the top constraint pushes it down');
</script>