LayoutTests/animations/animation-controller-drt-api.html - Issue 135693003: Defer starting of animations until after compositing update

Side by Side Diff: LayoutTests/animations/animation-controller-drt-api.html

Issue 135693003: Defer starting of animations until after compositing update (Closed) Base URL: svn://svn.chromium.org/blink/trunk

Patch Set: Advance animation clock after minimum delay. 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 unified diff | Download patch | Annotate | Revision Log

OLD	NEW
1 <!DOCTYPE html>	1 <!DOCTYPE html>

2	2

3 <html lang="en">	3 <html lang="en">

4 <head>	4 <head>

5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">	5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

6 <style>	6 <style>

7	7

8 body {	8 body {

9 margin: 0;	9 margin: 0;

10 }	10 }

11	11

12 #target {	12 #target {

13 position: relative;	13 position: relative;

14 top: 100px;	14 top: 100px;

15 left: 100px;	15 left: 100px;

16 width: 200px;	16 width: 200px;

17 height: 200px;	17 height: 200px;

18 background-color: red;	18 background-color: red;

19 -webkit-animation-name: anim1, anim2;

20 -webkit-animation-duration: 300ms, 300ms;	19 -webkit-animation-duration: 300ms, 300ms;

21 -webkit-animation-delay: 0s, 100ms;	20 -webkit-animation-delay: 0s, 100ms;

22 -webkit-transition-property: top, width;	21 -webkit-transition-property: top, width;

23 -webkit-transition-duration: 300ms, 300ms;	22 -webkit-transition-duration: 300ms, 300ms;

24 -webkit-transition-delay: 0s, 100ms;	23 -webkit-transition-delay: 0s, 100ms;

25 }	24 }

26	25

27 @-webkit-keyframes anim1 {	26 @-webkit-keyframes anim1 {

28 from {	27 from {

29 left: 100px;	28 left: 100px;

(...skipping 16 matching lines...) Expand all Loading...
46	45

47 </style>	46 </style>

48 <script type="text/javascript" charset="utf-8">	47 <script type="text/javascript" charset="utf-8">

49	48

50 function sample(time, expected, isLast) {	49 function sample(time, expected, isLast) {

51 var current = internals.numberOfActiveAnimations();	50 var current = internals.numberOfActiveAnimations();

52 if (current == expected)	51 if (current == expected)

53 document.getElementById('result').innerHTML += "PASS: Number of active a nimations at " + time + "ms is (" + current + ") as expected<br>";	52 document.getElementById('result').innerHTML += "PASS: Number of active a nimations at " + time + "ms is (" + current + ") as expected<br>";

54 else	53 else

55 document.getElementById('result').innerHTML += "FAIL: Number of active a nimations at " + time + "ms is (" + current + ") but was expecting (" + expected + ")<br>";	54 document.getElementById('result').innerHTML += "FAIL: Number of active a nimations at " + time + "ms is (" + current + ") but was expecting (" + expected + ")<br>";

56 if (isLast)	55 if (isLast && window.testRunner)

57 testRunner.notifyDone();	56 testRunner.notifyDone();

58 }	57 }

59	58

60 function startTest() {	59 if (window.testRunner) {

61 if (window.testRunner) {	60 testRunner.dumpAsText();

62 testRunner.dumpAsText();	61 testRunner.waitUntilDone();

63 testRunner.waitUntilDone();

64

65 var target = document.getElementById('target');

66 target.style.top = '200px';

67 target.style.width = '100px';

68

69 setTimeout(sample.bind(null, 0, 4, false), 0);

70 setTimeout(sample.bind(null, 200, 4, false), 200);

71 setTimeout(sample.bind(null, 500, 0, true), 500);

72 }

73 }	62 }

74	63

	64 requestAnimationFrame(function() {

	65 var target = document.getElementById('target');

	66 target.style.webkitAnimationName = 'anim1, anim2';

	67 target.style.top = '200px';

	68 target.style.width = '100px';

	69

	70 requestAnimationFrame(sample.bind(null, 0, 4, false));

	71 setTimeout(sample.bind(null, 200, 4, false), 200);

	72 setTimeout(sample.bind(null, 500, 0, true), 500);

	73 });

75 </script>	74 </script>

76 </head>	75 </head>

77 <body onload="startTest()">	76 <body>

78 <h1>Test for DRT numberOfActiveAnimations() API</h1>	77 <h1>Test for DRT numberOfActiveAnimations() API</h1>

79	78

80 <div id="target"></div>	79 <div id="target"></div>

81 <div id="result"></div>	80 <div id="result"></div>

82 </body>	81 </body>

83 </html>	82 </html>

OLD	NEW

« no previous file with comments | « no previous file | LayoutTests/animations/compositor-start-event-timing.html » ('j') | Source/core/animation/AnimationClock.h » ('J')