| <!DOCTYPE html> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <div id="testElement"></div> |
| <script> |
| var EPSILON = 1e-6; // float epsilon |
| |
| function validateTransformWithSingleScale(transform, x, y, z, cssText) { |
| assert_equals(transform.toString(), cssText); |
| |
| // Shouldn't be base StyleValue as for unsupported values. |
| assert_equals(transform.constructor.name, CSSTransformValue.name); |
| |
| var components = [...transform.values()]; |
| assert_equals(components.length, 1); |
| assert_equals(components[0].constructor.name, CSSScale.name); |
| assert_equals(components[0].toString(), cssText); |
| |
| assert_approx_equals(components[0].x, x, EPSILON); |
| assert_approx_equals(components[0].y, y, EPSILON); |
| assert_approx_equals(components[0].z, z, EPSILON); |
| } |
| |
| test(function() { |
| testElement.style.transform = "scale(5)"; |
| |
| validateTransformWithSingleScale( |
| testElement.styleMap.get("transform"), |
| 5, 1, 1, |
| "scale(5, 1)"); |
| }, "Single argument rotation read from a StyleMap is correct"); |
| |
| test(function() { |
| testElement.style.transform = "scale(5, 4)"; |
| |
| validateTransformWithSingleScale( |
| testElement.styleMap.get("transform"), |
| 5, 4, 1, |
| "scale(5, 4)"); |
| }, "Two-argument rotation read from a StyleMap is correct"); |
| |
| test(function() { |
| testElement.style.transform = "scale3d(1, 2, 3)"; |
| validateTransformWithSingleScale( |
| testElement.styleMap.get("transform"), |
| 1, 2, 3, |
| "scale3d(1, 2, 3)"); |
| }, "scale3d read from a StyleMap is correct"); |
| |
| test(function() { |
| testElement.style.transform = "scaleX(4.5)"; |
| validateTransformWithSingleScale( |
| testElement.styleMap.get("transform"), |
| 4.5, 1, 1, |
| "scale(4.5, 1)"); |
| }, "scaleX read from a StyleMap works"); |
| |
| test(function() { |
| testElement.style.transform = "scaleY(8.1)"; |
| validateTransformWithSingleScale( |
| testElement.styleMap.get("transform"), |
| 1, 8.1, 1, |
| "scale(1, 8.1)"); |
| }, "scaleY read from a StyleMap works"); |
| |
| test(function() { |
| testElement.style.transform = "scaleZ(1.6)"; |
| validateTransformWithSingleScale( |
| testElement.styleMap.get("transform"), |
| 1, 1, 1.6, |
| "scale3d(1, 1, 1.6)"); |
| }, "scaleZ read from a StyleMap results in a scale3d"); |
| |
| test(function() { |
| testElement.styleMap.set( |
| 'transform', |
| new CSSTransformValue([new CSSScale(1.2, 3.4)])); |
| assert_equals(testElement.style.transform, 'scale(1.2, 3.4)'); |
| }, "Set a 2-argument CSSScale into a styleMap"); |
| |
| test(function() { |
| testElement.styleMap.set( |
| 'transform', |
| new CSSTransformValue([new CSSScale(1.2, 3.4, 5.6)])); |
| assert_equals(testElement.style.transform, 'scale3d(1.2, 3.4, 5.6)'); |
| }, "Set a 3-argument CSSScale into a styleMap"); |
| |
| </script> |
| |