pkg/polymer/lib/elements/web-animations-js/test/testcases/disabled-test-compositing-order.html - Issue 175443005: [polymer] import all elements

Side by Side Diff: pkg/polymer/lib/elements/web-animations-js/test/testcases/disabled-test-compositing-order.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, 9 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 unified diff | Download patch | Annotate | Revision Log

« no previous file with comments | « pkg/polymer/lib/elements/web-animations-js/test/testcases/disabled-media.html ('k') | pkg/polymer/lib/elements/web-animations-js/test/testcases/impl-test-from-css-value.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
(Empty)
	1 <!--

	2 Copyright 2013 Google Inc. All Rights Reserved.

	3

	4 Licensed under the Apache License, Version 2.0 (the "License");

	5 you may not use this file except in compliance with the License.

	6 You may obtain a copy of the License at

	7

	8 http://www.apache.org/licenses/LICENSE-2.0

	9

	10 Unless required by applicable law or agreed to in writing, software

	11 distributed under the License is distributed on an "AS IS" BASIS,

	12 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.

	13 See the License for the specific language governing permissions and

	14 limitations under the License.

	15 -->

	16

	17 <!DOCTYPE html><meta charset="UTF-8">

	18

	19 <style>

	20 div.anim {

	21 position: relative;

	22 }

	23 </style>

	24

	25 <div id="target1" class="anim"></div>

	26 <div id="target2" class="anim"></div>

	27 <div id="target3" class="anim"></div>

	28 <div id="target4" class="anim"></div>

	29

	30 <script src="../bootstrap.js" nochecks></script>

	31 <script>

	32 "use strict";

	33

	34 var leftToRight = [{left: "100px"}, {left: "200px"}];

	35 var leftToRightLarge = [{left: "100px"}, {left: "1000px"}];

	36 var rightToLeft = [{left: "200px"}, {left: "100px"}];

	37 var noop = {color: "red"};

	38

	39 // Test that an animation uses the correct compositing order when it has a

	40 // grandparent that remains active longer than its parent.

	41 //

	42 // The first animation should run between times 0.0 and 1.0 and the second

	43 // between times 2.0 and 3.0. Both use the default fill mode of "forwards", but

	44 // because the second animation has a later start time, it should be composited

	45 // second, so the div should end up on the left.

	46 var target1 = document.getElementById("target1");

	47 var player = document.timeline.play(new ParGroup([

	48 new ParGroup([

	49 new Animation(target1, leftToRight, 1.0),

	50 ]),

	51 new SeqGroup([

	52 new Animation(target1, noop, 2.0),

	53 new Animation(target1, rightToLeft, 1.0),

	54 ]),

	55 ]));

	56

	57 timing_test(function() {

	58 at(3.0, function() {assert_equals(getComputedStyle(target1).getPropertyValue ("left"), "100px")});

	59 }, "First animation should have earlier compositing order");

	60

	61 // Test that compositing order takes account of playback rate.

	62 //

	63 // The start time of the first animation is 0.0. The SeqGroup has a playback

	64 // rate of 4.0, so the effective start time of its child animation is 2.0. So

	65 // the the div should end up on the left at time 3.0.

	66 var target2 = document.getElementById("target2");

	67 var player = document.timeline.play(new ParGroup([

	68 new Animation(target2, leftToRight, 1.0),

	69 new SeqGroup([

	70 new Animation(target1, noop, 8.0),

	71 new Animation(target2, rightToLeft, 4.0),

	72 ], {playbackRate: 4.0}),

	73 ]));

	74

	75 timing_test(function() {

	76 at(3.0, function() {assert_equals(getComputedStyle(target2).getPropertyValue ("left"), "100px")});

	77 }, "Second animation should have later compositing order");

	78

	79 // Test compositing order follows Player start time order.

	80 var target3 = document.getElementById("target3");

	81 var player1 = document.timeline.play(

	82 new Animation(target3, leftToRight, 1.0));

	83 player1.startTime += 1.0;

	84 var player2 = document.timeline.play(

	85 new Animation(target3, leftToRightLarge, 2.0));

	86

	87 timing_test(function() {

	88 at(2.0, function() {assert_equals(getComputedStyle(target3).getPropertyValue ("left"), "200px")});

	89 }, "First animation should have latest compositing order");

	90

	91 // Test compositing order follows tree order.

	92 var target4 = document.getElementById("target4");

	93 var player = document.timeline.play(new ParGroup([

	94 new Animation(target4, leftToRightLarge, 1.0),

	95 new SeqGroup([

	96 new Animation(target4, leftToRightLarge, 1.0),

	97 new ParGroup([

	98 new Animation(target4, leftToRightLarge, 1.0),

	99 new Animation(target4, leftToRightLarge, 1.0),

	100 ]),

	101 ]),

	102 new ParGroup([

	103 new Animation(target4, leftToRightLarge, 1.0),

	104 new Animation(target4, leftToRight, 1.0),

	105 ]),

	106 ]));

	107

	108 timing_test(function() {

	109 at(2.0, function() {assert_equals(getComputedStyle(target4).getPropertyValue ("left"), "200px")});

	110 }, "Last animation should have latest compositing order");

	111

	112 </script>

OLD	NEW