<!DOCTYPE html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<script src="resources/comparisons.js"></script>

<script>
var EPSILON = 1e-6; // float epsilon

test(function() {
  var transformArray = [
    new CSSScale(2, 2),
    new CSSMatrixComponent(new DOMMatrixReadOnly([1, 1, 1, 1, 1, 1])),
    new CSSScale(5, 6)
  ];
  var transformValue = new CSSTransformValue(transformArray);
  assert_true(transformValue.is2D);
}, "is2D is true for transformValues containing only 2D components");

test(function() {
  var transformArray = [
    new CSSScale(2, 2),
    new CSSMatrixComponent(new DOMMatrixReadOnly(
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1])),
    new CSSScale(5, 6)
  ];
  var transformValue = new CSSTransformValue(transformArray);
  assert_false(transformValue.is2D);
}, "is2D is false for transformValues containing both 2D and 3D components");

test(function() {
  var transformArray = [
    new CSSScale(2, 2),
    new CSSMatrixComponent(new DOMMatrixReadOnly([1, 1, 1, 1, 1, 1])),
    new CSSScale(5, 6)
  ];
  var transformValue = new CSSTransformValue(transformArray);

  var newTransformArray = [...transformValue];
  assert_true(newTransformArray.length == 3);
  assert_equals(newTransformArray[0].constructor.name, CSSScale.name);
  assert_equals(newTransformArray[1].constructor.name, CSSMatrixComponent.name);
  assert_equals(newTransformArray[2].constructor.name, CSSScale.name);
}, "Can iterate through transformComponent members");

test(function() {
  var transformArray = [new CSSScale(2,2)];
  var transformValue = new CSSTransformValue(transformArray);

  var expectedMatrix = new DOMMatrix();
  expectedMatrix.scaleSelf(2, 2);

  assert_matrix_approx_equals(
      transformValue.toMatrix(), expectedMatrix, EPSILON);
}, "toMatrix() returns DOMMatrix Object - single CSSTransformComponent");

test(function() {
  var transformMatrix = new DOMMatrixReadOnly([1,1,1,1,1,1]);
  var transformArray = [
    new CSSScale(2,2),
    new CSSMatrixComponent(transformMatrix),
    new CSSScale(5,6)
  ];
  var transformValue = new CSSTransformValue(transformArray);

  var expectedMatrix = new DOMMatrix();
  expectedMatrix.scaleSelf(2, 2);
  expectedMatrix.multiplySelf(transformMatrix);
  expectedMatrix.scaleSelf(5, 6);

  assert_matrix_approx_equals(
      transformValue.toMatrix(), expectedMatrix, EPSILON);
},  "toMatrix() returns DOMMatrix Object - multiple CSSTransformComponents");

</script>