| Index: pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-transform-primitives.html
|
| diff --git a/pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-transform-primitives.html b/pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-transform-primitives.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..6b56491e0b67ffb863544e4b51e86c1c24c5c5c3
|
| --- /dev/null
|
| +++ b/pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-transform-primitives.html
|
| @@ -0,0 +1,97 @@
|
| +<!--
|
| +Copyright 2012 Google Inc. All Rights Reserved.
|
| +
|
| +Licensed under the Apache License, Version 2.0 (the "License");
|
| +you may not use this file except in compliance with the License.
|
| +You may obtain a copy of the License at
|
| +
|
| + http://www.apache.org/licenses/LICENSE-2.0
|
| +
|
| +Unless required by applicable law or agreed to in writing, software
|
| +distributed under the License is distributed on an "AS IS" BASIS,
|
| +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
| +See the License for the specific language governing permissions and
|
| +limitations under the License.
|
| +-->
|
| +
|
| +<!DOCTYPE html><meta charset="UTF-8">
|
| +<style>
|
| +.anim {
|
| + left: 0px;
|
| + width: 30px;
|
| + height: 30px;
|
| + background-color: lightsteelblue;
|
| + position: absolute;
|
| +}
|
| +
|
| +.expected {
|
| + width: 30px;
|
| + height: 30px;
|
| + position: absolute;
|
| + background-color: red;
|
| +}
|
| +</style>
|
| +<div></div>
|
| +<div style="height: 600px;"></div>
|
| +<script src="../bootstrap.js"></script>
|
| +<script>
|
| +"use strict";
|
| +
|
| +var transformValues = [
|
| + ['translate(0px)', 'translate(30px)', 'translate(20px, 40px)',
|
| + 'translateX(20px)', 'translateY(20px)'],
|
| + ['scale(1, 1)', 'scale(1.5, 3)', 'scale(2)', 'scaleX(2)', 'scaleY(2)'],
|
| + ['rotate(0deg)', 'rotate(50deg)'],
|
| + ['skew(0deg)', 'skew(20deg)', 'skew(40deg, 20deg)'],
|
| + ['skewX(0deg)', 'skewX(40deg)'],
|
| + ['skewY(0deg)', 'skewY(40deg)'],
|
| + ['matrix(1, 0, 0, 1, 0, 0)', 'matrix(-1, 1, -1, -1, 10, 10)'],
|
| +];
|
| +
|
| +var separation_x = 100;
|
| +var separation_y = 50;
|
| +var max_x = 1000;
|
| +
|
| +var toplevel = document.querySelector("div");
|
| +var y = 50;
|
| +
|
| +var animations = [];
|
| +
|
| +for (var i = 0; i < transformValues.length; i++) {
|
| + var x = 10;
|
| + for (var j = 0; j < transformValues[i].length; j++) {
|
| + for (var k = 0; k < transformValues[i].length; k++) {
|
| + if (j == k) {
|
| + continue;
|
| + }
|
| + toplevel.appendChild(document.createElement("div"));
|
| + var div = toplevel.lastChild;
|
| + div.className = "expected";
|
| + div.style.top = y + 'px';
|
| + div.style.left = x + 'px';
|
| + div.style[test_features.transformProperty] = transformValues[i][k];
|
| + toplevel.appendChild(document.createElement("div"));
|
| + var div = toplevel.lastChild;
|
| + div.className = "anim";
|
| + div.style.top = y + 'px';
|
| + div.style.left = x + 'px';
|
| + div.id = "i" + i + "_" + j + "_" + k
|
| + animations.push(new Animation(div, [
|
| + {transform: transformValues[i][j]},
|
| + {transform: transformValues[i][k]},
|
| + ], {duration: 2, fill: 'forwards'}));
|
| + x += separation_x;
|
| + if (x > max_x) {
|
| + x = 20;
|
| + y += separation_y;
|
| + }
|
| + }
|
| + }
|
| + y += separation_y;
|
| +}
|
| +
|
| +</script>
|
| +<script>
|
| +"use strict";
|
| +animations.forEach(function(anim) { document.timeline.play(anim); });
|
| +</script>
|
|
|