Index: third_party/WebKit/LayoutTests/typedcssom/inlinestyle/transform-rotation.html |
diff --git a/third_party/WebKit/LayoutTests/typedcssom/inlinestyle/transform-rotation.html b/third_party/WebKit/LayoutTests/typedcssom/inlinestyle/transform-rotation.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..aec3a178784c3e32707e2f04652637b15e5fcef5 |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/typedcssom/inlinestyle/transform-rotation.html |
@@ -0,0 +1,119 @@ |
+<script src="../../resources/testharness.js"></script> |
+<script src="../../resources/testharnessreport.js"></script> |
+ |
+<div id="testElement"></div> |
+ |
+<script> |
+ |
+var EPSILON = 1e-6; // float epsilon |
+ |
+function validateTransformWithSingleRotation(transform, x, y, z, angle, cssString) { |
+ assert_equals(transform.cssString, cssString); |
+ |
+ // Shouldn't be base StyleValue as for unsupported values. |
+ assert_true(transform instanceof TransformValue); |
+ |
+ var components = [...transform.values()]; |
+ assert_equals(components.length, 1); |
+ assert_true(components[0] instanceof CSSRotation); |
+ assert_equals(components[0].cssString, cssString); |
+ |
+ assert_approx_equals(components[0].angle, angle, EPSILON); |
+ 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 = "rotate(30deg)"; |
+ |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 0, 0, 1, 30, |
+ "rotate(30deg)"); |
+}, "Simple rotation read from a StyleMap is correct"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotate(10rad)"; |
+ |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 0, 0, 1, 572.957795, |
+ "rotate(572.958deg)"); |
+}, "Simple rotation using radians read from a StyleMap is correct"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotate(20grad)"; |
+ |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 0, 0, 1, 18, |
+ "rotate(18deg)"); |
+}, "Simple rotation using gradians read from a StyleMap is correct"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotate(0.5turn)"; |
+ |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 0, 0, 1, 180, |
+ "rotate(180deg)"); |
+}, "Simple rotation using turns read from a StyleMap is correct"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotate3d(1, 2, 3, 30deg)"; |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 1, 2, 3, 30, |
+ "rotate3d(1, 2, 3, 30deg)"); |
+}, "rotate3d read from a StyleMap is correct"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotateX(45deg)"; |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 1, 0, 0, 45, |
+ "rotate3d(1, 0, 0, 45deg)"); |
+}, "rotateX read from a StyleMap results in a rotate3d"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotateX(1rad)"; |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 1, 0, 0, 57.29578, |
+ "rotate3d(1, 0, 0, 57.2958deg)"); |
+}, "rotateX with units other than degrees"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotateY(80deg)"; |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 0, 1, 0, 80, |
+ "rotate3d(0, 1, 0, 80deg)"); |
+}, "rotateY read from a StyleMap results in a rotate3d"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotateY(2grad)"; |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 0, 1, 0, 1.8, |
+ "rotate3d(0, 1, 0, 1.8deg)"); |
+}, "rotateY with units other than degrees"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotateZ(100deg)"; |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 0, 0, 1, 100, |
+ "rotate3d(0, 0, 1, 100deg)"); |
+}, "rotateZ read from a StyleMap results in a rotate3d"); |
+ |
+test(function() { |
+ testElement.style.transform = "rotateZ(1turn)"; |
+ validateTransformWithSingleRotation( |
+ testElement.styleMap.get("transform"), |
+ 0, 0, 1, 360, |
+ "rotate3d(0, 0, 1, 360deg)"); |
+}, "rotateZ with units other than degrees"); |
+ |
+</script> |