Bug 1450390 part 1: Extend mochitest to cover transitions to/from flex-basis "content" keyword. r=emilio
authorDaniel Holbert <dholbert@cs.stanford.edu>
Tue, 03 Apr 2018 15:09:43 -0700
changeset 777146 c259dc509f8be5f10d457a7113d3cb6a13e687b9
parent 777145 19508ed3af00749d7dbdd3664643a5985066de99
child 777147 363cd8bba7744e99cc7de66a9b89a3617551334e
push id105088
push userjdescottes@mozilla.com
push dateWed, 04 Apr 2018 10:12:11 +0000
reviewersemilio
bugs1450390
milestone61.0a1
Bug 1450390 part 1: Extend mochitest to cover transitions to/from flex-basis "content" keyword. r=emilio MozReview-Commit-ID: ABZn5GgH9Kr
layout/style/test/test_transitions_per_property.html
--- a/layout/style/test/test_transitions_per_property.html
+++ b/layout/style/test/test_transitions_per_property.html
@@ -143,17 +143,18 @@ var supported_properties = {
     "fill": [ test_color_transition,
               test_currentcolor_transition ],
     "fill-opacity" : [ test_float_zeroToOne_transition,
                        // opacity is clamped in computed style
                        // (not parsing/interpolation)
                        test_float_zeroToOne_clamped ],
     "filter" : [ test_filter_transition ],
     "flex-basis": [ test_length_transition, test_percent_transition,
-                    test_length_clamped, test_percent_clamped ],
+                    test_length_clamped, test_percent_clamped,
+                    test_flex_basis_content_transition ],
     "flex-grow": [ test_float_zeroToOne_transition,
                    test_float_aboveOne_transition ],
     "flex-shrink": [ test_float_zeroToOne_transition,
                      test_float_aboveOne_transition ],
     "flood-color": [ test_color_transition,
                      test_currentcolor_transition ],
     "flood-opacity" : [ test_float_zeroToOne_transition,
                         // opacity is clamped in computed style
@@ -1164,16 +1165,41 @@ function test_length_clamped_or_unclampe
   div.style.setProperty("transition-property", prop, "");
   div.style.setProperty(prop, "100px", "");
   (is_clamped ? is : isnot)(cs.getPropertyValue(prop),
      numbers_are_pixels ? "0" : "0px",
      "length-valued property " + prop + ": clamping of negatives");
   div.style.setProperty("transition-timing-function", "linear", "");
 }
 
+// Test transition to/from the special 'flex-basis: content' keyword.
+function test_flex_basis_content_transition(prop) {
+  is(prop, "flex-basis", "this test function should only be called for 'flex-basis'");
+
+  // Test transition from length to 'content':
+  div.style.setProperty("transition-property", "none", "");
+  div.style.setProperty(prop, "8px", "");
+  is(cs.getPropertyValue(prop), "8px",
+     "property " + prop + ": computed value before transition to 'content'");
+  div.style.setProperty("transition-property", prop, "");
+  div.style.setProperty(prop, "content", "");
+  is(cs.getPropertyValue(prop), "content",
+     "property " + prop + ": transition to 'content' (should be discrete)");
+
+  // Test transition from 'content' to length:
+  div.style.setProperty("transition-property", "none", "");
+  div.style.setProperty(prop, "content", "");
+  is(cs.getPropertyValue(prop), "content",
+     "property " + prop + ": computed value before transition from 'content'");
+  div.style.setProperty("transition-property", prop, "");
+  div.style.setProperty(prop, "6px", "");
+  is(cs.getPropertyValue(prop), "6px",
+     "property " + prop + ": transition from 'content' (should be discrete)");
+}
+
 // Test using float values in the range [0, 1] (e.g. opacity)
 function test_float_zeroToOne_transition(prop) {
   div.style.setProperty("transition-property", "none", "");
   div.style.setProperty(prop, "0.3", "");
   is(cs.getPropertyValue(prop), "0.3",
      "float-valued property " + prop + ": computed value before transition");
   div.style.setProperty("transition-property", prop, "");
   div.style.setProperty(prop, "0.8", "");