tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

reparent-animating-element-002.html (1266B)


      1 <!DOCTYPE html>
      2 <html class="test-wait">
      3 <title>CSS Test (Animations): Reparenting an element with a web animation on the compositor</title>
      4 <link rel="author" title="L. David Baron" href="https://dbaron.org/">
      5 <link rel="author" title="Google" href="http://www.google.com/">
      6 <link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1305487">
      7 <meta name="assert" content="This should not crash.">
      8 <!--
      9 
     10 The Chromium implementation of <marquee> essentially uses web animations
     11 underneath.  However, I was unable to make a testcase for this crash
     12 that uses web animations directly.  Despite that, it still seems worth
     13 adding this testcase here in WPT.
     14 
     15 -->
     16 
     17 <style>
     18 #animate {
     19  width: 100px;
     20  height: 100px;
     21 }
     22 #newparent {
     23  display: none;
     24 }
     25 </style>
     26 <marquee id="animate">X</marquee>
     27 <div id="newparent"></div>
     28 <script>
     29 
     30 let a = document.getElementById("animate");
     31 
     32 requestAnimationFrame(function() {
     33  // use setTimeout because the crash doesn't happen if we do this inside
     34  // a requestAnimationFrame callback
     35  setTimeout(function() {
     36    a.remove();
     37    document.getElementById("newparent").appendChild(a);
     38    requestAnimationFrame(function() {
     39      document.documentElement.classList.remove("test-wait");
     40    });
     41  }, 0);
     42 });
     43 
     44 </script>