Title: [96851] trunk/LayoutTests
Revision
96851
Author
o...@chromium.org
Date
2011-10-06 12:33:43 -0700 (Thu, 06 Oct 2011)

Log Message

extend flexbox testing to test children and parents of the flexbox
https://bugs.webkit.org/show_bug.cgi?id=69495

Reviewed by Tony Chang.

Checking children of flex items allows for making sure that padding/border
get properly taken into account. Checking the parent of the flexbox allows
for checking that margins on the flexbox itself are applied correctly.

Also, make it so that failures print the outerHTML of the failing case to
make it easier to diagnose.

* css3/flexbox/001.html:
* css3/flexbox/resources/flexbox.js:
* css3/flexbox/writing-modes.html:

Modified Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (96850 => 96851)


--- trunk/LayoutTests/ChangeLog	2011-10-06 19:32:43 UTC (rev 96850)
+++ trunk/LayoutTests/ChangeLog	2011-10-06 19:33:43 UTC (rev 96851)
@@ -1,3 +1,21 @@
+2011-10-05  Ojan Vafai  <o...@chromium.org>
+
+        extend flexbox testing to test children and parents of the flexbox
+        https://bugs.webkit.org/show_bug.cgi?id=69495
+
+        Reviewed by Tony Chang.
+
+        Checking children of flex items allows for making sure that padding/border
+        get properly taken into account. Checking the parent of the flexbox allows
+        for checking that margins on the flexbox itself are applied correctly.
+
+        Also, make it so that failures print the outerHTML of the failing case to
+        make it easier to diagnose.
+
+        * css3/flexbox/001.html:
+        * css3/flexbox/resources/flexbox.js:
+        * css3/flexbox/writing-modes.html:
+
 2011-10-06  Cary Clark  <carycl...@google.com>
 
         New chromium-mac image baselines for focus-ring fix in

Modified: trunk/LayoutTests/css3/flexbox/001.html (96850 => 96851)


--- trunk/LayoutTests/css3/flexbox/001.html	2011-10-06 19:32:43 UTC (rev 96850)
+++ trunk/LayoutTests/css3/flexbox/001.html	2011-10-06 19:33:43 UTC (rev 96851)
@@ -142,7 +142,7 @@
 </div>
 
 <!-- Test border/padding/margin on the flexbox itself. -->
-<div style="border: 10px solid; display: inline-block;">
+<div data-expected-width="830" style="border: 10px solid; display: inline-block;">
     <div data-expected-width="700" style="display: -webkit-flexbox; padding-left: 10px; padding-right: 20px; border-left: 30px solid; border-right: 40px solid; margin-left: 50px; margin-right:60px;" class="flexbox ">
       <div data-offset-x="100" data-expected-width="200" style="width: -webkit-flex(1)"></div>
       <div data-offset-x="300" data-expected-width="200" style="width: -webkit-flex(1)"></div>

Modified: trunk/LayoutTests/css3/flexbox/002-expected.txt (96850 => 96851)


--- trunk/LayoutTests/css3/flexbox/002-expected.txt	2011-10-06 19:32:43 UTC (rev 96850)
+++ trunk/LayoutTests/css3/flexbox/002-expected.txt	2011-10-06 19:33:43 UTC (rev 96851)
@@ -9,4 +9,3 @@
 PASS
 PASS
 PASS
-

Modified: trunk/LayoutTests/css3/flexbox/003-expected.txt (96850 => 96851)


--- trunk/LayoutTests/css3/flexbox/003-expected.txt	2011-10-06 19:32:43 UTC (rev 96850)
+++ trunk/LayoutTests/css3/flexbox/003-expected.txt	2011-10-06 19:33:43 UTC (rev 96851)
@@ -5,4 +5,3 @@
 PASS
 PASS
 PASS
-

Modified: trunk/LayoutTests/css3/flexbox/004-expected.txt (96850 => 96851)


