mirror of
https://github.com/servo/servo.git
synced 2025-08-16 19:05:33 +01:00
Update web-platform-tests to revision e1942ace5be3a3962f204e630e9969acd70e3952
This commit is contained in:
parent
e6cf68704e
commit
69d6c85949
108 changed files with 3217 additions and 530 deletions
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().borderColor</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-color">
|
||||
<meta name="assert" content="border-color computed value is the computed colors.">
|
||||
<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>
|
||||
'use strict';
|
||||
const currentColor = "rgb(0, 255, 0)";
|
||||
const red = "rgb(255, 0, 0)";
|
||||
const yellow = "rgb(255, 255, 0)";
|
||||
const green = "rgb(0, 128, 0)";
|
||||
const blue = "rgb(0, 0, 255)";
|
||||
|
||||
test_computed_value("border-color", "currentcolor", currentColor);
|
||||
test_computed_value("border-color", "red yellow", red + " " + yellow);
|
||||
test_computed_value("border-color", "red yellow currentcolor", red + " " + yellow + " " + currentColor);
|
||||
test_computed_value("border-color", "red yellow green blue", red + " " + yellow + " " + green + " " + blue);
|
||||
|
||||
test_computed_value("border-top-color", "red", red);
|
||||
test_computed_value("border-right-color", "yellow", yellow);
|
||||
test_computed_value("border-bottom-color", "green", green);
|
||||
test_computed_value("border-left-color", "blue", blue);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().borderImageOutset</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-image-outset">
|
||||
<meta name="assert" content="border-image-outset computed value is four values, each a number or absolute length.">
|
||||
<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("border-image-outset", "1px");
|
||||
test_computed_value("border-image-outset", "1px 2");
|
||||
test_computed_value("border-image-outset", "1px 2 3px");
|
||||
test_computed_value("border-image-outset", "1px 2 3px 4");
|
||||
test_computed_value("border-image-outset", "0 calc(0.5em + 10px) 3 calc(-0.5em + 10px)", "0 30px 3 0px");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().borderImageRepeat</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-image-repeat">
|
||||
<meta name="assert" content="border-image-repeat computed value is specified keywords.">
|
||||
<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-image-repeat", "round");
|
||||
test_computed_value("border-image-repeat", "stretch repeat");
|
||||
test_computed_value("border-image-repeat", "round space");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().borderImageSlice</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-image-slice">
|
||||
<meta name="assert" content="border-image-slice computed value is four values, each either a number or percentage; plus a fill keyword if 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("border-image-slice", "1");
|
||||
test_computed_value("border-image-slice", "1 2%");
|
||||
test_computed_value("border-image-slice", "1 2% 3");
|
||||
test_computed_value("border-image-slice", "1 2% 3 4%");
|
||||
|
||||
test_computed_value("border-image-slice", "1% 2 3% 4 fill");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().borderImageSource</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-image-source">
|
||||
<meta name="assert" content="border-image-source computed value is the keyword none or the specified image with URIs made absolute.">
|
||||
<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-image-source", "none");
|
||||
test_computed_value("border-image-source", 'url("http://www.example.com/")');
|
||||
|
||||
test(() => {
|
||||
const target = document.getElementById('target');
|
||||
target.style['border-image-source'] = 'url("a.b#c")';
|
||||
const result = getComputedStyle(target)['border-image-source'];
|
||||
const resolved = new URL("a.b#c", document.URL).href;
|
||||
assert_equals(result, 'url("' + resolved + '")');
|
||||
}, 'url values are made absolute');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().borderImageWidth</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-image-width">
|
||||
<meta name="assert" content="border-image-width computed value is four values, each either a number, the keyword auto, 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("border-image-width", "1");
|
||||
test_computed_value("border-image-width", "auto");
|
||||
test_computed_value("border-image-width", "10px");
|
||||
test_computed_value("border-image-width", "20%");
|
||||
test_computed_value("border-image-width", "calc(20% + 10px)");
|
||||
test_computed_value("border-image-width", "calc(-0.5em + 10px)", "0px");
|
||||
test_computed_value("border-image-width", "calc(0.5em + 10px)", "30px");
|
||||
test_computed_value("border-image-width", "1 auto");
|
||||
test_computed_value("border-image-width", "1 auto 10px");
|
||||
test_computed_value("border-image-width", "1 auto 10px 20%");
|
||||
test_computed_value("border-image-width", "20% 10px auto 1");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().borderStyle</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-style">
|
||||
<meta name="assert" content="border-style computed value is the specified keywords.">
|
||||
<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-style", "none");
|
||||
test_computed_value("border-style", "inset outset");
|
||||
test_computed_value("border-style", "hidden dotted dashed");
|
||||
test_computed_value("border-style", "solid double groove ridge");
|
||||
|
||||
test_computed_value("border-top-style", "solid");
|
||||
test_computed_value("border-right-style", "double");
|
||||
test_computed_value("border-bottom-style", "groove");
|
||||
test_computed_value("border-left-style", "ridge");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,57 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Backgrounds and Borders: getComputedValue().borderWidth</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-width">
|
||||
<meta name="assert" content="border-width computed value is the absolute length; zero if the border 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>
|
||||
<style>
|
||||
#box {
|
||||
border-style: dotted; /* Avoid border-*-width computed style 0 */
|
||||
border-top-width: thin;
|
||||
border-right-width: medium;
|
||||
border-bottom-width: thick;
|
||||
}
|
||||
#target {
|
||||
border-style: dotted; /* Avoid border-*-width computed style 0 */
|
||||
font-size: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="box"></div>
|
||||
<div id="target"></div>
|
||||
<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-width", "1px");
|
||||
test_computed_value("border-width", "1px 2px");
|
||||
test_computed_value("border-width", "1px 2px 3px");
|
||||
test_computed_value("border-width", "1px 2px 3px 4px");
|
||||
|
||||
test_computed_value("border-width", "0.5em", "20px");
|
||||
test_computed_value("border-width", "2px thin medium thick", "2px " + thinWidth + " " + mediumWidth + " " + thickWidth);
|
||||
|
||||
test_computed_value("border-top-width", "0px");
|
||||
test_computed_value("border-right-width", "10px");
|
||||
test_computed_value("border-bottom-width", "calc(-0.5em + 10px)", "0px");
|
||||
test_computed_value("border-left-width", "calc(0.5em + 10px)", "30px");
|
||||
|
||||
test(() => {
|
||||
const thin = Number(thinWidth.replace("px", ""));
|
||||
const medium = Number(mediumWidth.replace("px", ""));
|
||||
const thick = Number(thickWidth.replace("px", ""));
|
||||
assert_less_than_equal(0, thin);
|
||||
assert_less_than_equal(thin, medium);
|
||||
assert_less_than_equal(medium, thick);
|
||||
}, "thin ≤ medium ≤ thick");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Add a link
Reference in a new issue