Bug 1520946: Shrink some content in various w3c-submitted flexbox tests so that they won't trigger scrollbars in WPT harness. r=TYLin
authorDaniel Holbert <dholbert@cs.stanford.edu>
Fri, 18 Jan 2019 19:36:30 +0000
changeset 454490 1b73f4cd7208ac91d88a0b1c98e87cd407f10f43
parent 454489 2227c747a95b2e907460217a3c0860f54cf36243
child 454491 eab01782e1aab26c84e09a6c2752d0ea998f6897
push id35397
push useropoprus@mozilla.com
push dateSat, 19 Jan 2019 03:35:41 +0000
treeherdermozilla-central@57dc8bbbc38f [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersTYLin
bugs1520946
milestone66.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1520946: Shrink some content in various w3c-submitted flexbox tests so that they won't trigger scrollbars in WPT harness. r=TYLin All of these tests have an .ini file indicating a failure for at least one of them right now, in the copy that lives in the WPT harness, because - they trigger a scrollbar in the WPT harness ...and: - the scrollbar is a slightly different size in the reference case vs. in one of the testcases, e.g. due to a tiny margin being honored (or not) on the final piece of content. This patch shrinks the content a bit in these test files so that they all fit in a 400x400 viewport and won't trigger a scrollbar. I expect this should make them pass in the WPT harness when they make the roundtrip through our synchronization process. Differential Revision: https://phabricator.services.mozilla.com/D16935
layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001-ref.xhtml
layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001a.xhtml
layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001b.xhtml
layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001-ref.xhtml
layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001a.xhtml
layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001b.xhtml
layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-003-ref.xhtml
layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-003.xhtml
--- a/layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001-ref.xhtml
+++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001-ref.xhtml
@@ -7,42 +7,42 @@
   <head>
     <title>CSS Reftest Reference</title>
     <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"/>
     <style>
       div.flexbox {
         width: 200px;
         margin-bottom: 2px;
         background: lightgray;
-        height: 20px;
+        height: 10px;
         clear: all;
       }
       div.a {
         width: 10px;
-        height: 20px;
+        height: 10px;
         background: lightgreen;
         float: left;
       }
       div.b {
         width: 30px;
-        height: 20px;
+        height: 10px;
         background: pink;
         float: left;
       }
       div.c {
         width: 40px;
-        height: 20px;
+        height: 10px;
         background: orange;
         float: left;
       }
 
       /* Inside of 'b': */
       div.fixedSizeChild {
         width: 30px;
-        height: 10px;
+        height: 5px;
         background: purple;
       }
     </style>
   </head>
   <body>
 
     <!-- default (stretch) -->
     <div class="flexbox">
--- a/layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001a.xhtml
+++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001a.xhtml
@@ -9,46 +9,46 @@
   <head>
     <title>CSS Test: Testing 'align-content' in a vertical flex container</title>
     <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"/>
     <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property"/>
     <link rel="match" href="flexbox-align-content-vert-001-ref.xhtml"/>
     <style>
       div.flexbox {
         width: 200px;
-        height: 20px; /* Short, to force us to wrap */
+        height: 10px; /* Short, to force us to wrap */
         display: flex;
         flex-direction: column;
         flex-wrap: wrap;
         margin-bottom: 2px;
         background: lightgray;
       }
       div.a {
         width: 10px;
-        height: 20px;
+        height: 10px;
         flex: none;
         background: lightgreen;
       }
       div.b {
         width: auto; /* width comes from contents */
-        height: 20px;
+        height: 10px;
         flex: none;
         background: pink;
       }
       div.c {
         width: 40px;
-        height: 20px;
+        height: 10px;
         flex: none;
         background: orange;
       }
 
       /* Inside of 'b': */
       div.fixedSizeChild {
         width: 30px;
-        height: 10px;
+        height: 5px;
         background: purple;
       }
     </style>
   </head>
   <body>
 
     <!-- default (stretch) -->
     <div class="flexbox">
--- a/layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001b.xhtml
+++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001b.xhtml
@@ -10,46 +10,46 @@
   <head>
     <title>CSS Test: Testing 'align-content' in a vertical flex container</title>
     <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"/>
     <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property"/>
     <link rel="match" href="flexbox-align-content-vert-001-ref.xhtml"/>
     <style>
       div.flexbox {
         width: 200px;
-        max-height: 20px; /* Short, to force us to wrap */
+        max-height: 10px; /* Short, to force us to wrap */
         display: flex;
         flex-direction: column;
         flex-wrap: wrap;
         margin-bottom: 2px;
         background: lightgray;
       }
       div.a {
         width: 10px;
-        height: 20px;
+        height: 10px;
         flex: none;
         background: lightgreen;
       }
       div.b {
         width: auto; /* width comes from contents */
-        height: 20px;
+        height: 10px;
         flex: none;
         background: pink;
       }
       div.c {
         width: 40px;
-        height: 20px;
+        height: 10px;
         flex: none;
         background: orange;
       }
 
       /* Inside of 'b': */
       div.fixedSizeChild {
         width: 30px;
-        height: 10px;
+        height: 5px;
         background: purple;
       }
     </style>
   </head>
   <body>
 
     <!-- default (stretch) -->
     <div class="flexbox">
--- a/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001-ref.xhtml
+++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001-ref.xhtml
@@ -11,27 +11,27 @@
       div.flexbox {
         margin-bottom: 2px;
         line-height: 0;
       }
       div.flexbox > * {
         display: inline-block;
       }
       div.a {
-        height: 20px;
+        height: 10px;
         width: 10px;
         background: lightgreen;
       }
       div.b {
-        height: 20px;
+        height: 10px;
         width: 50px;
         background: pink;
       }
       div.c {
-        height: 20px;
+        height: 10px;
         width: 100px;
         background: orange;
       }
     </style>
   </head>
   <body>
 
     <!-- default (start) -->
--- a/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001a.xhtml
+++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001a.xhtml
@@ -13,27 +13,27 @@
     <link rel="match" href="flexbox-justify-content-horiz-001-ref.xhtml"/>
     <style>
       div.flexbox {
         width: 200px;
         display: flex;
         margin-bottom: 2px;
       }
       div.a {
-        height: 20px;
+        height: 10px;
         flex: 0 10px;
         background: lightgreen;
       }
       div.b {
-        height: 20px;
+        height: 10px;
         flex: 0 50px;
         background: pink;
       }
       div.c {
-        height: 20px;
+        height: 10px;
         flex: 0 100px;
         background: orange;
       }
     </style>
   </head>
   <body>
 
     <!-- default (start) -->
--- a/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001b.xhtml
+++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001b.xhtml
@@ -19,27 +19,27 @@
         margin-bottom: 2px;
 
         /* Use "float" to trigger intrinsic sizing, which in this case will
             make us clamp to "min-width": */
         float: left;
         clear: both;
       }
       div.a {
-        height: 20px;
+        height: 10px;
         flex: 0 10px;
         background: lightgreen;
       }
       div.b {
-        height: 20px;
+        height: 10px;
         flex: 0 50px;
         background: pink;
       }
       div.c {
-        height: 20px;
+        height: 10px;
         flex: 0 100px;
         background: orange;
       }
     </style>
   </head>
   <body>
 
     <!-- default (start) -->
