diff options
Diffstat (limited to '')
3 files changed, 145 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-outline/outline-width-rounding.tentative.html b/testing/web-platform/tests/css/css-outline/outline-width-rounding.tentative.html new file mode 100644 index 0000000000..162d938cf9 --- /dev/null +++ b/testing/web-platform/tests/css/css-outline/outline-width-rounding.tentative.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html> +<head> + <title> + CSS Outline: width rounding + </title> + + <link rel="author" title="Traian Captan" href="mailto:tcaptan@chromium.org"> + <link rel="help" href="https://www.w3.org/TR/css-ui-4/#outline-width"> + + <meta name="assert" content="outline-width computed value after rounding."> + + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> +</head> +<body> + <h1> + Test passes if outline widths are rounded up + when they are greater than 0 and less than 1, + and rounded down when they are greater than 1. + </h1> + + <script> + const values = [ + { input: "0px", expected: "0px" }, + { input: "0.1px", expected: "1px" }, + { input: "0.25px", expected: "1px" }, + { input: "0.5px", expected: "1px" }, + { input: "0.9px", expected: "1px" }, + { input: "1px", expected: "1px" }, + { input: "1.25px", expected: "1px" }, + { input: "1.5px", expected: "1px" }, + { input: "2px", expected: "2px" }, + { input: "2.75px", expected: "2px" }, + { input: "2.999px", expected: "2px" }, + ]; + + for (const value of values) { + const div = document.createElement("div"); + div.style = `outline: solid ${value.input} green; margin-bottom: 20px;`; + document.body.appendChild(div); + } + + test(function() { + var targets = document.querySelectorAll("div"); + + for (var i=0; i < targets.length; ++i) { + assert_equals(getComputedStyle(targets[i]).outlineWidth, values[i].expected); + } + }, "Test that outline widths are rounded up when they are greater than 0px but less than 1px, and rounded down when they are greater than 1px."); + </script> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-outline/reference/subpixel-outline-width-ref.tentative.html b/testing/web-platform/tests/css/css-outline/reference/subpixel-outline-width-ref.tentative.html new file mode 100644 index 0000000000..28d84fabb7 --- /dev/null +++ b/testing/web-platform/tests/css/css-outline/reference/subpixel-outline-width-ref.tentative.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<html> +<head> + <title> + CSS Outline: width computed value + </title> + + <link rel="author" title="Traian Captan" href="mailto:tcaptan@chromium.org"> + + <style> + .square { + height: 20px; + width: 20px; + outline: 1px solid gray; + } + </style> +</head> + +<body> + <h1> + Test passes if outline widths are rounded up + when they are greater than 0 and less than 1, + and rounded down when they are greater than 1. + </h1> + + <div class="square"></div> + <br> + <div class="square"></div> + <br> + <div class="square"></div> + <br> + <div class="square"></div> + <br> + <div class="square"></div> + <br> + <div class="square"></div> + <br> + <div class="square" style="outline-width: 3px;"></div> + <br> + <div class="square" style="outline-width: 3px;"></div> + <br> + <div class="square" style="outline-width: 3px;"></div> +</body> +</html> diff --git a/testing/web-platform/tests/css/css-outline/subpixel-outline-width.tentative.html b/testing/web-platform/tests/css/css-outline/subpixel-outline-width.tentative.html new file mode 100644 index 0000000000..a9fc0c49cf --- /dev/null +++ b/testing/web-platform/tests/css/css-outline/subpixel-outline-width.tentative.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<html> +<head> + <title> + CSS Outline: width computed value + </title> + + <link rel="author" title="Traian Captan" href="mailto:tcaptan@chromium.org"> + <link rel="help" href="https://www.w3.org/TR/css-ui-4/#outline-width"> + <link rel="match" href="reference/subpixel-outline-width-ref.tentative.html"> + + <meta name="assert" content="outline-width computed value after rounding."> + + <style> + .square { + height: 20px; + width: 20px; + outline: solid gray; + } + </style> +</head> + +<body> + <h1> + Test passes if outline widths are rounded up + when they are greater than 0 and less than 1, + and rounded down when they are greater than 1. + </h1> + + <div class="square" style="outline-width: 0.3px;"></div> + <br> + <div class="square" style="outline-width: 0.5px;"></div> + <br> + <div class="square" style="outline-width: 0.9px;"></div> + <br> + <div class="square" style="outline-width: 1.3px;"></div> + <br> + <div class="square" style="outline-width: 1.5px;"></div> + <br> + <div class="square" style="outline-width: 1.9px;"></div> + <br> + <div class="square" style="outline-width: 3.3px;"></div> + <br> + <div class="square" style="outline-width: 3.5px;"></div> + <br> + <div class="square" style="outline-width: 3.9px;"></div> +</body> +</html> |