mirror of
https://github.com/servo/servo.git
synced 2025-08-19 12:25:33 +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>
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: getComputedValue().borderBlockColor</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block-color">
|
||||
<meta name="assert" content="border-block-color is computed color(s).">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="box"></div>
|
||||
<div id="target"></div>
|
||||
<style>
|
||||
#target {
|
||||
color: lime;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
test_computed_value("border-block-start-color", "currentcolor", 'rgb(0, 255, 0)');
|
||||
test_computed_value("border-block-start-color", "rgb(2, 3, 4)");
|
||||
test_computed_value("border-block-end-color", "rgb(34, 51, 68)");
|
||||
test_computed_value("border-block-end-color", "transparent", "rgba(0, 0, 0, 0)");
|
||||
test_computed_value("border-block-color", "rgb(34, 51, 68)");
|
||||
test_computed_value("border-block-color", "transparent rgb(2, 3, 4)", "rgba(0, 0, 0, 0) rgb(2, 3, 4)");
|
||||
test_computed_value("border-block-color", "rgb(2, 3, 4) rgb(2, 3, 4)", "rgb(2, 3, 4)");
|
||||
test_computed_value("border-block-color", "currentcolor lime", 'rgb(0, 255, 0)');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing border-block-color with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block-color">
|
||||
<meta name="assert" content="border-block-color supports only the grammar '<color>{1,2}'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_invalid_value("border-block-start-color", "#12");
|
||||
test_invalid_value("border-block-start-color", "auto");
|
||||
test_invalid_value("border-block-start-color", "red green");
|
||||
test_invalid_value("border-block-start-color", "rgb");
|
||||
test_invalid_value("border-block-start-color", "rgb(1,2,3,4,5)");
|
||||
test_invalid_value("border-block-start-color", "rgb(10%, 20, 30%)");
|
||||
test_invalid_value("border-block-end-color", "#123456789");
|
||||
test_invalid_value("border-block-end-color", "123");
|
||||
test_invalid_value("border-block-end-color", "hsla(1,2,3,4,5)");
|
||||
test_invalid_value("border-block-end-color", "red, green");
|
||||
test_invalid_value("border-block-end-color", "rgb(1)");
|
||||
test_invalid_value("border-block-end-color", "rgba(-2, 300, 400%, -0.5)");
|
||||
test_invalid_value("border-block-color", "auto");
|
||||
test_invalid_value("border-block-color", "lime, transparent");
|
||||
test_invalid_value("border-block-color", "red green blue");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing border-block-color with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block-color">
|
||||
<meta name="assert" content="border-block-color supports the full grammar '<color>{1,2}'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_valid_value("border-block-start-color", "currentcolor");
|
||||
test_valid_value("border-block-start-color", "rgb(2, 3, 4)");
|
||||
test_valid_value("border-block-end-color", "#234", "rgb(34, 51, 68)");
|
||||
test_valid_value("border-block-end-color", "transparent");
|
||||
test_valid_value("border-block-color", "#234", "rgb(34, 51, 68)");
|
||||
test_valid_value("border-block-color", "transparent rgb(2, 3, 4)");
|
||||
test_valid_value("border-block-color", "rgb(2, 3, 4) rgb(2, 3, 4)", "rgb(2, 3, 4)");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: getComputedValue().borderBlockStyle</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block-style">
|
||||
<meta name="assert" content="border-block-style is specified keyword(s).">
|
||||
<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("border-block-start-style", "dotted");
|
||||
test_computed_value("border-block-start-style", "groove");
|
||||
test_computed_value("border-block-start-style", "inset");
|
||||
test_computed_value("border-block-start-style", "none");
|
||||
test_computed_value("border-block-start-style", "solid");
|
||||
test_computed_value("border-block-end-style", "dashed");
|
||||
test_computed_value("border-block-end-style", "double");
|
||||
test_computed_value("border-block-end-style", "hidden");
|
||||
test_computed_value("border-block-end-style", "outset");
|
||||
test_computed_value("border-block-end-style", "ridge");
|
||||
test_computed_value("border-block-style", "dotted");
|
||||
test_computed_value("border-block-style", "double groove");
|
||||
test_computed_value("border-block-style", "hidden hidden", "hidden");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing border-block-style with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block-style">
|
||||
<meta name="assert" content="border-block-style supports only the grammar '<line-style>{1,2}'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_invalid_value("border-block-start-style", "auto");
|
||||
test_invalid_value("border-block-start-style", "hidden, outset");
|
||||
test_invalid_value("border-block-end-style", "solid double");
|
||||
test_invalid_value("border-block-style", "auto");
|
||||
test_invalid_value("border-block-style", "groove, ridge");
|
||||
test_invalid_value("border-block-style", "hidden inset dashed");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing border-block-style with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block">
|
||||
<meta name="assert" content="border-block-style supports the full grammar '<line-style>{1,2}'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
// none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset
|
||||
test_valid_value("border-block-start-style", "dotted");
|
||||
test_valid_value("border-block-start-style", "groove");
|
||||
test_valid_value("border-block-start-style", "inset");
|
||||
test_valid_value("border-block-start-style", "none");
|
||||
test_valid_value("border-block-start-style", "solid");
|
||||
test_valid_value("border-block-end-style", "dashed");
|
||||
test_valid_value("border-block-end-style", "double");
|
||||
test_valid_value("border-block-end-style", "hidden");
|
||||
test_valid_value("border-block-end-style", "outset");
|
||||
test_valid_value("border-block-end-style", "ridge");
|
||||
test_valid_value("border-block-style", "dotted");
|
||||
test_valid_value("border-block-style", "double groove");
|
||||
test_valid_value("border-block-style", "hidden hidden", "hidden");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,76 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: getComputedValue().borderBlockWidth</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block-width">
|
||||
<meta name="assert" content="border-block-width is absolute length; zero if the border block style is none or hidden.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/computed-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="box"></div>
|
||||
<div id="target"></div>
|
||||
<style>
|
||||
#box {
|
||||
border-style: dotted; /* Avoid border-*-width computed style 0 */
|
||||
border-top-width: thin;
|
||||
border-right-width: medium;
|
||||
border-bottom-width: thick;
|
||||
}
|
||||
#target {
|
||||
font-size: 40px;
|
||||
border-block-style: dotted; /* Avoid border-block-*-width computed style 0 */
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
'use strict';
|
||||
const box = document.getElementById('box');
|
||||
const thinWidth = getComputedStyle(box).borderTopWidth;
|
||||
const mediumWidth = getComputedStyle(box).borderRightWidth;
|
||||
const thickWidth = getComputedStyle(box).borderBottomWidth;
|
||||
|
||||
test_computed_value("border-block-start-width", "calc(10px + 0.5em)", "30px");
|
||||
test_computed_value("border-block-start-width", "calc(10px - 0.5em)", "0px");
|
||||
test_computed_value("border-block-start-width", "thin", thinWidth);
|
||||
test_computed_value("border-block-start-width", "medium", mediumWidth);
|
||||
|
||||
test_computed_value("border-block-end-width", "calc(10px + 0.5em)", "30px");
|
||||
test_computed_value("border-block-end-width", "calc(10px - 0.5em)", "0px");
|
||||
test_computed_value("border-block-end-width", "thick", thickWidth);
|
||||
|
||||
test_computed_value("border-block-width", "10px");
|
||||
test_computed_value("border-block-width", "10px 20px");
|
||||
test_computed_value("border-block-width", "10px 10px", "10px");
|
||||
test(() => {
|
||||
box.style.borderBlockStartWidth = '10px';
|
||||
box.style.borderBlockEndWidth = '10px';
|
||||
|
||||
box.style.borderBlockStartStyle = 'groove';
|
||||
box.style.borderBlockEndStyle = 'solid';
|
||||
assert_equals(getComputedStyle(box).borderBlockStartWidth, '10px');
|
||||
assert_equals(getComputedStyle(box).borderBlockEndWidth, '10px');
|
||||
assert_equals(getComputedStyle(box).borderBlockWidth, '10px');
|
||||
|
||||
box.style.borderBlockStartStyle = 'hidden';
|
||||
box.style.borderBlockEndStyle = 'dashed';
|
||||
assert_equals(getComputedStyle(box).borderBlockStartWidth, '0px');
|
||||
assert_equals(getComputedStyle(box).borderBlockEndWidth, '10px');
|
||||
assert_equals(getComputedStyle(box).borderBlockWidth, '0px 10px');
|
||||
|
||||
box.style.borderBlockStartStyle = 'inset';
|
||||
box.style.borderBlockEndStyle = 'none';
|
||||
assert_equals(getComputedStyle(box).borderBlockStartWidth, '10px');
|
||||
assert_equals(getComputedStyle(box).borderBlockEndWidth, '0px');
|
||||
assert_equals(getComputedStyle(box).borderBlockWidth, '10px 0px');
|
||||
|
||||
box.style.borderBlockStartStyle = 'none';
|
||||
box.style.borderBlockEndStyle = 'hidden';
|
||||
assert_equals(getComputedStyle(box).borderBlockStartWidth, '0px');
|
||||
assert_equals(getComputedStyle(box).borderBlockEndWidth, '0px');
|
||||
assert_equals(getComputedStyle(box).borderBlockWidth, '0px');
|
||||
}, 'width is zero if the border block style is none or hidden');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing border-block-width with invalid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block-width">
|
||||
<meta name="assert" content="border-block-width supports only the grammar '<line-width>{1,2}'.">
|
||||
<meta name="assert" content="Negative lengths are not allowed.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
test_invalid_value("border-block-start-width", "-20px");
|
||||
test_invalid_value("border-block-start-width", "auto");
|
||||
test_invalid_value("border-block-start-width", "medium 40px");
|
||||
test_invalid_value("border-block-end-width", "10");
|
||||
test_invalid_value("border-block-end-width", "30%");
|
||||
|
||||
test_invalid_value("border-block-width", "thick, thin");
|
||||
test_invalid_value("border-block-width", "10px 20px 30px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Logical Properties and Values: parsing border-block-width with valid values</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-logical/#propdef-border-block-width">
|
||||
<meta name="assert" content="border-block-width supports the full grammar '<line-width>{1,2}'.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/css/support/parsing-testcommon.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
// <length> | thin | medium | thick
|
||||
test_valid_value("border-block-start-width", "10px");
|
||||
test_valid_value("border-block-start-width", "calc(10px + 0.5em)");
|
||||
test_valid_value("border-block-start-width", "thick");
|
||||
test_valid_value("border-block-start-width", "thin");
|
||||
test_valid_value("border-block-end-width", "0", "0px");
|
||||
test_valid_value("border-block-end-width", "calc(10px - 0.5em)");
|
||||
test_valid_value("border-block-end-width", "medium");
|
||||
test_valid_value("border-block-width", "10px");
|
||||
test_valid_value("border-block-width", "medium calc(10px + 0.5em)");
|
||||
test_valid_value("border-block-width", "10px 10px", "10px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -17,7 +17,10 @@
|
|||
</head>
|
||||
<body>
|
||||
<p class="instructions">Test passes if both characters in each pair match. If you are missing a font glyph for a character, ignore that pair, but report which characters were ignored.</p>
|
||||
<div class="test" lang="lt"><span>i̇̀ i̇̀</span> <span>i̇́ i̇́</span> <span>i̇̃ i̇̃</span></div>
|
||||
<div class="test" lang="lt">
|
||||
<span>i̇̀ i̇̀</span> <span>i̇́ i̇́</span> <span>i̇̃ i̇̃</span>
|
||||
<span>i̇̀ i̇̀</span> <span>j̇́ j̇́</span> <span>į̇̃ į̇̃</span>
|
||||
</div>
|
||||
<!--Notes:
|
||||
The language of the test box is set to Lithuanian (lt)
|
||||
-->
|
||||
|
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>CSS3 Text, text transform: Lithuanian, uppercase</title>
|
||||
<link rel='author' title='Jonathan Kew' href='mailto:jkew@mozilla.com'>
|
||||
<style type='text/css'>
|
||||
@font-face {
|
||||
font-family: 'webfont';
|
||||
src: url('/fonts/DoulosSIL-R.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
.test, .ref { font-size: 200%; line-height: 2.5em; font-family: webfont, serif; }
|
||||
.test span, .ref span { margin-right: 1em; white-space: nowrap; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p class="instructions">Test passes if both characters in each pair match. If you are missing a font glyph for a character, ignore that pair, but report which characters were ignored.</p>
|
||||
<div class="test" lang="lt">
|
||||
<span>Ì Ì</span>
|
||||
<span>Í Í</span>
|
||||
<span>Ĩ Ĩ</span>
|
||||
<span>I I</span>
|
||||
<span>J J</span>
|
||||
<span>Į Į</span>
|
||||
<span>Ẋ Ẋ</span>
|
||||
</div>
|
||||
<!--Notes:
|
||||
The language of the test box is set to Lithuanian (lt)
|
||||
-->
|
||||
</body>
|
||||
</html>
|
|
@ -22,7 +22,10 @@
|
|||
</head>
|
||||
<body>
|
||||
<p class="instructions">Test passes if both characters in each pair match. If you are missing a font glyph for a character, ignore that pair, but report which characters were ignored.</p>
|
||||
<div class="test" lang="lt"><span>Ì i̇̀</span> <span>Í i̇́</span> <span>Ĩ i̇̃</span></div>
|
||||
<div class="test" lang="lt">
|
||||
<span>Ì i̇̀</span> <span>Í i̇́</span> <span>Ĩ i̇̃</span>
|
||||
<span>Ì i̇̀</span> <span>J́ j̇́</span> <span>Į̃ į̇̃</span>
|
||||
</div>
|
||||
<!--Notes:
|
||||
The language of the test box is set to Lithuanian (lt)
|
||||
-->
|
||||
|
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>CSS3 Text, text transform: Lithuanian, uppercase</title>
|
||||
<meta name="assert" content="text-transform: uppercase will uppercase Lithuanian as described in Unicode's SpecialCasing.txt .">
|
||||
<link rel='author' title='Jonathan Kew' href='mailto:jkew@mozilla.com'>
|
||||
<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-transform'>
|
||||
<link rel="match" href="reference/text-transform-upperlower-044-ref.html">
|
||||
<style type='text/css'>
|
||||
@font-face {
|
||||
font-family: 'webfont';
|
||||
src: url('/fonts/DoulosSIL-R.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
.test, .ref { font-size: 200%; line-height: 2.5em; font-family: webfont, serif; }
|
||||
.test span, .ref span { margin-right: 1em; white-space: nowrap; }
|
||||
/* the CSS above is not part of the test */
|
||||
.test { text-transform: uppercase; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p class="instructions">Test passes if both characters in each pair match. If you are missing a font glyph for a character, ignore that pair, but report which characters were ignored.</p>
|
||||
<div class="test" lang="lt">
|
||||
<span>i̇̀ Ì</span>
|
||||
<span>i̇́ Í</span>
|
||||
<span>i̇̃ Ĩ</span>
|
||||
<span>i̇ I</span>
|
||||
<span>j̇ J</span>
|
||||
<span>į̇ Į</span>
|
||||
<span>ẋ Ẋ</span> <!-- check that dot isn't deleted in other contexts -->
|
||||
</div>
|
||||
<!--Notes:
|
||||
The language of the test box is set to Lithuanian (lt)
|
||||
-->
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Add a link
Reference in a new issue