| Index: third_party/WebKit/LayoutTests/fast/sub-pixel/sub-pixel-border.html
|
| diff --git a/third_party/WebKit/LayoutTests/fast/sub-pixel/sub-pixel-border.html b/third_party/WebKit/LayoutTests/fast/sub-pixel/sub-pixel-border.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..9b8d7fd203d393f36f926905888d912d232803f4
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/fast/sub-pixel/sub-pixel-border.html
|
| @@ -0,0 +1,87 @@
|
| +<!DOCTYPE html>
|
| +<html>
|
| + <head>
|
| + <meta charset="utf-8">
|
| + <title>Test rendering of sub-pixel borders</title>
|
| + <style>
|
| + .test {
|
| + box-sizing: content-box;
|
| + display: inline-block;
|
| + margin: 5px;
|
| + width: 80px;
|
| + height: 80px;
|
| + border: 1px solid green;
|
| + background: lightgreen;
|
| + text-align: center;
|
| + line-height: 80px;
|
| + }
|
| + </style>
|
| + <script src="../../resources/testharness.js"></script>
|
| + <script src="../../resources/testharnessreport.js"></script>
|
| + </head>
|
| + <body>
|
| + <div class="test" style="border-width: 0.25px">0.25px</div>
|
| + <div class="test" style="border-width: 0.5px">0.5px</div>
|
| + <div class="test" style="border-width: 0.75px">0.75px</div>
|
| + <div class="test" style="border-width: 1px">1px</div>
|
| + <div class="test" style="border-width: 1.25px">1.25px</div>
|
| + <div class="test" style="border-width: 1.5px">1.5px</div>
|
| + <p>
|
| + Border thickness should be rounded, not floored, with the exception of
|
| + values below 1px where it should always round up.
|
| + </p>
|
| + <script>
|
| + var testElements = {};
|
| + var elements = document.getElementsByClassName('test');
|
| + for (var element, i = 0; element = elements[i]; i++) {
|
| + testElements[element.firstChild.nodeValue] = element;
|
| + }
|
| +
|
| + function sizeAsString(element) {
|
| + var rect = element.getBoundingClientRect();
|
| + return rect.width.toFixed(2) + 'x' + rect.height.toFixed(2);
|
| + }
|
| +
|
| + function borderAsString(element) {
|
| + var style = window.getComputedStyle(element);
|
| + return style.borderTopWidth + ' ' + style.borderRightWidth + ' ' +
|
| + style.borderBottomWidth + ' ' + style.borderLeftWidth;
|
| + }
|
| +
|
| + test(function() {
|
| + var referenceSize = sizeAsString(testElements['1px']);
|
| + assert_equals(sizeAsString(testElements['0.25px']), referenceSize,
|
| + 'Size of 0.25px box should match 1px reference.');
|
| + assert_equals(sizeAsString(testElements['0.5px']), referenceSize,
|
| + 'Size of 0.5px box should match 1px reference.');
|
| + assert_equals(sizeAsString(testElements['0.75px']), referenceSize,
|
| + 'Size of 0.75px box should match 1px reference.');
|
| +
|
| + var refSize = testElements['1px'].getBoundingClientRect();
|
| + var testSize = testElements['1.25px'].getBoundingClientRect();
|
| + assert_greater_than(testSize.width, refSize.width,
|
| + 'Size of 1.25px box should be larger than 1px box.');
|
| + assert_greater_than(testSize.height, refSize.height,
|
| + 'Size of 1.25px box should be larger than 1px box.');
|
| + }, 'Size of all elements are correct.');
|
| +
|
| + test(function() {
|
| + assert_equals(borderAsString(testElements['0.25px']),
|
| + '1px 1px 1px 1px',
|
| + 'Border thickness of 0.25px box should be 1px.');
|
| + assert_equals(borderAsString(testElements['0.5px']),
|
| + '1px 1px 1px 1px',
|
| + 'Border thickness of 0.5px box should be 1px.');
|
| + assert_equals(borderAsString(testElements['0.75px']),
|
| + '1px 1px 1px 1px',
|
| + 'Border thickness of 0.75px box should be 1px.');
|
| + assert_equals(borderAsString(testElements['1.25px']),
|
| + '1.25px 1.25px 1.25px 1.25px',
|
| + 'Border thickness of 1.25px box should retain decimals.');
|
| + assert_equals(borderAsString(testElements['1.5px']),
|
| + '1.5px 1.5px 1.5px 1.5px',
|
| + 'Border thickness of 1.5px box should retain decimals.');
|
| + }, 'All elements should have correctly sized borders.');
|
| + </script>
|
| + </body>
|
| +</html>
|
|
|