blob: 72b2caf525f42871d55d0d2a68a33625ace9e23f [file] [log] [blame]
<!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>