Update web-platform-tests to revision f915dfd69790e7ca09f9bef4eb08cd30163cb3e3

This commit is contained in:
WPT Sync Bot 2019-05-28 10:22:49 +00:00
parent 2ac916b5a1
commit fde011e73d
70 changed files with 1490 additions and 483 deletions

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>

View file

@ -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>&#x69;&#x307;&#x300; &#x69;&#x307;&#x300;</span> <span>&#x69;&#x307;&#x301; &#x69;&#x307;&#x301;</span> <span>&#x69;&#x307;&#x303; &#x69;&#x307;&#x303;</span></div>
<div class="test" lang="lt">
<span>&#x69;&#x307;&#x300; &#x69;&#x307;&#x300;</span> <span>&#x69;&#x307;&#x301; &#x69;&#x307;&#x301;</span> <span>&#x69;&#x307;&#x303; &#x69;&#x307;&#x303;</span>
<span>&#x69;&#x307;&#x300; &#x69;&#x307;&#x300;</span> <span>&#x6A;&#x307;&#x301; &#x6A;&#x307;&#x301;</span> <span>&#x12F;&#x307;&#x303; &#x12F;&#x307;&#x303;</span>
</div>
<!--Notes:
The language of the test box is set to Lithuanian (lt)
-->

View file

@ -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>&#x49;&#x300; &#x49;&#x300;</span>
<span>&#x49;&#x301; &#x49;&#x301;</span>
<span>&#x49;&#x303; &#x49;&#x303;</span>
<span>&#x49; &#x49;</span>
<span>&#x4A; &#x4A;</span>
<span>&#x12E; &#x12E;</span>
<span>X&#x307; X&#x307;</span>
</div>
<!--Notes:
The language of the test box is set to Lithuanian (lt)
-->
</body>
</html>

View file

@ -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>&#xCC; &#x69;&#x307;&#x300;</span> <span>&#xCD; &#x69;&#x307;&#x301;</span> <span>&#x128; &#x69;&#x307;&#x303;</span></div>
<div class="test" lang="lt">
<span>&#xCC; &#x69;&#x307;&#x300;</span> <span>&#xCD; &#x69;&#x307;&#x301;</span> <span>&#x128; &#x69;&#x307;&#x303;</span>
<span>&#x49;&#x300; &#x69;&#x307;&#x300;</span> <span>&#x4A;&#x301; &#x6A;&#x307;&#x301;</span> <span>&#x12E;&#x303; &#x12F;&#x307;&#x303;</span>
</div>
<!--Notes:
The language of the test box is set to Lithuanian (lt)
-->

View file

@ -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>&#x69;&#x307;&#x300; &#x49;&#x300;</span>
<span>&#x69;&#x307;&#x301; &#x49;&#x301;</span>
<span>&#x69;&#x307;&#x303; &#x49;&#x303;</span>
<span>&#x69;&#x307; &#x49;</span>
<span>&#x6A;&#x307; &#x4A;</span>
<span>&#x12F;&#x307; &#x12E;</span>
<span>x&#x307; X&#x307;</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>