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

Side by Side Diff: third_party/WebKit/LayoutTests/web-animations-api/player-finish-event.html

Issue 2140023002: Clean up player-finish-*.html tests to match W3C (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Added todos for review feedback Created 4 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 <html>
3 <head>
4 <style type="text/css">
5 .anim {
6 position: absolute;
7 left: 10px;
8 height: 90px;
9 width: 100px;
10 background-color: black;
11 }
12 </style>
13 <script type="text/javascript">
14
15 function log(message) {
16 var results = document.getElementById('results');
17 results.innerHTML += message + '<br>';
18 }
19
20 function validateFinishEvent(player, event) {
21 if (event.target === player) {
22 log('PASS: ' + player.name + ' is target');
23 } else {
24 log('FAIL: expected target named ' + player.name + ', actual target is ' + event.target);
25 }
26 if (event.currentTime === player.currentTime) {
27 log('PASS: event currentTime equals player currentTime');
28 } else {
29 log('FAIL: event currentTime ' + event.currentTime + ' does not equal pl ayer currentTime ' + player.currentTime);
30 }
31 if (event.timelineTime === document.timeline.currentTime) {
32 log('PASS: event timelineTime equals timeline currentTime');
33 } else {
34 log('FAIL: event timelineTime ' + event.timelineTime +
35 ' does not equal timeline currentTime ' + document.timeline.currentT ime);
36 }
37 }
38
39 var playerTop, playerMiddle, playerBottom;
40
41 function onFinishTop(event) {
42 validateFinishEvent(playerTop, event);
43 if (window.testRunner) {
44 testRunner.notifyDone();
45 }
46 }
47
48 function onFinishMiddle(event) {
49 validateFinishEvent(playerMiddle, event);
50 }
51
52 function onFinishBottom(event) {
53 validateFinishEvent(playerBottom, event);
54 }
55
56 function animate() {
57
58 var keyframes = [
59 {left: '10px', opacity: '1', offset: 0},
60 {left: '100px', opacity: '0', offset: 1}
61 ];
62
63 playerTop = document.getElementById('top').animate(keyframes, 600);
64 playerTop.name = 'playerTop';
65 playerTop.onfinish = onFinishTop;
66
67 playerMiddle = document.getElementById('middle').animate(keyframes, 100);
68 playerMiddle.name = 'playerMiddle';
69 playerMiddle.onfinish = onFinishMiddle;
70
71 playerBottom = document.getElementById('bottom').animate(keyframes, 100);
72 playerBottom.name = 'playerBottom';
73 playerBottom.onfinish = onFinishBottom;
74
75 if (window.testRunner) {
76 testRunner.dumpAsText();
77 testRunner.waitUntilDone();
78 }
79 }
80
81 window.onload = animate;
82
83 </script>
84 </head>
85 <body>
86 <div class="anim" id="top"></div>
87 <div class="anim" id="middle"></div>
88 <div class="anim" id="bottom"></div>
89 <div id="results"></div>
90 </body>
91 </html>
92
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698