layout/reftests/css-transitions/reframe-and-transition-starts-at-the-same-time.html

   1 <!DOCTYPE html>
   2 <html class="reftest-wait">
   3 <style>
   4 #target::before {
   5   transition: background-color 100s steps(1, end);
   6   content: 'initial';
   7   background-color: rgb(255, 255, 255);
   8   height: 100px;
   9   width: 100px;
  10   position: absolute;
  11 }
  12 #target.hover::before{
  13   background-color: rgb(0, 0, 0);
  14   content: '';
  15 }
  16 </style>
  17 <div id="target"></div>
  18 <script>
  19 window.addEventListener("load", () => {
  20   target.className = 'hover';
  21   target.addEventListener('transitionstart', () => {
  22     document.documentElement.classList.remove('reftest-wait');
  23   });
  24 });
  25 </script>
  26 </html>