| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <meta charset=utf-8> | 2 <meta charset=utf-8> |
| 3 <title>Tests for updating the finished state of an animation</title> | 3 <title>Tests for updating the finished state of an animation</title> |
| 4 <link rel="help" href="https://w3c.github.io/web-animations/#updating-the-finish
ed-state"> | 4 <link rel="help" href="https://w3c.github.io/web-animations/#updating-the-finish
ed-state"> |
| 5 <script src="/resources/testharness.js"></script> | 5 <script src="/resources/testharness.js"></script> |
| 6 <script src="/resources/testharnessreport.js"></script> | 6 <script src="/resources/testharnessreport.js"></script> |
| 7 <script src="../../testcommon.js"></script> | 7 <script src="../../testcommon.js"></script> |
| 8 <body> | 8 <body> |
| 9 <div id="log"></div> | 9 <div id="log"></div> |
| 10 <script> | 10 <script> |
| 11 'use strict'; | 11 'use strict'; |
| 12 | 12 |
| 13 // -------------------------------------------------------------------- |
| 13 // | 14 // |
| 14 // NOTE TO THE POOR PERSON WHO HAS TO MERGE THIS WITH THE TEST OF THE SAME | 15 // TESTS FOR UPDATING THE HOLD TIME |
| 15 // NAME FROM BLINK | |
| 16 // | 16 // |
| 17 // There is a pull request from Blink at: | 17 // -------------------------------------------------------------------- |
| 18 // | |
| 19 // https://github.com/w3c/web-platform-tests/pull/3328 | |
| 20 // | |
| 21 // which this file will surely conflict with. | |
| 22 // | |
| 23 // However, those tests cover a different part of the same algorithm. They | |
| 24 // are mostly concerned with testing events and promises rather than the | |
| 25 // timing part of the algorithm. | |
| 26 // | |
| 27 // The tests below cover the first part of the algorithm. So, please keep both | |
| 28 // sets of tests and delete this comment. Preferably put the tests in this | |
| 29 // file first. | |
| 30 // | |
| 31 // Thank you! | |
| 32 // | |
| 33 | |
| 34 | 18 |
| 35 // CASE 1: playback rate > 0 and current time >= target effect end | 19 // CASE 1: playback rate > 0 and current time >= target effect end |
| 36 // (Also the start time is resolved and there is pending task) | 20 // (Also the start time is resolved and there is pending task) |
| 37 | 21 |
| 38 // Did seek = false | 22 // Did seek = false |
| 39 promise_test(function(t) { | 23 promise_test(function(t) { |
| 40 var anim = createDiv(t).animate(null, 100 * MS_PER_SEC); | 24 var anim = createDiv(t).animate(null, 100 * MS_PER_SEC); |
| 41 | 25 |
| 42 // Here and in the following tests we wait until ready resolves as | 26 // Here and in the following tests we wait until ready resolves as |
| 43 // otherwise we don't have a resolved start time. We test the case | 27 // otherwise we don't have a resolved start time. We test the case |
| (...skipping 276 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 320 // Trigger a change that will cause the "update the finished state" | 304 // Trigger a change that will cause the "update the finished state" |
| 321 // procedure to run. | 305 // procedure to run. |
| 322 anim.currentTime = 50 * MS_PER_SEC; | 306 anim.currentTime = 50 * MS_PER_SEC; |
| 323 assert_equals(anim.currentTime, 50 * MS_PER_SEC, | 307 assert_equals(anim.currentTime, 50 * MS_PER_SEC, |
| 324 'The animation hold time should not be updated'); | 308 'The animation hold time should not be updated'); |
| 325 assert_equals(anim.startTime, null, | 309 assert_equals(anim.startTime, null, |
| 326 'The animation start time should not be updated'); | 310 'The animation start time should not be updated'); |
| 327 }, 'Updating the finished state when start time is unresolved and' | 311 }, 'Updating the finished state when start time is unresolved and' |
| 328 + ' did seek = true'); | 312 + ' did seek = true'); |
| 329 | 313 |
| 314 // -------------------------------------------------------------------- |
| 315 // |
| 316 // TESTS FOR RUNNING FINISH NOTIFICATION STEPS |
| 317 // |
| 318 // -------------------------------------------------------------------- |
| 319 |
| 320 function waitForFinishEventAndPromise(animation) { |
| 321 var eventPromise = new Promise(function(resolve) { |
| 322 animation.onfinish = function() { resolve(); } |
| 323 }); |
| 324 return Promise.all([eventPromise, animation.finished]); |
| 325 } |
| 326 |
| 327 promise_test(function(t) { |
| 328 var animation = createDiv(t).animate(null, 1); |
| 329 animation.onfinish = |
| 330 t.unreached_func('Seeking to finish should not fire finish event'); |
| 331 animation.finished.then( |
| 332 t.unreached_func('Seeking to finish should not resolve finished promise')); |
| 333 animation.currentTime = 1; |
| 334 animation.currentTime = 0; |
| 335 animation.pause(); |
| 336 return waitForAnimationFrames(3); |
| 337 }, 'Finish notification steps don\'t run when the animation seeks to finish' |
| 338 + ' and then seeks back again'); |
| 339 |
| 340 promise_test(function(t) { |
| 341 var animation = createDiv(t).animate(null, 1); |
| 342 return animation.ready.then(function() { |
| 343 return waitForFinishEventAndPromise(animation); |
| 344 }); |
| 345 }, 'Finish notification steps run when the animation completes normally'); |
| 346 |
| 347 promise_test(function(t) { |
| 348 var animation = createDiv(t).animate(null, 1); |
| 349 return animation.ready.then(function() { |
| 350 animation.currentTime = 10; |
| 351 return waitForFinishEventAndPromise(animation); |
| 352 }); |
| 353 }, 'Finish notification steps run when the animation seeks past finish'); |
| 354 |
| 355 promise_test(function(t) { |
| 356 var animation = createDiv(t).animate(null, 1); |
| 357 return animation.ready.then(function() { |
| 358 // Register for notifications now since once we seek away from being |
| 359 // finished the 'finished' promise will be replaced. |
| 360 var finishNotificationSteps = waitForFinishEventAndPromise(animation); |
| 361 animation.finish(); |
| 362 animation.currentTime = 0; |
| 363 animation.pause(); |
| 364 return finishNotificationSteps; |
| 365 }); |
| 366 }, 'Finish notification steps run when the animation completes with .finish(),' |
| 367 + ' even if we then seek away'); |
| 368 |
| 369 promise_test(function(t) { |
| 370 var animation = createDiv(t).animate(null, 1); |
| 371 var initialFinishedPromise = animation.finished; |
| 372 |
| 373 return animation.finished.then(function(target) { |
| 374 animation.currentTime = 0; |
| 375 assert_not_equals(initialFinishedPromise, animation.finished); |
| 376 }); |
| 377 }, 'Animation finished promise is replaced after seeking back to start'); |
| 378 |
| 379 promise_test(function(t) { |
| 380 var animation = createDiv(t).animate(null, 1); |
| 381 var initialFinishedPromise = animation.finished; |
| 382 |
| 383 return animation.finished.then(function(target) { |
| 384 animation.play(); |
| 385 assert_not_equals(initialFinishedPromise, animation.finished); |
| 386 }); |
| 387 }, 'Animation finished promise is replaced after replaying from start'); |
| 388 |
| 389 async_test(function(t) { |
| 390 var animation = createDiv(t).animate(null, 1); |
| 391 animation.onfinish = function(event) { |
| 392 animation.currentTime = 0; |
| 393 animation.onfinish = function(event) { |
| 394 t.done(); |
| 395 }; |
| 396 }; |
| 397 }, 'Animation finish event is fired again after seeking back to start'); |
| 398 |
| 399 async_test(function(t) { |
| 400 var animation = createDiv(t).animate(null, 1); |
| 401 animation.onfinish = function(event) { |
| 402 animation.play(); |
| 403 animation.onfinish = function(event) { |
| 404 t.done(); |
| 405 }; |
| 406 }; |
| 407 }, 'Animation finish event is fired again after replaying from start'); |
| 408 |
| 330 </script> | 409 </script> |
| 331 </body> | 410 </body> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2446483002:
Import wpt@c5a14f553cba5f197743b9af605a84eddd8692a2 (Closed)
