[css-typed-om] Allow transform values to accept CSSMathValues too.

Currently CSSTranslate, CSSRotate and CSSScale do not accept calc values
(CSSMathValues) because it requires type checking the calc value to see
if they match the right type [1]. Since type checking and matching are
now implemented, we have all the machinery to accept CSSMathValues too.

This patch uses CSSNumericValueType.Matches* functions to check if
the CSSNumericValues passed in resolve to the right type.

We also (re)moved some redundant DCHECKs.

We will have a follow up patch for CSSSkew and CSSPerspective.

Note that percents are not allowed in CSSTranslation (spec needs edit):
https://github.com/w3c/css-houdini-drafts/issues/530

[1] https://drafts.css-houdini.org/css-typed-om-1/#cssnumericvalue-match

Specs:
https://drafts.css-houdini.org/css-typed-om-1/#dom-csstranslation-csstranslation
https://drafts.css-houdini.org/css-typed-om-1/#dom-cssrotation-cssrotation
https://drafts.css-houdini.org/css-typed-om-1/#dom-cssrotation-cssrotation-x-y-z-angle
https://drafts.css-houdini.org/css-typed-om-1/#dom-cssscale-cssscale

Bug: 789370
Change-Id: I6f538a3f07b4c58eb15c9f059c39751e66f64f2f
Reviewed-on: https://chromium-review.googlesource.com/812364
Commit-Queue: Darren Shen <shend@chromium.org>
Reviewed-by: meade_UTC10 <meade@chromium.org>
Cr-Commit-Position: refs/heads/master@{#523706}

third_party/WebKit/LayoutTests/typedcssom/inlinestyle/properties/transform.html

@@ -115,8 +115,6 @@ runInlineStylePropertyMapTests( {
 });
 
 let crashTestStrings = {
-  'rotate(calc(45deg + 1rad))': 'rotate(calc(102.296deg))',
-  'rotate3d(1, 2, 3, calc(45deg + 1rad))': 'rotate3d(1, 2, 3, calc(102.296deg))',
   'skew(calc(5deg + 0.1rad))': 'skew(calc(10.7296deg))',
   'skew(calc(5deg + 0.1rad), 5deg)': 'skew(calc(10.7296deg), 5deg)',
   'skew(5deg, calc(5deg + 0.1rad))': 'skew(5deg, calc(10.7296deg))',

third_party/WebKit/LayoutTests/typedcssom/stylevalue-subclasses/cssRotation-expected.txt

-This is a testharness.js-based test.
-PASS Constructing a CSSRotation with a CSSUnitValue with type other than angle for the angle throws a TypeError
-PASS Constructing a CSSRotation with a CSSMathValue that doesn't match <angle> for the angle throws a TypeError
-PASS Constructing a CSSRotation with a CSSUnitValue with type other than number for the coordinates throws a TypeError
-PASS Constructing a CSSRotation with a CSSMathValue that doesn't match <number> for the coordinates throws a TypeError
-PASS Updating CSSRotation.x to a CSSUnitValue with type other than number throws a TypeError
-PASS Updating CSSRotation.x to a CSSMathValue that doesn't match <number> throws a TypeError
-PASS Updating CSSRotation.y to a CSSUnitValue with type other than number throws a TypeError
-PASS Updating CSSRotation.y to a CSSMathValue that doesn't match <number> throws a TypeError
-PASS Updating CSSRotation.z to a CSSUnitValue with type other than number throws a TypeError
-PASS Updating CSSRotation.z to a CSSMathValue that doesn't match <number> throws a TypeError
-PASS Updating CSSRotation.angle to a CSSUnitValue with type other than angle throws a TypeError
-PASS Updating CSSRotation.angle to a CSSMathValue that doesn't match <angle> throws a TypeError
-PASS CSSRotation can be constructed from a single angle
-FAIL CSSRotation can be constructed from numberish coordinates angle is not defined
-FAIL CSSRotation can be constructed from CSSMathValues Failed to construct 'CSSRotation': Must specify an number unit
-PASS CSSRotation.x can be updated to a double
-PASS CSSRotation.x can be updated to a number CSSUnitValue
-FAIL CSSRotation.x can be updated to a CSSMathValue matching <number> Failed to set the 'x' property on 'CSSRotation': Must specify a number unit
-PASS CSSRotation.y can be updated to a double
-PASS CSSRotation.y can be updated to a number CSSUnitValue
-FAIL CSSRotation.y can be updated to a CSSMathValue matching <number> Failed to set the 'y' property on 'CSSRotation': Must specify a number unit
-PASS CSSRotation.z can be updated to a double
-PASS CSSRotation.z can be updated to a number CSSUnitValue
-FAIL CSSRotation.z can be updated to a CSSMathValue matching <number> Failed to set the 'z' property on 'CSSRotation': Must specify a number unit
-PASS CSSRotation.angle can be updated to a degree CSSUnitValue
-FAIL CSSRotation.angle can be updated to a CSSMathValue matching <angle> Failed to set the 'angle' property on 'CSSRotation': Must pass an angle to CSSRotation
-PASS Modifying CSSRotation.is2D can be updated to true or false
-Harness: the test ran to completion.
-

third_party/WebKit/LayoutTests/typedcssom/stylevalue-subclasses/cssRotation.html

@@ -65,7 +65,7 @@ test(() => {
   assert_style_value_equals(result.x, CSS.number(-3.14));
   assert_style_value_equals(result.y, CSS.number(3.14));
   assert_style_value_equals(result.z, CSS.number(3.14));
-  assert_style_value_equals(result.angle, angle);
+  assert_style_value_equals(result.angle, CSS.deg(3.14));
   assert_false(result.is2D);
 }, 'CSSRotation can be constructed from numberish coordinates');
 
@@ -74,12 +74,12 @@ test(() => {
     new CSSMathSum(-3.14),
     new CSSMathProduct(3.14),
     new CSSMathNegate(-3.14),
-    new CSSMathInvert(CSS.deg(3.14))
+    new CSSMathMax(CSS.deg(3.14))
   );
   assert_style_value_equals(result.x, new CSSMathSum(-3.14));
   assert_style_value_equals(result.y, new CSSMathProduct(3.14));
   assert_style_value_equals(result.z, new CSSMathNegate(-3.14));
-  assert_style_value_equals(result.angle, new CSSMathInvert(CSS.deg(3.14)));
+  assert_style_value_equals(result.angle, new CSSMathMax(CSS.deg(3.14)));
   assert_false(result.is2D);
 }, 'CSSRotation can be constructed from CSSMathValues');
 

third_party/WebKit/LayoutTests/typedcssom/stylevalue-subclasses/cssScale-expected.txt

-This is a testharness.js-based test.
-PASS Constructing a CSSScale with an angle CSSUnitValue for the coordinates throws a TypeError
-PASS Constructing a CSSScale with a CSSMathValue that doesn't match <number> for the coordinates throws a TypeError
-PASS Updating CSSScale.x to an angle CSSUnitValue throws a TypeError
-PASS Updating CSSScale.x to a CSSMathValue that doesn't match <number> throws a TypeError
-PASS Updating CSSScale.y to an angle CSSUnitValue throws a TypeError
-PASS Updating CSSScale.y to a CSSMathValue that doesn't match <number> throws a TypeError
-PASS Updating CSSScale.z to an angle CSSUnitValue throws a TypeError
-PASS Updating CSSScale.z to a CSSMathValue that doesn't match <number> throws a TypeError
-PASS CSSScale can be constructed from two number coordinates
-PASS CSSScale can be constructed from three number coordinates
-FAIL CSSScale can be constructed from CSSMathValue coordinates Failed to construct 'CSSScale': Must specify a number unit
-PASS CSSScale.x can be updated to a number
-PASS CSSScale.x can be updated to a numberish
-FAIL CSSScale.x can be updated to a CSSMathValue Failed to set the 'x' property on 'CSSScale': Must specify a number unit
-PASS CSSScale.y can be updated to a number
-PASS CSSScale.y can be updated to a numberish
-FAIL CSSScale.y can be updated to a CSSMathValue Failed to set the 'y' property on 'CSSScale': Must specify a number unit
-PASS CSSScale.z can be updated to a number
-PASS CSSScale.z can be updated to a numberish
-FAIL CSSScale.z can be updated to a CSSMathValue Failed to set the 'z' property on 'CSSScale': Must specify a number unit
-PASS Modifying CSSScale.is2D can be updated to true or false
-Harness: the test ran to completion.
-

third_party/WebKit/LayoutTests/typedcssom/stylevalue-subclasses/cssTranslation-expected.txt

-This is a testharness.js-based test.
-PASS Constructing a CSSTranslation with a CSSUnitValue with type other than length or percent for the coordinates throws a TypeError
-PASS Constructing a CSSTranslation with a CSSMathValue that doesn't match <length-percentage> for the coordinates throws a TypeError
-PASS Updating CSSTranslation.x to a CSSUnitValue with type other than length or percent throws a TypeError
-PASS Updating CSSTranslation.x to a CSSMathValue that doesn't match <length-percentage> throws a TypeError
-PASS Updating CSSTranslation.y to a CSSUnitValue with type other than length or percent throws a TypeError
-PASS Updating CSSTranslation.y to a CSSMathValue that doesn't match <length-percentage> throws a TypeError
-PASS Updating CSSTranslation.z to a CSSUnitValue with type other than length or percent throws a TypeError
-PASS Updating CSSTranslation.z to a CSSMathValue that doesn't match <length-percentage> throws a TypeError
-PASS CSSTranslation can be constructed from two length or percent coordinates
-PASS CSSTranslation can be constructed from three length or percent coordinates
-FAIL CSSTranslation can be constructed from CSSMathValues Failed to construct 'CSSTranslation': Must pass length or percentage to X and Y of CSSTranslation
-PASS CSSTranslation.x can be updated to a length
-PASS CSSTranslation.x can be updated to a percent
-FAIL CSSTranslation.x can be updated to a CSSMathValue Failed to set the 'x' property on 'CSSTranslation': Must pass length or percentage to X of CSSTranslation
-PASS CSSTranslation.y can be updated to a length
-PASS CSSTranslation.y can be updated to a percent
-FAIL CSSTranslation.y can be updated to a CSSMathValue Failed to set the 'y' property on 'CSSTranslation': Must pass length or percent to Y of CSSTranslation
-PASS CSSTranslation.z can be updated to a length
-FAIL CSSTranslation.z can be updated to a percent Failed to set the 'z' property on 'CSSTranslation': Must pass length to Z of CSSTranslation
-FAIL CSSTranslation.z can be updated to a CSSMathValue Failed to set the 'z' property on 'CSSTranslation': Must pass length to Z of CSSTranslation
-PASS Modifying CSSTranslation.is2D can be updated to true or false
-Harness: the test ran to completion.
-

third_party/WebKit/LayoutTests/typedcssom/stylevalue-subclasses/cssTranslation.html

@@ -21,6 +21,10 @@ for (const {coord, desc} of gInvalidCoordTestCases) {
   }, 'Constructing a CSSTranslation with ' + desc + ' for the coordinates throws a TypeError');
 }
 
