tor-browser

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

active-view-transition-on-non-root.html (1080B)

      1 <!DOCTYPE html>
      2 <html class="reftest-wait">
      3 <title>View transitions: active-view-transition should only apply to the root element</title>
      4 <link rel="help" href="https://www.w3.org/TR/css-transitions-2/">
      5 <link rel="author" href="mailto:vmpstr@chromium.org">
      6 <link rel="match" href="view-transition-types-one-green-square-ref.html">
      7 
      8 <script src="/common/reftest-wait.js"></script>
      9 <style>
     10 
     11 body { background: lightpink; }
     12 
     13 #target {
     14  view-transition-name: target;
     15  background: green;
     16  width: 100px;
     17  height: 100px;
     18 }
     19 
     20 main:active-view-transition #target {
     21  background: red;
     22 }
     23 
     24 ::view-transition-group(*),
     25 ::view-transition-image-pair(*),
     26 ::view-transition-old(*),
     27 ::view-transition-new(*) {
     28  animation-play-state: paused;
     29 }
     30 </style>
     31 <main>
     32  <div id="target"></div>
     33 </main>
     34 <script>
     35 failIfNot(document.startViewTransition, "Missing document.startViewTransition");
     36 
     37 function runTest() {
     38  let transition = document.startViewTransition();
     39  transition.ready.then(takeScreenshot);
     40 }
     41 onload = () => requestAnimationFrame(() => requestAnimationFrame(runTest));
     42 </script>
     43 </html>