third_party/WebKit/LayoutTests/animations/display-none-cancels-nested-animations.html

   1 <!DOCTYPE html>
   2 <style>
   3 #child {
   4   width: 50px;
   5   height: 50px;
   6   background: red;
   7   -webkit-animation: flash 0.2s infinite;
   8 }
   9
  10 .hideMe {
  11   display: none;
  12 }
  13
  14 @-webkit-keyframes flash {
  15   0% {
  16     opacity: 1;
  17   }
  18   100% {
  19     opacity: 0;
  20   }
  21 }
  22 </style>
  23 <div id='container'>
  24   <div id='child' class='hideMe'></div>
  25 </div>
  26 <script>
  27 if (window.testRunner) {
  28     testRunner.waitUntilDone();
  29     testRunner.dumpAsText();
  30 }
  31 var firstCall = true;
  32 child.addEventListener('webkitAnimationStart', function(e) {
  33     if (firstCall) {
  34         container.classList.add('hideMe');
  35         container.offsetTop;
  36         container.classList.remove('hideMe');
  37         firstCall = false;
  38         return;
  39     }
  40     document.documentElement.textContent = 'PASS';
  41     if (window.testRunner) {
  42         testRunner.notifyDone();
  43     }
  44 });
  45 child.classList.remove('hideMe');
  46 </script>
  47