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

Side by Side Diff: third_party/WebKit/LayoutTests/animations/timing-functions-update-animation.html

Issue 2979503002: Move animation timing tests to subdirectory (Closed)
Patch Set: Created 3 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
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <script src="../resources/testharness.js"></script>
3 <script src="../resources/testharnessreport.js"></script>
4 <style>
5 @keyframes anim {
6 from { left: 0px; }
7 50% { left: 400px; animation-timing-function: ease-in; }
8 to { left: 500px; }
9 }
10
11 #target {
12 animation: anim 10s paused;
13 position: absolute;
14 }
15 </style>
16 <div id="target"></div>
17 <script>
18 test(function() {
19 target.offsetTop;
20 assert_equals(parseInt(getComputedStyle(target).left), 0, 'left offset');
21 target.style.animationTimingFunction = 'ease-out'; // Should not change anyt hing as we're on the first frame
22 assert_equals(parseInt(getComputedStyle(target).left), 0, 'left offset');
23
24 target.style.animationDelay = '-1s';
25 assert_equals(parseInt(getComputedStyle(target).left), 123, 'left offset');
26 target.style.animationTimingFunction = 'linear';
27 assert_equals(parseInt(getComputedStyle(target).left), 80, 'left offset');
28 target.style.animationTimingFunction = 'cubic-bezier(0, 0.5, 0.2, 1)';
29 assert_equals(parseInt(getComputedStyle(target).left), 275, 'left offset');
30 target.style.animationTimingFunction = 'ease-out';
31 assert_equals(parseInt(getComputedStyle(target).left), 123, 'left offset');
32
33 target.style.animationDelay = '-4s';
34 assert_equals(parseInt(getComputedStyle(target).left), 375, 'left offset');
35 target.style.animationTimingFunction = 'linear';
36 assert_equals(parseInt(getComputedStyle(target).left), 320, 'left offset');
37 target.style.animationTimingFunction = 'cubic-bezier(0, 0.5, 0.2, 1)';
38 assert_equals(parseInt(getComputedStyle(target).left), 395, 'left offset');
39 target.style.animationTimingFunction = 'ease-out';
40 assert_equals(parseInt(getComputedStyle(target).left), 375, 'left offset');
41
42 target.style.animationDelay = '-6s'; // Transitioning between 50% and 100%, but timing functions on 100% are ignored
43 assert_equals(parseInt(getComputedStyle(target).left), 406, 'left offset');
44 target.style.animationTimingFunction = 'linear';
45 assert_equals(parseInt(getComputedStyle(target).left), 406, 'left offset');
46 target.style.animationTimingFunction = 'cubic-bezier(0, 0.5, 0.2, 1)';
47 assert_equals(parseInt(getComputedStyle(target).left), 406, 'left offset');
48
49 }, "Check that changes in the animation timing function are reflected immediat ely");
50 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698