Bug 1359281 - Use rounded interpolation value when interpolating the Integer type and Font strech type based on spec. r=birtles

MozReview-Commit-ID: L4aP8MqYpna

--HG--
extra : rebase_source : 350b57c9ee7dbcd0b0261e155191244e64ed3528

layout/style/StyleAnimationValue.cpp

@@ -2883,9 +2883,10 @@ StyleAnimationValue::AddWeighted(nsCSSPropertyID aProperty,
     case eUnit_Enumerated:
       switch (aProperty) {
         case eCSSProperty_font_stretch: {
-          // Animate just like eUnit_Integer.
-          int32_t result = floor(aCoeff1 * double(aValue1.GetIntValue()) +
-                                 aCoeff2 * double(aValue2.GetIntValue()));
+          // https://drafts.csswg.org/css-fonts-3/#font-stretch-animation
+          double interpolatedValue = aCoeff1 * double(aValue1.GetIntValue()) +
+                                     aCoeff2 * double(aValue2.GetIntValue());
+          int32_t result = floor(interpolatedValue + 0.5);
           if (result < NS_STYLE_FONT_STRETCH_ULTRA_CONDENSED) {
             result = NS_STYLE_FONT_STRETCH_ULTRA_CONDENSED;
           } else if (result > NS_STYLE_FONT_STRETCH_ULTRA_EXPANDED) {
@@ -2917,10 +2918,10 @@ StyleAnimationValue::AddWeighted(nsCSSPropertyID aProperty,
       return true;
     }
     case eUnit_Integer: {
-      // http://dev.w3.org/csswg/css3-transitions/#animation-of-property-types-
-      // says we should use floor
-      int32_t result = floor(aCoeff1 * double(aValue1.GetIntValue()) +
-                             aCoeff2 * double(aValue2.GetIntValue()));
+      // https://drafts.csswg.org/css-transitions/#animtype-integer
+      double interpolatedValue = aCoeff1 * double(aValue1.GetIntValue()) +
+                                 aCoeff2 * double(aValue2.GetIntValue());
+      int32_t result = floor(interpolatedValue + 0.5);
       if (aProperty == eCSSProperty_font_weight) {
         if (result < 100) {
           result = 100;

layout/style/test/test_transitions_per_property.html

@@ -1836,7 +1836,7 @@ function test_integer_transition(prop) {
      "integer-valued property " + prop + ": computed value before transition");
   div.style.setProperty("transition-property", prop, "");
   div.style.setProperty(prop, "-14", "");
-  is(cs.getPropertyValue(prop), "-1",
+  is(cs.getPropertyValue(prop), "0",
      "integer-valued property " + prop + ": interpolation of integers");
   check_distance(prop, "6", "1", "-14");
 
@@ -1880,7 +1880,7 @@ function test_font_stretch(prop) {
      "font-stretch property " + prop + ": computed value before transition");
   div.style.setProperty("transition-property", prop, "");
   div.style.setProperty(prop, "extra-condensed", "");
-  is(cs.getPropertyValue(prop), "normal",
+  is(cs.getPropertyValue(prop), "semi-expanded",
      "font-stretch property " + prop + ": interpolation of font-stretches");
   check_distance(prop, "expanded", "semi-expanded", "condensed");
 
@@ -1964,7 +1964,7 @@ function test_pos_integer_or_auto_transition(prop) {
      "integer-valued property " + prop + ": computed value before transition");
   div.style.setProperty("transition-property", prop, "");
   div.style.setProperty(prop, "11", "");
-  is(cs.getPropertyValue(prop), "5",
+  is(cs.getPropertyValue(prop), "6",
      "integer-valued property " + prop + ": interpolation of integers");
   check_distance(prop, "4", "6", "12");
   div.style.setProperty(prop, "auto", "");