mirror of
https://github.com/servo/servo.git
synced 2025-08-11 08:25:32 +01:00
Update web-platform-tests to revision f915dfd69790e7ca09f9bef4eb08cd30163cb3e3
This commit is contained in:
parent
2ac916b5a1
commit
fde011e73d
70 changed files with 1490 additions and 483 deletions
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().backgroundAttachment</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-attachment">
|
||||
<meta name="assert" content="background-attachment computed value is as specified.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-attachment", "fixed");
|
||||
|
||||
// See background-computed.html for a test with multiple background images.
|
||||
test_computed_value("background-attachment", "scroll, fixed, local", "scroll");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().backgroundClip</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-clip">
|
||||
<meta name="assert" content="background-clip computed value is as specified.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-clip", "border-box");
|
||||
test_computed_value("background-clip", "padding-box");
|
||||
test_computed_value("background-clip", "content-box");
|
||||
|
||||
// See background-computed.html for a test with multiple background images.
|
||||
test_computed_value("background-clip", "border-box, padding-box, content-box", "border-box");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().backgroundColor</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-color">
|
||||
<meta name="assert" content="background-color computed value is a computed color.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
color: lime;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-color", "currentcolor", "rgb(0, 255, 0)");
|
||||
|
||||
test_computed_value("background-color", "red", "rgb(255, 0, 0)");
|
||||
test_computed_value("background-color", "#00FF00", "rgb(0, 255, 0)");
|
||||
test_computed_value("background-color", "rgb(0, 0, 255)");
|
||||
test_computed_value("background-color", "rgb(100%, 100%, 0%)", "rgb(255, 255, 0)");
|
||||
test_computed_value("background-color", "hsl(120, 100%, 50%)", "rgb(0, 255, 0)");
|
||||
test_computed_value("background-color", "transparent", "rgba(0, 0, 0, 0)");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -14,6 +14,7 @@
|
|||
<script>
|
||||
test_invalid_value("background-color", "none");
|
||||
test_invalid_value("background-color", "black white");
|
||||
test_invalid_value("background-color", "black, white");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -0,0 +1,70 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().background with multiple layers</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background">
|
||||
<meta name="assert" content="The number of layers is determined by the number of comma-separated values in the background-image property. .">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
background-image: none, none, none;
|
||||
font-size: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-attachment", "local", "local, local, local");
|
||||
test_computed_value("background-attachment", "scroll, fixed", "scroll, fixed, scroll");
|
||||
test_computed_value("background-attachment", "local, fixed, scroll");
|
||||
test_computed_value("background-attachment", "local, fixed, scroll, fixed", "local, fixed, scroll");
|
||||
|
||||
test_computed_value("background-clip", "border-box", "border-box, border-box, border-box");
|
||||
test_computed_value("background-clip", "content-box, border-box", "content-box, border-box, content-box");
|
||||
test_computed_value("background-clip", "border-box, padding-box, content-box");
|
||||
test_computed_value("background-clip", "content-box, border-box, padding-box, content-box", "content-box, border-box, padding-box");
|
||||
|
||||
// background-color always computes as a single color.
|
||||
test_computed_value("background-color", "rgb(255, 0, 0)");
|
||||
|
||||
test_computed_value("background-origin", "border-box", "border-box, border-box, border-box");
|
||||
test_computed_value("background-origin", "content-box, border-box", "content-box, border-box, content-box");
|
||||
test_computed_value("background-origin", "border-box, padding-box, content-box");
|
||||
test_computed_value("background-origin", "content-box, border-box, padding-box, content-box", "content-box, border-box, padding-box");
|
||||
|
||||
test_computed_value("background-position", "50% 6px", "50% 6px, 50% 6px, 50% 6px");
|
||||
test_computed_value("background-position", "12px 13px, 50% 6px", "12px 13px, 50% 6px, 12px 13px");
|
||||
test_computed_value("background-position", "12px 13px, 50% 6px, 30px -10px");
|
||||
test_computed_value("background-position", "12px 13px, 50% 6px, 30px -10px, -7px 8px", "12px 13px, 50% 6px, 30px -10px");
|
||||
|
||||
test_computed_value("background-position-x", "0.5em", "20px, 20px, 20px");
|
||||
test_computed_value("background-position-x", "-20%, 10px", "-20%, 10px, -20%");
|
||||
|
||||
test_computed_value("background-position-x", "center, left, right", "50%, 0%, 100%");
|
||||
test_computed_value("background-position-x", "calc(10px - 0.5em), -20%, right, 15%", "-10px, -20%, 100%");
|
||||
|
||||
test_computed_value("background-position-y", "0.5em", "20px, 20px, 20px");
|
||||
test_computed_value("background-position-y", "-20%, 10px", "-20%, 10px, -20%");
|
||||
test_computed_value("background-position-y", "center, top, bottom", "50%, 0%, 100%");
|
||||
test_computed_value("background-position-y", "calc(10px - 0.5em), -20%, bottom, 15%", "-10px, -20%, 100%");
|
||||
|
||||
test_computed_value("background-repeat", "round", "round, round, round");
|
||||
test_computed_value("background-repeat", "repeat-x, repeat", "repeat-x, repeat, repeat-x");
|
||||
test_computed_value("background-repeat", "repeat space, round no-repeat, repeat-x");
|
||||
test_computed_value("background-repeat", "repeat-y, round no-repeat, repeat-x, repeat", "repeat-y, round no-repeat, repeat-x");
|
||||
|
||||
test_computed_value("background-size", "contain", "contain, contain, contain");
|
||||
test_computed_value("background-size", "auto 1px, 2% 3%", "auto 1px, 2% 3%, auto 1px");
|
||||
test_computed_value("background-size", "auto 1px, 2% 3%, contain");
|
||||
test_computed_value("background-size", "auto 1px, 2% 3%, contain, 7px 8px", "auto 1px, 2% 3%, contain");
|
||||
|
||||
// Open issue: Define serialization for background shorthand
|
||||
// https://github.com/w3c/csswg-drafts/issues/418
|
||||
// test_computed_value("background", "rgb(1, 2, 3) none 4px 5px / 6px 7px repeat space scroll border-box padding-box");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().backgroundImage</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-image">
|
||||
<meta name="assert" content="background-image computed value is as specified.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-image", "none");
|
||||
|
||||
test_computed_value("background-image", 'url("http://www.example.com/")');
|
||||
test_computed_value("background-image", 'none, url("http://www.example.com/")');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().backgroundOrigin</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-origin">
|
||||
<meta name="assert" content="background-origin computed value is as specified.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-origin", "border-box");
|
||||
test_computed_value("background-origin", "padding-box");
|
||||
test_computed_value("background-origin", "content-box");
|
||||
|
||||
// See background-computed.html for a test with multiple background images.
|
||||
test_computed_value("background-origin", "border-box, padding-box, content-box", "border-box");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,53 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().backgroundPosition</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-position">
|
||||
<meta name="assert" content="background-position computed value is a list, each item a pair of offsets (horizontal and vertical) from the top left origin each given as a computed <length-percentage> value.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
font-size: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-position", "1px", "1px 50%");
|
||||
test_computed_value("background-position", "1px center", "1px 50%");
|
||||
test_computed_value("background-position", "-2% -3%");
|
||||
test_computed_value("background-position", "5% top", "5% 0%");
|
||||
test_computed_value("background-position", "center", "50% 50%");
|
||||
test_computed_value("background-position", "center center", "50% 50%");
|
||||
test_computed_value("background-position", "center 6px", "50% 6px");
|
||||
test_computed_value("background-position", "center left", "0% 50%");
|
||||
test_computed_value("background-position", "center right 7%", "93% 50%");
|
||||
test_computed_value("background-position", "center bottom", "50% 100%");
|
||||
test_computed_value("background-position", "center top 8px", "50% 8px");
|
||||
test_computed_value("background-position", "left", "0% 50%");
|
||||
test_computed_value("background-position", "right 9%", "100% 9%");
|
||||
test_computed_value("background-position", "left 10px center", "10px 50%");
|
||||
test_computed_value("background-position", "right 11% bottom", "89% 100%");
|
||||
test_computed_value("background-position", "left 12px top 13px", "12px 13px");
|
||||
test_computed_value("background-position", "right center", "100% 50%");
|
||||
test_computed_value("background-position", "left bottom", "0% 100%");
|
||||
test_computed_value("background-position", "right top 14%", "100% 14%");
|
||||
test_computed_value("background-position", "bottom", "50% 100%");
|
||||
test_computed_value("background-position", "top 15px center", "50% 15px");
|
||||
test_computed_value("background-position", "bottom 16% left", "0% 84%");
|
||||
test_computed_value("background-position", "top 17px right -18px", "calc(100% + 18px) 17px");
|
||||
test_computed_value("background-position", "bottom center", "50% 100%");
|
||||
test_computed_value("background-position", "top left", "0% 0%");
|
||||
test_computed_value("background-position", "bottom right 19%", "81% 100%");
|
||||
test_computed_value("background-position", "calc(10px + 0.5em) calc(10px - 0.5em)", "30px -10px");
|
||||
test_computed_value("background-position", "calc(10px - 0.5em) calc(10px + 0.5em)", "-10px 30px");
|
||||
|
||||
// See background-computed.html for a test with multiple background images.
|
||||
test_computed_value("background-position", "12px 13px, 50% 6px, 30px -10px", "12px 13px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -15,6 +15,14 @@
|
|||
test_invalid_value("background-position", "left right");
|
||||
test_invalid_value("background-position", "top bottom");
|
||||
test_invalid_value("background-position", "1% center 2px");
|
||||
test_invalid_value("background-position", "right 7% 50%");
|
||||
test_invalid_value("background-position", "50% top 8px");
|
||||
test_invalid_value("background-position", "left 10px 50%");
|
||||
test_invalid_value("background-position", "right 11% 100%");
|
||||
test_invalid_value("background-position", "100% top 14%");
|
||||
test_invalid_value("background-position", "50% top 15px");
|
||||
test_invalid_value("background-position", "0% bottom 16%");
|
||||
test_invalid_value("background-position", "right 19% 100%");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -26,11 +26,14 @@ test_computed_value("background-position-x", "10px");
|
|||
test_computed_value("background-position-x", "0.5em", "20px");
|
||||
test_computed_value("background-position-x", "calc(10px - 0.5em)", "-10px");
|
||||
test_computed_value("background-position-x", "left -20%", "-20%");
|
||||
test_computed_value("background-position-x", "right 10px", "calc(100% + 10px)");
|
||||
test_computed_value("background-position-x", "-20%, 10px");
|
||||
test_computed_value("background-position-x", "center, left, right", "50%, 0%, 100px");
|
||||
test_computed_value("background-position-x", "0.5em, x-start, x-end", "20px, x-start, x-end");
|
||||
test_computed_value("background-position-x", "calc(10px - 0.5em), left -20%, right 10px", "-10px, -20%, calc(100% + 10px)");
|
||||
test_computed_value("background-position-x", "right -10px", "calc(100% + 10px)");
|
||||
test_computed_value("background-position-x", "-20%, 10px", "-20%");
|
||||
test_computed_value("background-position-x", "center, left, right", "50%");
|
||||
test_computed_value("background-position-x", "0.5em, x-start, x-end", "20px");
|
||||
|
||||
// See background-computed.html for a test with multiple background images.
|
||||
test_computed_value("background-position-x", "calc(10px - 0.5em), -20%, 10px", "-10px");
|
||||
test_computed_value("background-position-x", "calc(10px - 0.5em), left -20%, right 10px", "-10px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -26,11 +26,14 @@ test_computed_value("background-position-y", "10px");
|
|||
test_computed_value("background-position-y", "0.5em", "20px");
|
||||
test_computed_value("background-position-y", "calc(10px - 0.5em)", "-10px");
|
||||
test_computed_value("background-position-y", "top -20%", "-20%");
|
||||
test_computed_value("background-position-y", "bottom 10px", "calc(100% + 10px)");
|
||||
test_computed_value("background-position-y", "-20%, 10px");
|
||||
test_computed_value("background-position-y", "center, top, bottom", "50%, 0%, 100px");
|
||||
test_computed_value("background-position-y", "0.5em, y-start, y-end", "20px, y-start, y-end");
|
||||
test_computed_value("background-position-y", "calc(10px - 0.5em), top -20%, bottom 10px", "-10px, -20%, calc(100% + 10px)");
|
||||
test_computed_value("background-position-y", "bottom -10px", "calc(100% + 10px)");
|
||||
test_computed_value("background-position-y", "-20%, 10px", "-20%");
|
||||
test_computed_value("background-position-y", "center, top, bottom", "50%");
|
||||
test_computed_value("background-position-y", "0.5em, y-start, y-end", "20px");
|
||||
|
||||
// See background-computed.html for a test with multiple background images.
|
||||
test_computed_value("background-position-y", "calc(10px - 0.5em), -20%, 10px", "-10px");
|
||||
test_computed_value("background-position-y", "calc(10px - 0.5em), top -20%, bottom 10px", "-10px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().backgroundRepeat</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-repeat">
|
||||
<meta name="assert" content="background-attachment repeat value is as specified.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-repeat", "repeat-x");
|
||||
test_computed_value("background-repeat", "repeat-y");
|
||||
test_computed_value("background-repeat", "repeat");
|
||||
test_computed_value("background-repeat", "space");
|
||||
test_computed_value("background-repeat", "round");
|
||||
test_computed_value("background-repeat", "no-repeat");
|
||||
|
||||
test_computed_value("background-repeat", "repeat space");
|
||||
test_computed_value("background-repeat", "round no-repeat");
|
||||
test_computed_value("background-repeat", "repeat repeat", "repeat");
|
||||
|
||||
// See background-computed.html for a test with multiple background images.
|
||||
test_computed_value("background-repeat", "repeat-x, repeat-y, repeat", "repeat-x");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().backgroundSize</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#background-size">
|
||||
<meta name="assert" content="background-size computed value is a list, each item a pair of sizes (one per axis) each represented as either a keyword or a computed length-percentage value.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
<style>
|
||||
#target {
|
||||
font-size: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target"></div>
|
||||
<script>
|
||||
test_computed_value("background-size", "1px", "1px");
|
||||
test_computed_value("background-size", "1px auto", "1px");
|
||||
test_computed_value("background-size", "2% 3%");
|
||||
test_computed_value("background-size", "auto");
|
||||
test_computed_value("background-size", "auto auto", "auto");
|
||||
test_computed_value("background-size", "auto 4%");
|
||||
test_computed_value("background-size", "contain");
|
||||
test_computed_value("background-size", "cover");
|
||||
test_computed_value("background-size", "calc(10px + 0.5em) calc(10px - 0.5em)", "30px 0px");
|
||||
test_computed_value("background-size", "calc(10px - 0.5em) calc(10px + 0.5em)", "0px 30px");
|
||||
|
||||
// See background-computed.html for a test with multiple background images.
|
||||
test_computed_value("background-size", "auto 1px, 2% 3%, contain", "auto 1px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Add a link
Reference in a new issue