+test(() => {
+  assert_throws(new TypeError(), () => new CSSTranslation(CSS.px(0), CSS.px(0), CSS.percent(0)));
+}, 'Constructing a CSSTranslation with a percent for the Z coordinate throws a TypeError');
+
 for (const attr of ['x', 'y', 'z']) {
   for (const {value, desc} of gInvalidCoordTestCases) {
     test(() => {
@@ -31,6 +35,12 @@ for (const attr of ['x', 'y', 'z']) {
   }
 }
 
+test(() => {
+  let result = new CSSTranslation(CSS.px(0), CSS.px(0), CSS.px(0));
+  assert_throws(new TypeError(), () => result.z = CSS.percent(0));
+  assert_style_value_equals(result.z, CSS.px(0));
+}, 'Updating CSSTranslation.z to a percent throws a TypeError');
+
 test(() => {
   const result = new CSSTranslation(CSS.px(-3.14), CSS.percent(3.14));
   assert_style_value_equals(result.x, CSS.px(-3.14));
@@ -55,7 +65,7 @@ test(() => {
   assert_true(result.is2D);
 }, 'CSSTranslation can be constructed from CSSMathValues');
 
-for (const attr of ['x', 'y', 'z']) {
+for (const attr of ['x', 'y']) {
   test(() => {
     let result = new CSSTranslation(CSS.px(0), CSS.px(0), CSS.px(0));
     result[attr] = CSS.px(3.14);
@@ -70,13 +80,25 @@ for (const attr of ['x', 'y', 'z']) {
 
   test(() => {
     let result = new CSSTranslation(CSS.px(0), CSS.px(0), CSS.px(0));
-    result[attr] = new CSSMathSum(CSS.percent(3.14));
-    assert_style_value_equals(result[attr], new CSSMathSum(CSS.percent(3.14)));
+    result[attr] = new CSSMathSum(CSS.px(3.14));
+    assert_style_value_equals(result[attr], new CSSMathSum(CSS.px(3.14)));
     result[attr] = new CSSMathSum(CSS.percent(3.14));
     assert_style_value_equals(result[attr], new CSSMathSum(CSS.percent(3.14)));
   }, 'CSSTranslation.' + attr + ' can be updated to a CSSMathValue');
 }
 
+test(() => {
+  let result = new CSSTranslation(CSS.px(0), CSS.px(0), CSS.px(0));
+  result.z = CSS.px(3.14);
+  assert_style_value_equals(result.z, CSS.px(3.14));
+}, 'CSSTranslation.z can be updated to a length');
+
+test(() => {
+  let result = new CSSTranslation(CSS.px(0), CSS.px(0), CSS.px(0));
+  result.z = new CSSMathSum(CSS.px(3.14));
+  assert_style_value_equals(result.z, new CSSMathSum(CSS.px(3.14)));
+}, 'CSSTranslation.z can be updated to a CSSMathValue');
+
 test(() => {
   let result = new CSSTranslation(CSS.px(0), CSS.px(0));
   result.is2D = true;

third_party/WebKit/Source/core/css/cssom/CSSRotation.cpp

@@ -14,52 +14,43 @@ namespace blink {
 
 namespace {
 
-bool IsNumberValue(const CSSValue& value) {
-  return value.IsPrimitiveValue() && ToCSSPrimitiveValue(value).IsNumber();
+bool IsValidCoordinate(const CSSNumericValue* value) {
+  return value && value->Type().MatchesNumber();
 }
 
-bool IsCoordValid(CSSNumericValue* value) {
-  // TODO: CSSMathValue are not supported yet
-  if (!value->IsUnitValue())
-    return false;
-  if (value->GetType() != CSSStyleValue::StyleValueType::kNumberType) {
-    return false;
-  }
-  return true;
+bool IsValidAngle(const CSSNumericValue* value) {
+  return value &&
+         value->Type().MatchesBaseType(CSSNumericValueType::BaseType::kAngle);
 }
 
 CSSRotation* FromCSSRotate(const CSSFunctionValue& value) {
   DCHECK_EQ(value.length(), 1UL);
-  const CSSPrimitiveValue& primitive_value = ToCSSPrimitiveValue(value.Item(0));
-  if (primitive_value.IsCalculated() || !primitive_value.IsAngle())
-    return nullptr;
-  return CSSRotation::Create(CSSNumericValue::FromCSSValue(primitive_value));
+  CSSNumericValue* angle =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
+  return CSSRotation::Create(angle);
 }
 
 CSSRotation* FromCSSRotate3d(const CSSFunctionValue& value) {
   DCHECK_EQ(value.length(), 4UL);
-  DCHECK(IsNumberValue(value.Item(0)));
-  DCHECK(IsNumberValue(value.Item(1)));
-  DCHECK(IsNumberValue(value.Item(2)));
-  const CSSPrimitiveValue& angle = ToCSSPrimitiveValue(value.Item(3));
-  if (angle.IsCalculated() || !angle.IsAngle())
-    return nullptr;
 
-  double x = ToCSSPrimitiveValue(value.Item(0)).GetDoubleValue();
-  double y = ToCSSPrimitiveValue(value.Item(1)).GetDoubleValue();
-  double z = ToCSSPrimitiveValue(value.Item(2)).GetDoubleValue();
+  CSSNumericValue* x =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
+  CSSNumericValue* y =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(1)));
+  CSSNumericValue* z =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(2)));
+  CSSNumericValue* angle =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(3)));
 
-  return CSSRotation::Create(CSSUnitValue::Create(x), CSSUnitValue::Create(y),
-                             CSSUnitValue::Create(z),
-                             CSSNumericValue::FromCSSValue(angle));
+  return CSSRotation::Create(x, y, z, angle);
 }
 
 CSSRotation* FromCSSRotateXYZ(const CSSFunctionValue& value) {
   DCHECK_EQ(value.length(), 1UL);
-  const CSSPrimitiveValue& primitive_value = ToCSSPrimitiveValue(value.Item(0));
-  if (primitive_value.IsCalculated())
-    return nullptr;
-  CSSNumericValue* angle = CSSNumericValue::FromCSSValue(primitive_value);
+
+  CSSNumericValue* angle =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
+
   switch (value.FunctionType()) {
     case CSSValueRotateX:
       return CSSRotation::Create(CSSUnitValue::Create(1),
@@ -83,7 +74,7 @@ CSSRotation* FromCSSRotateXYZ(const CSSFunctionValue& value) {
 
 CSSRotation* CSSRotation::Create(CSSNumericValue* angle,
                                  ExceptionState& exception_state) {
-  if (angle->GetType() != CSSStyleValue::StyleValueType::kAngleType) {
+  if (!IsValidAngle(angle)) {
     exception_state.ThrowTypeError("Must pass an angle to CSSRotation");
     return nullptr;
   }
@@ -100,12 +91,12 @@ CSSRotation* CSSRotation::Create(const CSSNumberish& x,
   CSSNumericValue* y_value = CSSNumericValue::FromNumberish(y);
   CSSNumericValue* z_value = CSSNumericValue::FromNumberish(z);
 
-  if (!IsCoordValid(x_value) || !IsCoordValid(y_value) ||
-      !IsCoordValid(z_value)) {
+  if (!IsValidCoordinate(x_value) || !IsValidCoordinate(y_value) ||
+      !IsValidCoordinate(z_value)) {
     exception_state.ThrowTypeError("Must specify an number unit");
     return nullptr;
   }
-  if (angle->GetType() != CSSStyleValue::StyleValueType::kAngleType) {
+  if (!IsValidAngle(angle)) {
     exception_state.ThrowTypeError("Must pass an angle to CSSRotation");
     return nullptr;
   }
@@ -113,7 +104,6 @@ CSSRotation* CSSRotation::Create(const CSSNumberish& x,
 }
 
 CSSRotation* CSSRotation::Create(CSSNumericValue* angle) {
-  DCHECK_EQ(angle->GetType(), CSSStyleValue::StyleValueType::kAngleType);
   return new CSSRotation(CSSUnitValue::Create(0), CSSUnitValue::Create(0),
                          CSSUnitValue::Create(1), angle, true /* is2D */);
 }
@@ -122,7 +112,6 @@ CSSRotation* CSSRotation::Create(CSSNumericValue* x,
                                  CSSNumericValue* y,
                                  CSSNumericValue* z,
                                  CSSNumericValue* angle) {
-  DCHECK_EQ(angle->GetType(), CSSStyleValue::StyleValueType::kAngleType);
   return new CSSRotation(x, y, z, angle, false /* is2D */);
 }
 
@@ -144,14 +133,10 @@ CSSRotation* CSSRotation::FromCSSValue(const CSSFunctionValue& value) {
 
 void CSSRotation::setAngle(CSSNumericValue* angle,
                            ExceptionState& exception_state) {
-  if (angle->GetType() != CSSStyleValue::StyleValueType::kAngleType) {
+  if (!IsValidAngle(angle)) {
     exception_state.ThrowTypeError("Must pass an angle to CSSRotation");
     return;
   }
-  if (!angle->IsUnitValue()) {
-    exception_state.ThrowTypeError("Calculated angles are not supported yet");
-    return;
-  }
   angle_ = angle;
 }
 
@@ -178,7 +163,6 @@ const DOMMatrix* CSSRotation::AsMatrix(ExceptionState& exception_state) const {
 
 const CSSFunctionValue* CSSRotation::ToCSSValue(
     SecureContextMode secure_context_mode) const {
-  // TODO(meade): Handle calc angles.
   CSSUnitValue* x = x_->to(CSSPrimitiveValue::UnitType::kNumber);
   CSSUnitValue* y = y_->to(CSSPrimitiveValue::UnitType::kNumber);
   CSSUnitValue* z = z_->to(CSSPrimitiveValue::UnitType::kNumber);
@@ -200,7 +184,7 @@ const CSSFunctionValue* CSSRotation::ToCSSValue(
 
 void CSSRotation::setX(const CSSNumberish& x, ExceptionState& exception_state) {
   CSSNumericValue* value = CSSNumericValue::FromNumberish(x);
-  if (!IsCoordValid(value)) {
+  if (!IsValidCoordinate(value)) {
     exception_state.ThrowTypeError("Must specify a number unit");
     return;
   }
@@ -209,7 +193,7 @@ void CSSRotation::setX(const CSSNumberish& x, ExceptionState& exception_state) {
 
 void CSSRotation::setY(const CSSNumberish& y, ExceptionState& exception_state) {
   CSSNumericValue* value = CSSNumericValue::FromNumberish(y);
-  if (!IsCoordValid(value)) {
+  if (!IsValidCoordinate(value)) {
     exception_state.ThrowTypeError("Must specify a number unit");
     return;
   }
@@ -218,11 +202,23 @@ void CSSRotation::setY(const CSSNumberish& y, ExceptionState& exception_state) {
 
 void CSSRotation::setZ(const CSSNumberish& z, ExceptionState& exception_state) {
   CSSNumericValue* value = CSSNumericValue::FromNumberish(z);
-  if (!IsCoordValid(value)) {
+  if (!IsValidCoordinate(value)) {
     exception_state.ThrowTypeError("Must specify a number unit");
     return;
   }
   z_ = value;
 }
 
+CSSRotation::CSSRotation(CSSNumericValue* x,
+                         CSSNumericValue* y,
+                         CSSNumericValue* z,
+                         CSSNumericValue* angle,
+                         bool is2D)
+    : CSSTransformComponent(is2D), angle_(angle), x_(x), y_(y), z_(z) {
+  DCHECK(IsValidCoordinate(x));
+  DCHECK(IsValidCoordinate(y));
+  DCHECK(IsValidCoordinate(z));
+  DCHECK(IsValidAngle(angle));
+}
+
 }  // namespace blink

third_party/WebKit/Source/core/css/cssom/CSSRotation.h

@@ -66,8 +66,7 @@ class CORE_EXPORT CSSRotation final : public CSSTransformComponent {
               CSSNumericValue* y,
               CSSNumericValue* z,
               CSSNumericValue* angle,
-              bool is2D)
-      : CSSTransformComponent(is2D), angle_(angle), x_(x), y_(y), z_(z) {}
+              bool is2D);
 
   Member<CSSNumericValue> angle_;
   Member<CSSNumericValue> x_;

third_party/WebKit/Source/core/css/cssom/CSSScale.cpp

@@ -11,22 +11,28 @@ namespace blink {
 
 namespace {
 
+bool IsValidCoordinate(CSSNumericValue* value) {
+  return value && value->Type().MatchesNumber();
+}
+
 CSSScale* FromScale(const CSSFunctionValue& value) {
   DCHECK(value.length() == 1U || value.length() == 2U);
-  double x = ToCSSPrimitiveValue(value.Item(0)).GetDoubleValue();
+  CSSNumericValue* x =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
   if (value.length() == 1U) {
-    return CSSScale::Create(CSSUnitValue::Create(x), CSSUnitValue::Create(x));
+    return CSSScale::Create(x, x);
   }
 
-  double y = ToCSSPrimitiveValue(value.Item(1)).GetDoubleValue();
-  return CSSScale::Create(CSSUnitValue::Create(x), CSSUnitValue::Create(y));
+  CSSNumericValue* y =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(1)));
+  return CSSScale::Create(x, y);
 }
 
 CSSScale* FromScaleXYZ(const CSSFunctionValue& value) {
   DCHECK_EQ(value.length(), 1U);
 
   CSSNumericValue* numeric_value =
-      CSSUnitValue::Create(ToCSSPrimitiveValue(value.Item(0)).GetDoubleValue());
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
   CSSUnitValue* default_value = CSSUnitValue::Create(1);
   switch (value.FunctionType()) {
     case CSSValueScaleX:
@@ -43,12 +49,15 @@ CSSScale* FromScaleXYZ(const CSSFunctionValue& value) {
 
 CSSScale* FromScale3d(const CSSFunctionValue& value) {
   DCHECK_EQ(value.length(), 3U);
-  double x = ToCSSPrimitiveValue(value.Item(0)).GetDoubleValue();
-  double y = ToCSSPrimitiveValue(value.Item(1)).GetDoubleValue();
-  double z = ToCSSPrimitiveValue(value.Item(2)).GetDoubleValue();
 
-  return CSSScale::Create(CSSUnitValue::Create(x), CSSUnitValue::Create(y),
-                          CSSUnitValue::Create(z));
+  CSSNumericValue* x =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
+  CSSNumericValue* y =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(1)));
+  CSSNumericValue* z =
+      CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(2)));
+
+  return CSSScale::Create(x, y, z);
 }
 
 }  // namespace
@@ -59,12 +68,12 @@ CSSScale* CSSScale::Create(const CSSNumberish& x,
   CSSNumericValue* x_value = CSSNumericValue::FromNumberish(x);
   CSSNumericValue* y_value = CSSNumericValue::FromNumberish(y);
 
-  if (!isCoordValid(x_value) || !isCoordValid(y_value)) {
+  if (!IsValidCoordinate(x_value) || !IsValidCoordinate(y_value)) {
     exception_state.ThrowTypeError("Must specify an number unit");
     return nullptr;
   }
 
-  return new CSSScale(x_value, y_value);
+  return CSSScale::Create(x_value, y_value);
 }
 
 CSSScale* CSSScale::Create(const CSSNumberish& x,
@@ -75,13 +84,13 @@ CSSScale* CSSScale::Create(const CSSNumberish& x,
   CSSNumericValue* y_value = CSSNumericValue::FromNumberish(y);
   CSSNumericValue* z_value = CSSNumericValue::FromNumberish(z);
 
-  if (!isCoordValid(x_value) || !isCoordValid(y_value) ||
-      !isCoordValid(z_value)) {
-    exception_state.ThrowTypeError("Must specify a number unit");
+  if (!IsValidCoordinate(x_value) || !IsValidCoordinate(y_value) ||
+      !IsValidCoordinate(z_value)) {
+    exception_state.ThrowTypeError("Must specify a number for X, Y and Z");
     return nullptr;
   }
 
-  return new CSSScale(x_value, y_value, z_value);
+  return CSSScale::Create(x_value, y_value, z_value);
 }
 
 CSSScale* CSSScale::FromCSSValue(const CSSFunctionValue& value) {
@@ -103,27 +112,29 @@ CSSScale* CSSScale::FromCSSValue(const CSSFunctionValue& value) {
 void CSSScale::setX(const CSSNumberish& x, ExceptionState& exception_state) {
   CSSNumericValue* value = CSSNumericValue::FromNumberish(x);
 
-  if (!isCoordValid(value)) {
+  if (!IsValidCoordinate(value)) {
     exception_state.ThrowTypeError("Must specify a number unit");
     return;
   }
 
   x_ = value;
 }
+
 void CSSScale::setY(const CSSNumberish& y, ExceptionState& exception_state) {
   CSSNumericValue* value = CSSNumericValue::FromNumberish(y);
 
-  if (!isCoordValid(value)) {
+  if (!IsValidCoordinate(value)) {
     exception_state.ThrowTypeError("Must specify a number unit");
     return;
   }
 
   y_ = value;
 }
+
 void CSSScale::setZ(const CSSNumberish& z, ExceptionState& exception_state) {
   CSSNumericValue* value = CSSNumericValue::FromNumberish(z);
 
-  if (!isCoordValid(value)) {
+  if (!IsValidCoordinate(value)) {
     exception_state.ThrowTypeError("Must specify a number unit");
     return;
   }
@@ -131,19 +142,6 @@ void CSSScale::setZ(const CSSNumberish& z, ExceptionState& exception_state) {
   z_ = value;
 }
 
-bool CSSScale::isCoordValid(CSSNumericValue* value) {
-  // TODO: CSSMathValue are not supported yet
-  if (!value->IsUnitValue()) {
-    return false;
-  }
-
-  if (value->GetType() != CSSStyleValue::StyleValueType::kNumberType) {
-    return false;
-  }
-
-  return true;
-}
-
 const DOMMatrix* CSSScale::AsMatrix(ExceptionState& exception_state) const {
   CSSUnitValue* x = x_->to(CSSPrimitiveValue::UnitType::kNumber);
   CSSUnitValue* y = y_->to(CSSPrimitiveValue::UnitType::kNumber);
@@ -151,7 +149,7 @@ const DOMMatrix* CSSScale::AsMatrix(ExceptionState& exception_state) const {
 
   if (!x || !y || !z) {
     exception_state.ThrowTypeError(
-        "Cannot create matrix if valuse are not convert to CSSUnitValue");
+        "Cannot create matrix if values are not numbers");
     return nullptr;
   }
 
@@ -171,4 +169,14 @@ const CSSFunctionValue* CSSScale::ToCSSValue(
   return result;
 }
 
+CSSScale::CSSScale(CSSNumericValue* x,
+                   CSSNumericValue* y,
+                   CSSNumericValue* z,
+                   bool is2D)
+    : CSSTransformComponent(is2D), x_(x), y_(y), z_(z) {
+  DCHECK(IsValidCoordinate(x));
+  DCHECK(IsValidCoordinate(y));
+  DCHECK(IsValidCoordinate(z));
+}
+
 }  // namespace blink

third_party/WebKit/Source/core/css/cssom/CSSScale.h

@@ -33,12 +33,12 @@ class CORE_EXPORT CSSScale final : public CSSTransformComponent {
 
   // Blink-internal ways of creating CSSScales.
   static CSSScale* Create(CSSNumericValue* x, CSSNumericValue* y) {
-    return new CSSScale(x, y);
+    return new CSSScale(x, y, CSSUnitValue::Create(1), true /* is2D */);
   }
   static CSSScale* Create(CSSNumericValue* x,
                           CSSNumericValue* y,
                           CSSNumericValue* z) {
-    return new CSSScale(x, y, z);
+    return new CSSScale(x, y, z, false /* is2D */);
   }
   static CSSScale* FromCSSValue(const CSSFunctionValue&);
 
@@ -63,15 +63,10 @@ class CORE_EXPORT CSSScale final : public CSSTransformComponent {
   }
 
  private:
-  CSSScale(CSSNumericValue* x, CSSNumericValue* y)
-      : CSSTransformComponent(true /* is2D */),
-        x_(x),
-        y_(y),
-        z_(CSSUnitValue::Create(1)) {}
-  CSSScale(CSSNumericValue* x, CSSNumericValue* y, CSSNumericValue* z)
-      : CSSTransformComponent(false /* is2D */), x_(x), y_(y), z_(z) {}
-
-  static bool isCoordValid(CSSNumericValue*);
+  CSSScale(CSSNumericValue* x,
+           CSSNumericValue* y,
+           CSSNumericValue* z,
+           bool is2D);
 
   Member<CSSNumericValue> x_;
   Member<CSSNumericValue> y_;

third_party/WebKit/Source/core/css/cssom/CSSTranslation.cpp

@@ -14,23 +14,21 @@ namespace blink {
 
 namespace {
 
-bool IsLengthOrPercent(const CSSNumericValue* value) {
-  return (value->GetType() == CSSStyleValue::StyleValueType::kLengthType ||
-          value->GetType() == CSSStyleValue::StyleValueType::kPercentType);
+bool IsValidXYCoordinate(const CSSNumericValue* value) {
+  return value && value->Type().MatchesBaseTypePercentage(
+                      CSSNumericValueType::BaseType::kLength);
 }
 
-bool IsLengthValue(const CSSValue& value) {
-  return value.IsPrimitiveValue() && ToCSSPrimitiveValue(value).IsLength();
+bool IsValidZCoordinate(const CSSNumericValue* value) {
+  return value &&
+         value->Type().MatchesBaseType(CSSNumericValueType::BaseType::kLength);
 }
 
 CSSTranslation* FromCSSTranslate(const CSSFunctionValue& value) {
   DCHECK_GT(value.length(), 0UL);
-  DCHECK(IsLengthValue(value.Item(0)));
 
   CSSNumericValue* x =
       CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
-  if (!x)
-    return nullptr;
 
   if (value.length() == 1) {
     return CSSTranslation::Create(
@@ -38,23 +36,18 @@ CSSTranslation* FromCSSTranslate(const CSSFunctionValue& value) {
   }
 
   DCHECK_EQ(value.length(), 2UL);
-  DCHECK(IsLengthValue(value.Item(1)));
 
   CSSNumericValue* y =
       CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(1)));
-  if (!y)
-    return nullptr;
+
   return CSSTranslation::Create(x, y);
 }
 
 CSSTranslation* FromCSSTranslateXYZ(const CSSFunctionValue& value) {
   DCHECK_EQ(value.length(), 1UL);
-  DCHECK(IsLengthValue(value.Item(0)));
 
   CSSNumericValue* length =
       CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
-  if (!length)
-    return nullptr;
 
   switch (value.FunctionType()) {
     case CSSValueTranslateX:
@@ -78,9 +71,6 @@ CSSTranslation* FromCSSTranslateXYZ(const CSSFunctionValue& value) {
 
 CSSTranslation* FromCSSTranslate3D(const CSSFunctionValue& value) {
   DCHECK_EQ(value.length(), 3UL);
-  DCHECK(IsLengthValue(value.Item(0)));
-  DCHECK(IsLengthValue(value.Item(1)));
-  DCHECK(IsLengthValue(value.Item(2)));
 
   CSSNumericValue* x =
       CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(0)));
@@ -88,8 +78,6 @@ CSSTranslation* FromCSSTranslate3D(const CSSFunctionValue& value) {
       CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(1)));
   CSSNumericValue* z =
       CSSNumericValue::FromCSSValue(ToCSSPrimitiveValue(value.Item(2)));
-  if (!x || !y || !z)
-    return nullptr;
 
   return CSSTranslation::Create(x, y, z);
 }
@@ -99,7 +87,7 @@ CSSTranslation* FromCSSTranslate3D(const CSSFunctionValue& value) {
 CSSTranslation* CSSTranslation::Create(CSSNumericValue* x,
                                        CSSNumericValue* y,
                                        ExceptionState& exception_state) {
-  if (!IsLengthOrPercent(x) || !IsLengthOrPercent(y)) {
+  if (!IsValidXYCoordinate(x) || !IsValidXYCoordinate(y)) {
     exception_state.ThrowTypeError(
         "Must pass length or percentage to X and Y of CSSTranslation");
     return nullptr;
@@ -113,26 +101,16 @@ CSSTranslation* CSSTranslation::Create(CSSNumericValue* x,
                                        CSSNumericValue* y,
                                        CSSNumericValue* z,
                                        ExceptionState& exception_state) {
-  if (!IsLengthOrPercent(x) || !IsLengthOrPercent(y)) {
+  if (!IsValidXYCoordinate(x) || !IsValidXYCoordinate(y) ||
+      !IsValidZCoordinate(z)) {
     exception_state.ThrowTypeError(
-        "Must pass length or percentage to X and Y of CSSTranslation");
-    return nullptr;
-  }
-  if (z && z->GetType() != CSSStyleValue::StyleValueType::kLengthType) {
-    exception_state.ThrowTypeError("Must pass length to Z of CSSTranslation");
-    return nullptr;
-  }
-  if (z && z->ContainsPercent()) {
-    exception_state.ThrowTypeError(
-        "CSSTranslation does not support z CSSNumericValue with percent units");
+        "Must pass length or percentage to X, Y and Z of CSSTranslation");
     return nullptr;
   }
   return new CSSTranslation(x, y, z, false /* is2D */);
 }
 
 CSSTranslation* CSSTranslation::Create(CSSNumericValue* x, CSSNumericValue* y) {
-  DCHECK(IsLengthOrPercent(x));
-  DCHECK(IsLengthOrPercent(y));
   return new CSSTranslation(
       x, y, CSSUnitValue::Create(0, CSSPrimitiveValue::UnitType::kPixels),
       true /* is2D */);
@@ -141,10 +119,6 @@ CSSTranslation* CSSTranslation::Create(CSSNumericValue* x, CSSNumericValue* y) {
 CSSTranslation* CSSTranslation::Create(CSSNumericValue* x,
                                        CSSNumericValue* y,
                                        CSSNumericValue* z) {
-  DCHECK(IsLengthOrPercent(x));
-  DCHECK(IsLengthOrPercent(y));
-  DCHECK_EQ(z->GetType(), CSSStyleValue::StyleValueType::kLengthType);
-  DCHECK(!z->ContainsPercent());
   return new CSSTranslation(x, y, z, false /* is2D */);
 }
 
@@ -165,8 +139,7 @@ CSSTranslation* CSSTranslation::FromCSSValue(const CSSFunctionValue& value) {
 }
 
 void CSSTranslation::setX(CSSNumericValue* x, ExceptionState& exception_state) {
-  if (x->GetType() != CSSStyleValue::StyleValueType::kLengthType &&
-      x->GetType() != CSSStyleValue::StyleValueType::kPercentType) {
+  if (!IsValidXYCoordinate(x)) {
     exception_state.ThrowTypeError(
         "Must pass length or percentage to X of CSSTranslation");
     return;
@@ -175,8 +148,7 @@ void CSSTranslation::setX(CSSNumericValue* x, ExceptionState& exception_state) {
 }
 
 void CSSTranslation::setY(CSSNumericValue* y, ExceptionState& exception_state) {
-  if (y->GetType() != CSSStyleValue::StyleValueType::kLengthType &&
-      y->GetType() != CSSStyleValue::StyleValueType::kPercentType) {
+  if (!IsValidXYCoordinate(y)) {
     exception_state.ThrowTypeError(
         "Must pass length or percent to Y of CSSTranslation");
     return;
@@ -185,15 +157,10 @@ void CSSTranslation::setY(CSSNumericValue* y, ExceptionState& exception_state) {
 }
 
 void CSSTranslation::setZ(CSSNumericValue* z, ExceptionState& exception_state) {
-  if (z->GetType() != CSSStyleValue::StyleValueType::kLengthType) {
+  if (!IsValidZCoordinate(z)) {
     exception_state.ThrowTypeError("Must pass length to Z of CSSTranslation");
     return;
   }
-  if (z->ContainsPercent()) {
-    exception_state.ThrowTypeError(
-        "CSSTranslation does not support z CSSNumericValue with percent units");
-    return;
-  }
   z_ = z;
 }
 
@@ -224,4 +191,14 @@ const CSSFunctionValue* CSSTranslation::ToCSSValue(
   return result;
 }
 
+CSSTranslation::CSSTranslation(CSSNumericValue* x,
+                               CSSNumericValue* y,
+                               CSSNumericValue* z,
+                               bool is2D)
+    : CSSTransformComponent(is2D), x_(x), y_(y), z_(z) {
+  DCHECK(IsValidXYCoordinate(x));
+  DCHECK(IsValidXYCoordinate(y));
+  DCHECK(IsValidZCoordinate(z));
+}
+
 }  // namespace blink

third_party/WebKit/Source/core/css/cssom/CSSTranslation.h

@@ -64,8 +64,7 @@ class CORE_EXPORT CSSTranslation final : public CSSTransformComponent {
   CSSTranslation(CSSNumericValue* x,
                  CSSNumericValue* y,
                  CSSNumericValue* z,
-                 bool is2D)
-      : CSSTransformComponent(is2D), x_(x), y_(y), z_(z) {}
+                 bool is2D);
 
   Member<CSSNumericValue> x_;
   Member<CSSNumericValue> y_;