<meta charset="utf-8">
<title>CSSNumericValue.toSum tests</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-cssnumericvalue-tosum">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<script>
'use strict';

test(() => {
  assert_throws_dom("SyntaxError", () => CSS.px(1).toSum('px', 'lemon'));
}, 'Converting a CSSNumericValue to a sum with invalid units throws SyntaxError');

test(() => {
  assert_throws_js(TypeError, () => new CSSMathMax(1, CSS.px(1)).toSum('number'));
}, 'Converting a CSSNumericValue with an invalid sum value to a sum throws TypeError');

test(() => {
  assert_throws_js(TypeError, () => new CSSMathProduct(CSS.px(1), CSS.px(1)).to('px'));
}, 'Converting a CSSNumericValue with compound units to a sum throws TypeError');

test(() => {
  assert_throws_js(TypeError, () => CSS.px(1).toSum('number'));
}, 'Converting a CSSNumericValue to a sum with an incompatible unit throws TypeError');

test(() => {
  assert_throws_js(TypeError, () => CSS.px(1).toSum('px', 's'));
}, 'Converting a CSSNumericValue to a sum with units that are not addable throws TypeError');

test(() => {
  assert_throws_js(TypeError, () => new CSSMathSum(CSS.px(1), CSS.em(1)).toSum('px'));
}, 'Converting a CSSNumericValue with leftover units to a sum throws TypeError');

test(() => {
  assert_style_value_equals(CSS.number(1).toSum('number'), new CSSMathSum(CSS.number(1)));
  assert_style_value_equals(CSS.px(1).toSum('px'), new CSSMathSum(CSS.px(1)));
}, 'Converting CSSNumericValue to a sum with its own unit returns itself');

test(() => {
  assert_style_value_equals(
    new CSSMathSum(CSS.px(1), CSS.em(1), CSS.vw(1), CSS.rem(1)).toSum(),
    new CSSMathSum(CSS.em(1), CSS.px(1), CSS.rem(1), CSS.vw(1))
  );
}, 'Converting CSSNumericValue to a sum with no arguments returns all the units in sorted order');

// TODO(776173): cssUnitValue_toMethod.html has more comprehensive tests of converting
// within the same base type. Merge those tests into here.
test(() => {
  assert_style_value_equals(CSS.cm(2).toSum('mm'), new CSSMathSum(CSS.mm(20)));
}, 'Converting CSSNumericValue to a sum with a relative unit converts correctly');

test(() => {
  assert_style_value_equals(
    CSS.px(1).toSum('em', 'px', 'vw'),
    new CSSMathSum(CSS.em(0), CSS.px(1), CSS.vw(0))
  );
}, 'Converting CSSNumericValue to a sum containing extra units returns zero for those units');

test(() => {
  assert_style_value_equals(
    new CSSMathSum(CSS.cm(1), CSS.mm(10)).toSum('cm', 'mm'),
    new CSSMathSum(CSS.cm(2), CSS.mm(0))
  );

  assert_style_value_equals(
    new CSSMathSum(CSS.cm(1), CSS.mm(10)).toSum('mm', 'cm'),
    new CSSMathSum(CSS.mm(20), CSS.cm(0))
  );
}, 'CSSNumericValue.toSum converts greedily');

</script>