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

<script>
test(function() {
  assert_throws(null, function() { new CSSCalcLength(); });
  assert_throws(null, function() { new CSSCalcLength({}); });
  assert_throws(null, function() { new CSSCalcLength({foo: 1}); });
}, 'Test that passing invalid arguments to CSSCalcLength throws an exception.');

test(function() {
  var calcLength1 = new CSSCalcLength({px: 1, percent: 2.2});
  var calcLength2 = new CSSCalcLength({px: 3, percent: 4.3});

  var result = calcLength1.add(calcLength2);

  assert_not_equals(calcLength1, result);
  assert_not_equals(calcLength2, result);
  assert_true(result instanceof CSSCalcLength);
  assert_equals(result.px, 4);
  assert_equals(result.percent, 6.5);
}, 'Test that adding two CSSCalcLengths produces a new CSSCalcLength with the correct value.');

test(function() {
  var calcLength1 = new CSSCalcLength({px: 1, percent: 2.2});
  var calcLength2 = new CSSCalcLength({px: 3, percent: 4.3});

  var result = calcLength1.subtract(calcLength2);

  assert_not_equals(calcLength1, result);
  assert_not_equals(calcLength2, result);
  assert_true(result instanceof CSSCalcLength);
  assert_equals(result.px, -2);
  assert_approx_equals(result.percent, -2.1, 0.000001);
}, 'Test that subtracting two CSSCalcLengths produces a new CSSCalcLength with the correct values.');

test(function() {
  var calcLength = new CSSCalcLength({px: 1, percent: 5.2});
  var result = calcLength.multiply(3);

  assert_not_equals(calcLength, result);
  assert_equals(result.px, 3);
  assert_approx_equals(result.percent, 15.6, 0.000001);
}, 'Test that multiplying a CSSCalcLength produces a new CSSCalcLength with the correct values.');

test(function() {
  var calcLength = new CSSCalcLength({px: 3, percent: 15.6});
  var result = calcLength.divide(3);

  assert_not_equals(calcLength, result);
  assert_equals(result.px, 1);
  assert_equals(result.percent, 5.2);
}, 'Test that dividing a CSSCalcLength produces a new CSSCalcLength with the correct values.');

test(function() {
  var values = [
    {input: new CSSCalcLength({px: 1}), cssText: 'calc(1px)'},
    {input: new CSSCalcLength({px: -1}), cssText: 'calc(-1px)'},
    {input: new CSSCalcLength({px: 1, percent: 15.6}), cssText: 'calc(15.6% + 1px)'},
    {input: new CSSCalcLength({px: 1, percent: -15.6}), cssText: 'calc(-15.6% + 1px)'},
    {input: new CSSCalcLength({px: -1, percent: -15.6}), cssText: 'calc(-15.6% - 1px)'},
    {input: new CSSCalcLength({px: -1, percent: -15.6, vw: 5}), cssText: 'calc((-15.6% - 1px) + 5vw)'},
    {input: new CSSCalcLength({px: -1, percent: -15.6, vw: -5}), cssText: 'calc((-15.6% - 1px) - 5vw)'},
  ];

  for (var i = 0; i < values.length; ++i) {
    assert_equals(values[i].input.cssText, values[i].cssText);
  }

}, 'Test that the CSS string method for a CSSCalcLength produces the correct result');

</script>

<body>
</body>