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

Update web-platform-tests to revision 60ad712df2130b21908c4a055abf241d68ba9647

Browse source
This commit is contained in:
WPT Sync Bot 2019-01-20 21:07:09 -05:00
parent ccc4149b30
commit 03d8b09382
46 changed files with 1257 additions and 139 deletions
Download patch file Download diff file Expand all files Collapse all files

61
tests/wpt/web-platform-tests/css/css-scroll-anchoring/clamp-negative-overflow.html Normal file
View file

@ -0,0 +1,61 @@
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring-1/">
<head>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style type="text/css">
#scroller {
overflow: scroll;
width: 500px;
height: 500px;
}
#anchor {
position: relative;
width: 100px;
height: 100px;
margin-top: 100px;
margin-bottom: 1000px;
background-color: blue;
}
#positioned {
position: absolute;
width: 10px;
height: 10px;
top: -200px;
background-color: yellow;
}
</style>
</head>
<body>
<div id="scroller">
<div id="anchor">
<div id="positioned">
</div>
</div>
</div>
<script type="text/javascript">
test(() => {
let scroller = document.querySelector('#scroller');
let positioned = document.querySelector('#positioned');
// Scroll down to select #anchor as an anchor node
scroller.scrollTop = 20;
// Move #positioned downwards, which will move the unclamped scrollable
// overflow rect of #anchor downards as well
positioned.style.top = '-180px';
// To trigger the bug that this regression tests in Gecko, we need
// to not take Gecko's relative positioning fast path. To do
// this, change the 'left' of #positioned from 'auto' to '0px'.
positioned.style.left = '0px';
// The implementation should clamp the scrollable overflow rect
// before the start-edge of the anchor node, and not apply an
// adjustment
assert_equals(scroller.scrollTop, 20);
}, 'scrollable overflow before the start-edge of the anchor node should be clamped');
</script>
</body>
</html>

28
tests/wpt/web-platform-tests/css/css-scroll-anchoring/exclude-sticky.html Normal file
View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring-1/">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
body { height: 400vh; margin: 0; }
#sticky, #content { width: 200px; height: 100px; }
#sticky { position: sticky; left: 100px; top: 50px; }
#before { height: 50px; }
#content { margin-top: 100px; }
</style>
<div id="sticky">sticky</div>
<div id="before"></div>
<div id="content">content</div>
<script>
// Tests that the anchor selection algorithm skips sticky-positioned elements.
test(() => {
document.scrollingElement.scrollTop = 150;
document.querySelector("#before").style.height = "100px";
assert_equals(document.scrollingElement.scrollTop, 200);
}, "Sticky-positioned headers shouldn't be chosen as scroll anchors (we should use 'content' instead)");
</script>

56
tests/wpt/web-platform-tests/css/css-scroll-anchoring/multicol-fragmented-anchor.html Normal file
View file

@ -0,0 +1,56 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring-1/">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
body { margin: 0; }
#scroller {
overflow: scroll;
height: 100px;
}
#multicol {
margin-top: 20px;
height: 200px;
columns: 2;
column-fill: auto;
}
#before {
margin-top: 100px;
height: 100px;
}
#content {
height: 10px;
}
</style>
<div id="scroller">
<div id="multicol">
<div id="fragmented">
<div id="before"></div>
<div id="content">content</div>
</div>
</div>
</div>
<script>
// Tests a scroll anchor inside of a div fragmented across multicol
test(() => {
let scroller = document.querySelector("#scroller");
let before = document.querySelector("#before");
let content = document.querySelector("#content");
// Scroll down so that we select a scroll anchor. We should select #content
// and not #before, as #before is positioned offscreen in the first column
scroller.scrollTop = 10;
// Increase the height of #before so that it fragments into the second
// column and pushes #content down.
before.style.height = "110px";
// We should have anchored to #content and have done an adjustment of 10px
assert_equals(scroller.scrollTop, 20);
}, "An element in a fragmented div should be able to be selected as an anchor node.");
</script>

47
tests/wpt/web-platform-tests/css/css-scroll-anchoring/opt-out-inner-table.html Normal file
View file

@ -0,0 +1,47 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring-1/">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
#scroller {
height: 200px;
overflow: scroll;
}
#before { height: 50px; }
#table-row {
display: table-row;
overflow-anchor: none;
width: 100px;
height: 100px;
}
#after { margin-bottom: 500px; }
</style>
<div id="scroller">
<div id="before"></div>
<div id="table-row">content</div>
<div id="after"></div>
</div>
<script>
// Tests that the anchor exclusion API works with table parts that generate
// anonymous table box wrappers
test(() => {
let scroller = document.querySelector('#scroller');
let before = document.querySelector('#before');
// Scroll down so that #table-row is the only element in view
scroller.scrollTop = 50;
// Expand #before so that we might perform a scroll adjustment
before.style.height = "100px";
// We shouldn't have selected #table-row as an anchor as it is
// 'overflow-anchor: none'
assert_equals(scroller.scrollTop, 50);
}, "A table with anonymous wrappers and 'overflow-anchor: none' shouldn't generate any scroll anchor candidates.");
</script>

45
tests/wpt/web-platform-tests/css/css-scroll-anchoring/opt-out-table.html Normal file
View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<meta charset="utf-8">
<link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring-1/">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
#scroller {
height: 200px;
overflow: scroll;
}
#before { height: 50px; }
#table {
display: table;
overflow-anchor: none;
width: 100px;
height: 100px;
margin-bottom: 500px;
}
</style>
<div id="scroller">
<div id="before"></div>
<div id="table">content</div>
</div>
<script>
// Tests that the anchor exclusion API works with tables
test(() => {
let scroller = document.querySelector('#scroller');
let before = document.querySelector('#before');
// Scroll down so that #table is the only element in view
scroller.scrollTop = 50;
// Expand #before so that we might perform a scroll adjustment
before.style.height = "100px";
// We shouldn't have selected #table as an anchor as it is
// 'overflow-anchor: none'
assert_equals(scroller.scrollTop, 50);
}, "A table with 'overflow-anchor: none' shouldn't generate any scroll anchor candidates.");
</script>