Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(192)

Unified Diff: third_party/WebKit/LayoutTests/fast/sub-pixel/sub-pixel-border.html

Issue 2640143005: Support subpixel layout for borders. (Closed)
Patch Set: Rebaselined tests. Created 3 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
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>

Powered by Google App Engine
This is Rietveld 408576698