| <!doctype html> |
| <meta charset="utf-8"> |
| <title>Multiplying Two Numeric Types</title> |
| <link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#cssnumericvalue-multiply-two-types"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="resources/testhelper.js"></script> |
| <body> |
| <div id="log"> |
| <script> |
| 'use strict'; |
| |
| test(() => { |
| const a = new CSSMathSum(new CSSUnitValue(0, 'px'), new CSSUnitValue(0, 'percent')); |
| const b = new CSSMathSum(new CSSUnitValue(0, 's'), new CSSUnitValue(0, 'percent')); |
| assert_throws_js(TypeError, () => new CSSMathProduct(a, b)); |
| }, 'Multiplying two types with different non-null percent hints throws TypeError'); |
| |
| test(() => { |
| const a = new CSSUnitValue(0, 'px'); |
| const b = new CSSUnitValue(0, 'px'); |
| const result = new CSSMathProduct(a, b); |
| assert_numeric_type_equals(result.type(), { length: 2 }); |
| }, 'Multiplying two types with same base types adds exponents'); |
| |
| test(() => { |
| const a = new CSSUnitValue(0, 'px'); |
| const b = new CSSUnitValue(0, 's'); |
| const result = new CSSMathProduct(a, b); |
| assert_numeric_type_equals(result.type(), { length: 1, time: 1 }); |
| }, 'Multiplying two types with different base types adds exponents'); |
| |
| test(() => { |
| const a = new CSSUnitValue(0, 'px'); |
| const b = new CSSMathInvert(new CSSUnitValue(0, 's')); |
| const result = new CSSMathProduct(a, b); |
| assert_numeric_type_equals(result.type(), { length: 1, time: -1 }); |
| }, 'Multiplying two types respects the sign of the exponents'); |
| |
| test(() => { |
| const a = new CSSUnitValue(0, 'px'); |
| const b = new CSSUnitValue(0, 'number'); |
| const result = new CSSMathProduct(a, b); |
| assert_numeric_type_equals(result.type(), { length: 1 }); |
| }, 'Multiplying a type with no exponents is a no-op'); |
| |
| test(() => { |
| const a = new CSSMathSum(new CSSUnitValue(0, 'px'), new CSSUnitValue(0, 'percent')); |
| const b = new CSSUnitValue(0, 'px'); |
| const result = new CSSMathProduct(a, b); |
| assert_numeric_type_equals(result.type(), { length: 2, percentHint: 'length' }); |
| }, 'Multiplying a type with percent hint applies the percent hint'); |
| |
| test(() => { |
| const a = new CSSMathSum(new CSSUnitValue(0, 'px'), new CSSUnitValue(0, 'percent')); |
| const b = new CSSMathSum(new CSSUnitValue(0, 'px'), new CSSUnitValue(0, 'percent')); |
| const result = new CSSMathProduct(a, b); |
| assert_numeric_type_equals(result.type(), { length: 2, percentHint: 'length' }); |
| }, 'Multiplying two types with same percent hint applies the percent hint'); |
| |
| </script> |