Properly invalidate relative length units in transform list animation

When animating a 'translate()' function with a <length-percentage>
parameter, the current code incorrectly thinks this is not a length
and does not include the length units into a LengthUnitsChecker. As
a result, the animation is not properly invalidated when the relative
length units in the parameter change value.

This patch fixes the issue by including the length units in
<length-percentage> parameters into the LengthUnitsChecker.

Bug: 1004096
Change-Id: Ib869b42e99683ada69c6e3bb50a943f82f25bcc5
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1846041
Commit-Queue: Xiaocheng Hu <xiaochengh@chromium.org>
Reviewed-by: Stephen McGruer <smcgruer@chromium.org>
Cr-Commit-Position: refs/heads/master@{#703852}

third_party/blink/renderer/core/animation/css_transform_interpolation_type.cc

@@ -93,8 +93,10 @@ InterpolationValue CSSTransformInterpolationType::MaybeConvertValue(
       }
       for (const CSSValue* argument : transform_function) {
         const auto& primitive_value = To<CSSPrimitiveValue>(*argument);
-        if (!primitive_value.IsLength())
+        if (!primitive_value.IsLength() &&
+            !primitive_value.IsCalculatedPercentageWithLength()) {
           continue;
+        }
         primitive_value.AccumulateLengthUnitTypes(types);
       }
     }

third_party/blink/web_tests/animations/responsive/interpolation/transform-responsive.html

@@ -57,4 +57,24 @@ assertCSSResponsive({
     ],
   }],
 });
+
+// https://crbug.com/1004096
+assertCSSResponsive({
+  property: 'transform',
+  from: 'translateX(0px)',
+  to: 'translateX(calc(10em + 0%))',
+  configurations: [{
+    state: {'font-size': '16px'},
+    expect: [
+      {at: 0.25, is: 'translateX(40px)'},
+      {at: 0.75, is: 'translateX(120px)'},
+    ],
+  }, {
+    state: {'font-size': '20px'},
+    expect: [
+      {at: 0.25, is: 'translateX(50px)'},
+      {at: 0.75, is: 'translateX(150px)'},
+    ],
+  }],
+});
 </script>