--- trunk/LayoutTests/css3/flexbox/004-expected.txt	2011-10-06 19:32:43 UTC (rev 96850)
+++ trunk/LayoutTests/css3/flexbox/004-expected.txt	2011-10-06 19:33:43 UTC (rev 96851)
@@ -5,4 +5,3 @@
 PASS
 PASS
 PASS
-

Modified: trunk/LayoutTests/css3/flexbox/resources/flexbox.js (96850 => 96851)


--- trunk/LayoutTests/css3/flexbox/resources/flexbox.js	2011-10-06 19:32:43 UTC (rev 96850)
+++ trunk/LayoutTests/css3/flexbox/resources/flexbox.js	2011-10-06 19:33:43 UTC (rev 96851)
@@ -6,6 +6,14 @@
         referenceNode.parentNode.appendChild(nodeToAdd);
 }
 
+function checkSubtreeExpectedValues(parent, failures)
+{
+    checkExpectedValues(parent, failures);
+    Array.prototype.forEach.call(parent.childNodes, function(node) {
+        checkSubtreeExpectedValues(node, failures);
+    });
+}
+
 function checkExpectedValues(node, failures)
 {
     var expectedWidth = node.getAttribute && node.getAttribute("data-expected-width");
@@ -37,16 +45,12 @@
 {
     var flexboxen = document.getElementsByClassName("flexbox");
     Array.prototype.forEach.call(flexboxen, function(flexbox) {
-      var failures = [];
-      checkExpectedValues(flexbox, failures);
+        var failures = [];
+        checkExpectedValues(flexbox.parentNode, failures);
+        checkSubtreeExpectedValues(flexbox, failures);
 
-      var child = flexbox.firstChild;
-      while (child) {
-          checkExpectedValues(child, failures);
-          child = child.nextSibling;
-      }
-
-      insertAfter(document.createElement("p"), flexbox);
-      insertAfter(document.createTextNode(failures.length ? failures.join('') : "PASS"), flexbox);
+        var pre = document.createElement('pre');
+        pre.appendChild(document.createTextNode(failures.length ? "FAIL:\n" + failures.join('\n') + '\n\n' + flexbox.outerHTML : "PASS"));
+        insertAfter(pre, flexbox);
     });
 }

Modified: trunk/LayoutTests/css3/flexbox/writing-modes-expected.txt (96850 => 96851)


--- trunk/LayoutTests/css3/flexbox/writing-modes-expected.txt	2011-10-06 19:32:43 UTC (rev 96850)
+++ trunk/LayoutTests/css3/flexbox/writing-modes-expected.txt	2011-10-06 19:33:43 UTC (rev 96851)
@@ -19,4 +19,3 @@
 PASS
 PASS
 PASS
-

Modified: trunk/LayoutTests/css3/flexbox/writing-modes.html (96850 => 96851)


--- trunk/LayoutTests/css3/flexbox/writing-modes.html	2011-10-06 19:32:43 UTC (rev 96850)
+++ trunk/LayoutTests/css3/flexbox/writing-modes.html	2011-10-06 19:33:43 UTC (rev 96851)
@@ -125,7 +125,7 @@
 <div style="position:relative">
 <div class="flexbox vertical-lr">
   <div data-expected-height="75" data-offset-y="0" style="height: -webkit-flex(1 0 0);margin: auto 0;"></div>
-  <div data-expected-height="450" data-offset-y="75" style="height: -webkit-flex(2 0 auto);"><div style="width:200px;height:300px;background-color:orange;"></div></div>
+  <div data-expected-height="450" data-offset-y="75" style="height: -webkit-flex(2 0 auto);"><div data-offset-y="75" style="width:200px;height:300px;background-color:orange;"></div></div>
   <div data-expected-height="75" data-offset-y="525" style="height: -webkit-flex(1 0 0);"></div>
 </div>
 </div>
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
http://lists.webkit.org/mailman/listinfo.cgi/webkit-changes

Reply via email to