--- a/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-003-ref.xhtml
+++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-003-ref.xhtml
@@ -10,27 +10,27 @@
     <style>
       body { margin-top: 0px; } /* We'll apply margins w/ style attribute */
       div.flexbox {
         height: 200px;
         margin-right: 2px;
         float: left;
       }
       div.a {
-        width: 20px;
+        width: 10px;
         height: 35px;
         background: lightgreen;
       }
       div.b {
-        width: 20px;
+        width: 10px;
         height: 40px;
         background: pink;
       }
       div.c {
-        width: 20px;
+        width: 10px;
         height: 45px;
         background: orange;
       }
     </style>
   </head>
   <body>
 
     <!-- default (start) -->
--- a/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-003.xhtml
+++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-003.xhtml
@@ -24,27 +24,27 @@
       div.flexbox {
         height: 30px;
         display: flex;
         flex-direction: column;
         margin-right: 2px;
         float: left;
       }
       div.a {
-        width: 20px;
+        width: 10px;
         flex: 0 0 35px;
         background: lightgreen;
       }
       div.b {
-        width: 20px;
+        width: 10px;
         flex: 0 0 40px;
         background: pink;
       }
       div.c {
-        width: 20px;
+        width: 10px;
         flex: 0 0 45px;
         background: orange;
       }
     </style>
   </head>
   <body>
 
     <!-- default (start) -->