зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1359522 - added test_dom_matrix_2d.html; r=gregtatum
MozReview-Commit-ID: 9HHOdFg78He
This commit is contained in:
Родитель
5b891c93dd
Коммит
cb85a61c17
|
@ -5,5 +5,6 @@ skip-if = os == 'android'
|
||||||
[test_css-logic-getCssPath.html]
|
[test_css-logic-getCssPath.html]
|
||||||
[test_css-logic.html]
|
[test_css-logic.html]
|
||||||
[test_devtools_extensions.html]
|
[test_devtools_extensions.html]
|
||||||
|
[test_dom_matrix_2d.html]
|
||||||
[test_eventemitter_basic.html]
|
[test_eventemitter_basic.html]
|
||||||
skip-if = os == 'linux' && debug # Bug 1205739
|
skip-if = os == 'linux' && debug # Bug 1205739
|
||||||
|
|
|
@ -0,0 +1,88 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<!--
|
||||||
|
Any copyright is dedicated to the Public Domain.
|
||||||
|
http://creativecommons.org/publicdomain/zero/1.0/
|
||||||
|
-->
|
||||||
|
|
||||||
|
<html>
|
||||||
|
<!--
|
||||||
|
https://bugzilla.mozilla.org/show_bug.cgi?id=1297072
|
||||||
|
-->
|
||||||
|
<head>
|
||||||
|
<meta charset="utf8">
|
||||||
|
<title>Testing 2d matrix utility functions for DOM</title>
|
||||||
|
|
||||||
|
<script type="application/javascript"
|
||||||
|
src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
|
||||||
|
<link rel="stylesheet" type="text/css"
|
||||||
|
href="chrome://mochikit/content/tests/SimpleTest/test.css">
|
||||||
|
<style>
|
||||||
|
#element {
|
||||||
|
position: absolute;
|
||||||
|
top: 20px;
|
||||||
|
left: 10px;
|
||||||
|
width: 320px;
|
||||||
|
height: 200px;
|
||||||
|
background: salmon;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="element"></div>
|
||||||
|
|
||||||
|
<script type="application/javascript">
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
const { utils: Cu } = Components;
|
||||||
|
const { require } = Cu.import("resource://devtools/shared/Loader.jsm", {});
|
||||||
|
const {
|
||||||
|
getNodeTransformationMatrix,
|
||||||
|
getNodeTransformOrigin
|
||||||
|
} = require("devtools/shared/layout/dom-matrix-2d");
|
||||||
|
|
||||||
|
let element = document.getElementById("element");
|
||||||
|
|
||||||
|
testNodeTransformOrigin(element);
|
||||||
|
testNodeTransformationMatrix(element);
|
||||||
|
|
||||||
|
function testNodeTransformOrigin(node) {
|
||||||
|
isDeeply(getNodeTransformOrigin(node), [160, 100],
|
||||||
|
"Default Transform Origin is correct.");
|
||||||
|
|
||||||
|
node.style.transformOrigin = "left 10%";
|
||||||
|
isDeeply(getNodeTransformOrigin(node), [0, 20],
|
||||||
|
"Transform Origin is properly computed.");
|
||||||
|
|
||||||
|
node.style.transformOrigin = "invalid";
|
||||||
|
isDeeply(getNodeTransformOrigin(node), [0, 20],
|
||||||
|
"Invalid values are ignored.");
|
||||||
|
|
||||||
|
node.style.transformOrigin = "left 5px -3px";
|
||||||
|
isDeeply(getNodeTransformOrigin(node), [0, 5, -3],
|
||||||
|
"3D coordinates and negative numbers are properly computed.");
|
||||||
|
}
|
||||||
|
|
||||||
|
function testNodeTransformationMatrix(node) {
|
||||||
|
is(getNodeTransformationMatrix(node), null,
|
||||||
|
"Default Transformation Matrix is `null`");
|
||||||
|
|
||||||
|
node.style.transform = "translate(10%, 20px)";
|
||||||
|
isDeeply(getNodeTransformationMatrix(node), [ 1, 0, 32, 0, 1, 20, 0, 0, 1 ],
|
||||||
|
"Transformation Matrix properly computed with translation.");
|
||||||
|
|
||||||
|
node.style.transform = "translate(10%, 20px) scale(2)";
|
||||||
|
isDeeply(getNodeTransformationMatrix(node), [ 2, 0, 32, 0, 2, 20, 0, 0, 1 ],
|
||||||
|
"Transformation Matrix properly translated and scaled.");
|
||||||
|
|
||||||
|
node.style.transform = "scale(2) translate(10%, 20px)";
|
||||||
|
isDeeply(getNodeTransformationMatrix(node), [ 2, 0, 64, 0, 2, 40, 0, 0, 1 ],
|
||||||
|
"Transformation Matrix properly scaled and translated.");
|
||||||
|
|
||||||
|
node.style.transform = "translate3d(12px, 50%, 3em)";
|
||||||
|
isDeeply(getNodeTransformationMatrix(node), [ 1, 0, 12, 0, 1, 100, 0, 0, 1 ],
|
||||||
|
"3D Transformation Matrix are handled for 2D values.");
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
Загрузка…
Ссылка в новой задаче