src/third_party/WebKit/LayoutTests/web-animations-api/w3c/getAnimationPlayers.html

   1 <!DOCTYPE html>
   2 <script src="../../resources/testharness.js"></script>
   3 <script src="../../resources/testharnessreport.js"></script>
   4 <style>
   5 @keyframes test {
   6     from { opacity: 0; }
   7     to { opacity: 1; }
   8 }
   9 .cssAnimation {
  10     animation: test 2s;
  11 }
  12 </style>
  13 <div id='container'>
  14     <div id='element'></div>
  15 </div>
  16
  17 <script>
  18
  19 var container = document.getElementById('container');
  20 var element = document.getElementById('element');
  21
  22 test(function() {
  23     assert_equals(document.timeline.getAnimationPlayers().length, 0);
  24     assert_equals(container.getAnimationPlayers().length, 0);
  25     assert_equals(element.getAnimationPlayers().length, 0);
  26
  27     var player = element.animate([], 1000);
  28     assert_equals(document.timeline.getAnimationPlayers().length, 1);
  29     assert_equals(document.timeline.getAnimationPlayers()[0], player);
  30
  31     var player2 = container.animate([], 1000);
  32     assert_equals(document.timeline.getAnimationPlayers().length, 2);
  33     assert_equals(document.timeline.getAnimationPlayers()[0], player);
  34     assert_equals(document.timeline.getAnimationPlayers()[1], player2);
  35
  36     player.finish();
  37     assert_equals(document.timeline.getAnimationPlayers().length, 1);
  38     assert_equals(document.timeline.getAnimationPlayers()[0], player2);
  39
  40     player2.finish();
  41     assert_equals(document.timeline.getAnimationPlayers().length, 0);
  42 }, 'Timeline getAnimationPlayers()');
  43
  44 test(function() {
  45     assert_equals(document.timeline.getAnimationPlayers().length, 0);
  46     assert_equals(container.getAnimationPlayers().length, 0);
  47     assert_equals(element.getAnimationPlayers().length, 0);
  48
  49     var player = element.animate([], 1000);
  50     assert_equals(document.timeline.getAnimationPlayers().length, 1);
  51     assert_equals(document.timeline.getAnimationPlayers()[0], player);
  52     assert_equals(container.getAnimationPlayers().length, 0);
  53     assert_equals(element.getAnimationPlayers().length, 1);
  54     assert_equals(element.getAnimationPlayers()[0], player);
  55
  56     var player2 = container.animate([], 1000);
  57     assert_equals(document.timeline.getAnimationPlayers().length, 2);
  58     assert_equals(document.timeline.getAnimationPlayers()[0], player);
  59     assert_equals(document.timeline.getAnimationPlayers()[1], player2);
  60     assert_equals(container.getAnimationPlayers().length, 1);
  61     assert_equals(container.getAnimationPlayers()[0], player2);
  62     assert_equals(element.getAnimationPlayers().length, 1);
  63     assert_equals(element.getAnimationPlayers()[0], player);
  64
  65     player.finish();
  66     assert_equals(document.timeline.getAnimationPlayers().length, 1);
  67     assert_equals(document.timeline.getAnimationPlayers()[0], player2);
  68     assert_equals(container.getAnimationPlayers().length, 1);
  69     assert_equals(container.getAnimationPlayers()[0], player2);
  70     assert_equals(element.getAnimationPlayers().length, 0);
  71
  72     player2.finish();
  73     assert_equals(document.timeline.getAnimationPlayers().length, 0);
  74     assert_equals(container.getAnimationPlayers().length, 0);
  75     assert_equals(element.getAnimationPlayers().length, 0);
  76
  77 }, 'Animatable getAnimationPlayers()');
  78
  79 test(function() {
  80     assert_equals(document.timeline.getAnimationPlayers().length, 0);
  81     assert_equals(container.getAnimationPlayers().length, 0);
  82     assert_equals(element.getAnimationPlayers().length, 0);
  83
  84     var player = element.animate([], {duration: 1000, delay: 500});
  85     assert_equals(document.timeline.getAnimationPlayers().length, 1);
  86     assert_equals(document.timeline.getAnimationPlayers()[0], player);
  87     assert_equals(container.getAnimationPlayers().length, 0);
  88     assert_equals(element.getAnimationPlayers().length, 1);
  89     assert_equals(element.getAnimationPlayers()[0], player);
  90
  91     player.finish();
  92     assert_equals(document.timeline.getAnimationPlayers().length, 0);
  93     assert_equals(container.getAnimationPlayers().length, 0);
  94     assert_equals(element.getAnimationPlayers().length, 0);
  95
  96 }, 'getAnimationPlayers() with delays');
  97
  98 async_test(function(t) {
  99     assert_equals(document.timeline.getAnimationPlayers().length, 0);
 100     assert_equals(container.getAnimationPlayers().length, 0);
 101     assert_equals(element.getAnimationPlayers().length, 0);
 102
 103     element.className = 'cssAnimation';
 104     t.step(function() {
 105         onload = function () {
 106             var players = document.timeline.getAnimationPlayers();
 107             assert_equals(players.length, 1);
 108             assert_equals(container.getAnimationPlayers().length, 0);
 109             assert_equals(element.getAnimationPlayers().length, 1);
 110
 111             players[0].finish();
 112             assert_equals(document.timeline.getAnimationPlayers().length, 0);
 113             assert_equals(container.getAnimationPlayers().length, 0);
 114             assert_equals(element.getAnimationPlayers().length, 0);
 115             t.done();
 116         }
 117     });
 118 }, 'getAnimationPlayers() with cssanimations');
 119
 120 </script>