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

Side by Side Diff: LayoutTests/web-animations-api/w3c/eased-keyframes.html

Issue 253963002: Web Animations API: Add layout tests for element.animate() keyframes (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Added comment Created 6 years, 5 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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <script src="../resources/testharness.js"></script> 2 <script src="../../resources/testharness.js"></script>
3 <script src="../resources/testharnessreport.js"></script> 3 <script src="../../resources/testharnessreport.js"></script>
4 <script src="w3c/resources/keyframes-test.js"></script> 4 <script src="resources/keyframes-test.js"></script>
5 <script> 5 <script>
6 // FIXME: Remove the need for and use of this function. 6 test(function() {
7 // Currently our animation timeline is not stable during page load script execut ion.
8 // By deferring the tests to requestAnimationFrame() we can get a stable timelin e and
9 // avoid flaky test results.
10 function testInRAF(testFunction, description, properties) {
11 async_test(function(testHandle) {
12 requestAnimationFrame(function() {
13 testHandle.step(testFunction);
14 testHandle.done();
15 })
16 }, description, properties);
17 }
18
19 testInRAF(function() {
20 assertAnimationStyles([ 7 assertAnimationStyles([
21 {opacity: '0', left: '0px', easing: 'steps(2, start)'}, 8 {opacity: '0', left: '0px', easing: 'steps(2, start)'},
22 {opacity: '0.25', left: '25px'}, 9 {opacity: '0.25', left: '25px'},
23 {opacity: '0.75', left: '75px'}, 10 {opacity: '0.75', left: '75px'},
24 ], { 11 ], {
25 0: {opacity: '0.125', left: '12.5px'}, 12 0: {opacity: '0.125', left: '12.5px'},
26 0.125: {opacity: '0.125', left: '12.5px'}, 13 0.125: {opacity: '0.125', left: '12.5px'},
27 0.25: {opacity: '0.25', left: '25px'}, 14 0.25: {opacity: '0.25', left: '25px'},
28 0.375: {opacity: '0.25', left: '25px'}, 15 0.375: {opacity: '0.25', left: '25px'},
29 0.5: {opacity: '0.25', left: '25px'}, 16 0.5: {opacity: '0.25', left: '25px'},
(...skipping 23 matching lines...) Expand all
53 { 40 {
54 help: 'http://dev.w3.org/fxtf/web-animations/#the-keyframe-dictionary', 41 help: 'http://dev.w3.org/fxtf/web-animations/#the-keyframe-dictionary',
55 assert: [ 42 assert: [
56 'element.animate() should start an animation when keyframes are specified wi th timing functions', 43 'element.animate() should start an animation when keyframes are specified wi th timing functions',
57 'for their easing property. The animation should use the given timing functi on between consecutive', 44 'for their easing property. The animation should use the given timing functi on between consecutive',
58 'keyframe offsets.', 45 'keyframe offsets.',
59 ], 46 ],
60 author: 'Alan Cutter', 47 author: 'Alan Cutter',
61 }); 48 });
62 49
63 testInRAF(function() { 50 test(function() {
64 assertAnimationStyles([ 51 assertAnimationStyles([
65 {opacity: '0', offset: 0, easing: 'steps(2, start)'}, 52 {opacity: '0', offset: 0, easing: 'steps(2, start)'},
66 {left: '0px', offset: 0}, 53 {left: '0px', offset: 0},
67 {opacity: '0.5', left: '50px'}, 54 {opacity: '0.5', left: '50px'},
68 ], { 55 ], {
69 0: {opacity: '0.25', left: '0px'}, 56 0: {opacity: '0.25', left: '0px'},
70 0.25: {opacity: '0.25', left: '12.5px'}, 57 0.25: {opacity: '0.25', left: '12.5px'},
71 0.5: {opacity: '0.5', left: '25px'}, 58 0.5: {opacity: '0.5', left: '25px'},
72 0.75: {opacity: '0.5', left: '37.5px'}, 59 0.75: {opacity: '0.5', left: '37.5px'},
73 1: {opacity: '0.5', left: '50px'}, 60 1: {opacity: '0.5', left: '50px'},
74 }); 61 });
75 }, 62 },
76 'element.animate() with eased keyframe on single property', 63 'element.animate() with eased keyframe on single property',
77 { 64 {
78 help: 'http://dev.w3.org/fxtf/web-animations/#the-keyframe-dictionary', 65 help: 'http://dev.w3.org/fxtf/web-animations/#the-keyframe-dictionary',
79 assert: [ 66 assert: [
80 'element.animate() should start an animation when keyframes are specified wi th timing functions', 67 'element.animate() should start an animation when keyframes are specified wi th timing functions',
81 'for their easing property. The animation should use the given timing functi on only on the properties', 68 'for their easing property. The animation should use the given timing functi on only on the properties',
82 'specified in the same keyframe.', 69 'specified in the same keyframe.',
83 ], 70 ],
84 author: 'Alan Cutter', 71 author: 'Alan Cutter',
85 }); 72 });
86 73
87 testInRAF(function() { 74 test(function() {
88 assertAnimationStyles([ 75 assertAnimationStyles([
89 {opacity: '0', left: '0px'}, 76 {opacity: '0', left: '0px'},
90 {opacity: '0.5', left: '50px', easing: 'steps(2, start)'}, 77 {opacity: '0.5', left: '50px', easing: 'steps(2, start)'},
91 ], { 78 ], {
92 0: {opacity: '0', left: '0px'}, 79 0: {opacity: '0', left: '0px'},
93 0.25: {opacity: '0.125', left: '12.5px'}, 80 0.25: {opacity: '0.125', left: '12.5px'},
94 0.5: {opacity: '0.25', left: '25px'}, 81 0.5: {opacity: '0.25', left: '25px'},
95 0.75: {opacity: '0.375', left: '37.5px'}, 82 0.75: {opacity: '0.375', left: '37.5px'},
96 1: {opacity: '0.5', left: '50px'}, 83 1: {opacity: '0.5', left: '50px'},
97 }); 84 });
98 }, 85 },
99 'element.animate() with easing on last keyframe', 86 'element.animate() with easing on last keyframe',
100 { 87 {
101 help: 'http://dev.w3.org/fxtf/web-animations/#the-keyframe-dictionary', 88 help: 'http://dev.w3.org/fxtf/web-animations/#the-keyframe-dictionary',
102 assert: [ 89 assert: [
103 'element.animate() should start an animation when keyframes are specified wi th timing functions', 90 'element.animate() should start an animation when keyframes are specified wi th timing functions',
104 'for their easing property. Easing on the last keyframes should have no effe ct on the animation.', 91 'for their easing property. Easing on the last keyframes should have no effe ct on the animation.',
105 ], 92 ],
106 author: 'Alan Cutter', 93 author: 'Alan Cutter',
107 }); 94 });
108 </script> 95 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698