Modified text decoration thickness test to pass on all platforms

The lowercase 'g' descends through the underline, which is rendered with dilation (gap between the underline and the descending g). Due to different anti-aliasing settings on different test platforms, the font metrics are calculated slightly differently, causing a 1 px difference between the from-font in the reference and the manually set length in the test on at least one platform, depending on the set font size. To avoid dilation issues, the proposed work around is to change the lowercase 'g' in the test text to uppercase 'G'. Fixed: 1068947 Change-Id: Id2be1fb3e56f9faab8a9698522b21cc42b57f5d1 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3689109 Reviewed-by: Philip Rogers <pdr@chromium.org> Commit-Queue: Traian Captan <tcaptan@chromium.org> Cr-Commit-Position: refs/heads/main@{#1014580}
web-platform-tests · Jun 15, 2022 · cc2c9af · cc2c9af
1 parent cd59733
commit cc2c9af
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 11 deletions.
diff --git a/css/css-text-decor/reference/text-decoration-thickness-fixed-ref.html b/css/css-text-decor/reference/text-decoration-thickness-fixed-ref.html
@@ -19,7 +19,7 @@
 
 .test {
 text-underline-position: from-font;
-font-size: 62px;
+font-size: 64px;
 line-height: 1.8;
 }
 
@@ -38,9 +38,9 @@
 </head>
 <body>
     <p>Test passes if underlines are thin, thick, thin, thick in this order and match the reference rendering.</p>
-    <div class="test"><span class="thin_underline">aagaa</span></div>
-    <div class="test"><span class="thick_underline">aagaa</span></div>
-    <div class="test"><span class="thin_underline">aagaa</span></div>
-    <div class="test"><span class="thick_underline">aagaa</span></div>
+    <div class="test"><span class="thin_underline">aaGaa</span></div>
+    <div class="test"><span class="thick_underline">aaGaa</span></div>
+    <div class="test"><span class="thin_underline">aaGaa</span></div>
+    <div class="test"><span class="thick_underline">aaGaa</span></div>
 </body>
 </html>
diff --git a/css/css-text-decor/text-decoration-thickness-fixed.html b/css/css-text-decor/text-decoration-thickness-fixed.html
@@ -15,7 +15,7 @@
 
 .test {
 text-underline-position: from-font;
-font-size: 62px;
+font-size: 64px;
 line-height: 1.8;
 }
 
@@ -28,7 +28,7 @@
 .thick_underline {
 font-family: underline-variable;
 text-decoration: underline;
-text-decoration-thickness: 6.2px;
+text-decoration-thickness: 6.4px;
 }
 
 .thin_underline_percent {
@@ -46,9 +46,9 @@
 </head>
 <body>
     <p>Test passes if underlines are thin, thick, thin, thick in this order and match the reference rendering.</p>
-    <div class="test"><span class="thin_underline">aagaa</span></div>
-    <div class="test"><span class="thick_underline">aagaa</span></div>
-    <div class="test"><span class="thin_underline_percent">aagaa</span></div>
-    <div class="test"><span class="thick_underline_percent">aagaa</span></div>
+    <div class="test"><span class="thin_underline">aaGaa</span></div>
+    <div class="test"><span class="thick_underline">aaGaa</span></div>
+    <div class="test"><span class="thin_underline_percent">aaGaa</span></div>
+    <div class="test"><span class="thick_underline_percent">aaGaa</span></div>
 </body>
 </html>