Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(283)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-path.html

Issue 175443005: [polymer] import all elements (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: updated from bower Created 6 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-partial-keyframes-checks.js ('k') | pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-path-checks.js » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-path.html
diff --git a/pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-path.html b/pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-path.html
new file mode 100644
index 0000000000000000000000000000000000000000..7ab92118677669aa1d640ee8610c45cb95501d09
--- /dev/null
+++ b/pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-path.html
@@ -0,0 +1,187 @@
+<!--
+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>
+.animation {
+ position: absolute;
+ width: 25px;
+ height: 25px;
+ top: 0px;
+ left: 0px;
+ background: lightsteelblue;
+}
+.expectation {
+ background: red;
+ position: absolute;
+ width: 25px;
+ height: 25px;
+ top: 0px;
+ left: 0px;
+}
+#e1 {
+ -webkit-transform: translate(87.5px, 87.5px);
+ transform: translate(87.5px, 87.5px);
+}
+#e2 {
+ -webkit-transform: translate(387.5px, 87.5px);
+ transform: translate(387.5px, 87.5px);
+}
+#e3 {
+ -webkit-transform: translate(87.5px, 287.5px);
+ transform: translate(87.5px, 287.5px);
+}
+#e4, #anim4 {
+ -webkit-transform: translate(387.5px, 287.5px);
+ transform: translate(387.5px, 287.5px);
+}
+svg {
+position:absolute;
+top: 0px;
+left: 0px;
+width: 800px;
+height: 600px;
+}
+</style>
+
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
+ <path id=path1 d="M 100,100 a 75,75 0 1,0 150,0 a 75,75 0 1,0 -150,0 " />
+ <path d="M 100,100 a 75,75 0 1,0 150,0 a 75,75 0 1,0 -150,0 "
+ stroke="black" stroke-width="1" fill="none" />
+ <path id=path2 d="M400,100l0,0l0,-50l100,0l86.3325,122.665z" />
+ <path d="M400,100l0,0l0,-50l100,0l86.3325,122.665z" stroke="black"
+ stroke-width="1" fill="none" />
+ <path id=path3 d="M100,300l0,0l0,-50l100,0l86.3325,122.665z" />
+ <path d="M100,300l0,0l0,-50l100,0l86.3325,122.665z" stroke="black"
+ stroke-width="1" fill="none" />
+ <path id=path4 d="M400,300l0,0l0,-50l100,0l86.3325,122.665z" />
+ <path d="M400,300l0,0l0,-50l100,0l86.3325,122.665z" stroke="black"
+ stroke-width="1" fill="none" />
+</svg>
+
+<div id="e1" class="expectation"></div>
+<div id="anim1" class="animation">&rarr;</div>
+<div id="e2" class="expectation"></div>
+<div id="anim2" class="animation">&rarr;</div>
+<div id="e3" class="expectation"></div>
+<div id="anim3" class="animation">&rarr;</div>
+<div id="e4" class="expectation"></div>
+<div id="anim4" class="animation">&rarr;</div>
+
+<script>
+var expected_failures = {
+ // Firefox
+ '/#anim1/': {
+ firefox: true,
+ msie: true,
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim2 at t=(0|1|2|10|11)s/': {
+ firefox: true,
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim2 at t=(7|8)s/': {
+ firefox: ['26.0', '27.0'],
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim3 at t=(0|7|8|10)s/': {
+ firefox: true,
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim3 at t=6s/': {
+ firefox: ['26.0', '27.0'],
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim3 at t=5s/': {
+ firefox: ['28.0', '29.0'],
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim4 at t=(0|10)s/': {
+ firefox: true,
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim4 at t=(3|8|9)s/': {
+ firefox: ['28.0', '29.0'],
+ message: "Doesn't quite follow path correctly."
+ },
+
+ // Internet Explorer
+ '/#anim2 at t=(0|1|2|3|4|9|10|11)s/': {
+ msie: true,
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim3 at t=(0|1|3|4|7|8|10|11)s/': {
+ msie: true,
+ message: "Doesn't quite follow path correctly."
+ },
+ '/#anim4 at t=(0|1|3|9|10|11)s/': {
+ msie: true,
+ message: "Doesn't quite follow path correctly."
+ },
+
+ // Android Chrome
+ '/#anim3 at t=(7|8)s/' : {
+ android: true,
+ message: "Android uses integer SVG implementation."
+ },
+ '/#anim4 at t=8s/' : {
+ android: true,
+ message: "Android uses integer SVG implementation."
+ },
+
+ // Firefox & Android Chrome
+ '/#anim2 at t=9s/' : {
+ firefox: ['28.0', '29.0'],
+ android: true,
+ message: "Firefox is non-visibly different and Android uses an integer SVG implementation."
+ },
+};
+</script>
+<script src="../bootstrap.js"></script>
+<script>
+"use strict";
+
+var animFunc1 = new MotionPathEffect(
+ document.querySelector('#path1').pathSegList, 'auto-rotate');
+document.timeline.play(new Animation(document.querySelector("#anim1"),
+ animFunc1, {duration: 10, iterations: 2}));
+
+var animFunc2 = new MotionPathEffect(
+ document.querySelector('#path2').pathSegList, 'auto-rotate');
+document.timeline.play(new Animation(document.querySelector("#anim2"),
+ animFunc2, {duration: 10, iterations: 2}));
+
+var animFunc3 = new MotionPathEffect(
+ document.querySelector('#path3').pathSegList, 'auto-rotate');
+document.timeline.play(new Animation(
+ document.querySelector("#anim3"), animFunc3,
+ {duration: 10, iterations: 2, easing: "paced"}));
+
+var animFunc4KeyFrames = new KeyframeEffect(
+ [{transform: "translate(387.5px, 287.5px) rotate(180deg)"}], "replace");
+var animFunc4Path = new MotionPathEffect(
+ document.querySelector('#path4').pathSegList, 'auto-rotate');
+var anim4 = new Animation(document.querySelector("#anim4"), animFunc4Path,
+ {duration: 10, iterations: 2, easing: "paced"});
+document.timeline.play(anim4);
+
+testharness_timeline.schedule(function() {
+ anim4.effect = animFunc4KeyFrames;
+}, 3000);
+testharness_timeline.schedule(function() {
+ anim4.effect = animFunc4Path;
+}, 6000);
+</script>
« no previous file with comments | « pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-partial-keyframes-checks.js ('k') | pkg/polymer/lib/elements/web-animations-js/test/testcases/auto-test-path-checks.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698