| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <script src="resources/comparisons.js"></script> |
| |
| <script> |
| let EPSILON = 1e-6; |
| |
| var testParams = [ |
| // 2D translations |
| { |
| input: new CSSTranslation(CSS.px(0), CSS.px(0)), |
| x: CSS.px(0), y: CSS.px(0), |
| is2D: true, |
| cssText: "translate(0px, 0px)" |
| }, |
| { |
| input: new CSSTranslation(CSS.px(1.1), CSS.em(-2.2)), |
| x: CSS.px(1.1), y: CSS.em(-2.2), |
| is2D: true, |
| cssText: "translate(1.1px, -2.2em)" |
| }, |
| { |
| input: new CSSTranslation(CSS.percent(10), CSS.px(0)), |
| x: CSS.percent(10), y: CSS.px(0), |
| is2D: true, |
| cssText: "translate(10%, 0px)" |
| }, |
| // 3D translations |
| { |
| input: new CSSTranslation(CSS.px(0), CSS.px(0), CSS.px(0)), |
| x: CSS.px(0), y: CSS.px(0), z: CSS.px(0), |
| is2D: false, |
| cssText: "translate3d(0px, 0px, 0px)" |
| }, |
| { |
| input: new CSSTranslation(CSS.px(0), CSS.px(1.1), CSS.em(-2.2)), |
| x: CSS.px(0), y: CSS.px(1.1), z: CSS.em(-2.2), |
| is2D: false, |
| cssText: "translate3d(0px, 1.1px, -2.2em)" |
| }, |
| { |
| input: new CSSTranslation(CSS.percent(10), CSS.px(1.1), CSS.px(0)), |
| x: CSS.percent(10), y: CSS.px(1.1), z: CSS.px(0), |
| is2D: false, |
| cssText: "translate3d(10%, 1.1px, 0px)" |
| }, |
| ]; |
| |
| for (let params of testParams) { |
| test(() => { |
| assert_equals(params.input.toString(), params.cssText); |
| }, "toString value is correct for " + params.cssText); |
| } |
| |
| test(() => { |
| assert_throws(new TypeError(), () => { |
| new CSSTranslation(CSS.px(0), CSS.px(0), CSS.percent(10)); |
| }); |
| assert_throws(new TypeError(), () => { |
| new CSSTranslation(CSS.percent(10), CSS.percent(10), CSS.percent(10)); |
| }); |
| }, "Constructor throws when z argument contains percent."); |
| |
| test(() => { |
| assert_throws(new TypeError(), () => { new CSSTranslation(); }); |
| assert_throws(new TypeError(), () => { new CSSTranslation(CSS.px(0)); }); |
| }, "Invalid number of arguments to constructor throws an exception."); |
| |
| test(() => { |
| let transformValue = new CSSTransformValue( |
| [new CSSTranslation(CSS.em(1), CSS.px(2), CSS.px(3))]); |
| assert_throws(new TypeError(), () => { |
| transformValue.toMatrix(); |
| }); |
| }, "toMatrix throws TypeError when relative lengths are used"); |
| |
| </script> |