| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| |
| <script> |
| |
| test(() => { |
| let position = new CSSPositionValue(CSS.percent(1), CSS.percent(2)); |
| assert_equals(position.x.value, 1); |
| assert_equals(position.y.value, 2); |
| assert_equals(position.x.unit, 'percent'); |
| assert_equals(position.y.unit, 'percent'); |
| }, "Constructor accepts percentages"); |
| |
| test(() => { |
| assert_throws(new TypeError(), () => { |
| new CSSPositionValue(CSS.deg(1), CSS.px(1)); |
| }); |
| assert_throws(new TypeError(), () => { |
| new CSSPositionValue(CSS.px(1), CSS.deg(1)); |
| }); |
| }, "Constructor throws if a CSSNumericValue that is not a length or " + |
| "percentage is given"); |
| |
| for (let xy of ["x", "y"]) { |
| test(() => { |
| let position = new CSSPositionValue(CSS.px(1), CSS.px(2)); |
| position[xy] = CSS.em(3); |
| assert_equals(position[xy].value, 3); |
| assert_equals(position[xy].unit, 'em'); |
| }, xy + " can be set to a length"); |
| |
| test(() => { |
| let position = new CSSPositionValue(CSS.px(1), CSS.px(2)); |
| position[xy] = CSS.percent(3); |
| assert_equals(position[xy].value, 3); |
| assert_equals(position[xy].unit, 'percent'); |
| }, xy + " can be set to a percentage"); |
| |
| test(() => { |
| let position = new CSSPositionValue(CSS.px(1), CSS.px(2)); |
| assert_throws(new TypeError(), () => { |
| position[xy] = CSS.deg(3); |
| }); |
| }, "Setting " + xy + " to something not a length or percentage throws"); |
| } |
| |
| test(() => { |
| assert_equals( |
| new CSSPositionValue(CSS.px(50), CSS.em(2)).toString(), '50px 2em'); |
| }, "toString returns the x and y cssText separated by a space"); |
| |
| </script> |