Bug 1640742 [wpt PR 23761] - WebKit export of https://bugs.webkit.org/show_bug.cgi?id=212054, a=testonly

Automatic update from web-platform-tests
Use Ahem font in multi-line-wrap-reverse-column-reverse.html (#23761)

css-flexbox/flex-lines/multi-line-wrap-reverse-column-reverse.html:
  * Update the test to use the Ahem font, and rely on different font colors
    (instead of different glyps) to check that each box of the test is placed
    correctly.

Export of: https://bugs.webkit.org/show_bug.cgi?id=212054
--

wpt-commits: b2d87a14271da903e5897779f623c74e8601f36e
wpt-pr: 23761

testing/web-platform/tests/css/css-flexbox/flex-lines/multi-line-wrap-reverse-column-reverse-ref.html

@@ -4,8 +4,9 @@
   <title>CSS Test Reference: flex container multiline wrapping-reverse in column-reverse direction</title>
   <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
   <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+  <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
   <style>
-    * { margin:0; padding:0; font-size:100%; line-height:1; }
+    * { margin:0; padding:0; font-size:100%; line-height:1; font-family: Ahem; }
 
     .test {
       width: 300px;
@@ -21,26 +22,32 @@
 
     #row1-col1 {
         height: 90px;
+        color: orange;
     }
 
     #row1-col2 {
         height: 90px;
+        color: green;
     }
 
     #row1-col3 {
         height: 90px;
+        color: blue;
     }
 
     #row2-col1 {
         height: 140px;
+        color: yellow;
     }
 
     #row2-col2 {
         height: 140px;
+        color: magenta;
     }
 
     #row3-col1 {
         height: 290px;
+        color: cyan;
     }
 
     .clear {

testing/web-platform/tests/css/css-flexbox/flex-lines/multi-line-wrap-reverse-column-reverse.html

@@ -7,9 +7,10 @@
   <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-wrap-property">
   <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property">
   <link rel="match" href="multi-line-wrap-reverse-column-reverse-ref.html">
+  <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
   <meta name="assert" content="This test check that a flex container reverse-wraps blocks multiline in column-reverse direction.">
   <style>
-    * { margin:0; padding:0; font-size:100%; line-height:1; }
+    * { margin:0; padding:0; font-size:100%; line-height:1; font-family: Ahem; }
 
     #test {
       display: flex;
@@ -26,26 +27,32 @@
 
     #col1-row1 {
         height: 90px;
+        color: orange;
     }
 
     #col1-row2 {
         height: 90px;
+        color: green;
     }
 
     #col1-row3 {
         height: 90px;
+        color: blue;
     }
 
     #col2-row1 {
         height: 140px;
+        color: yellow;
     }
 
     #col2-row2 {
         height: 140px;
+        color: magenta;
     }
 
     #col3-row1 {
         height: 290px;
+        color: cyan;
     }
 
   </style>