blob: 9eb57205b56b483e46c8f84a8680dc836e2c14c0 [file] [log] [blame]
<!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>