tor-browser

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

popover-anchor-backdrop-transition.html (810B)

      1 <!DOCTYPE html>
      2 <title>CSS Anchor Positioning Test: popover with anchor functions transition ::backdrop</title>
      3 <link rel="help" href="https://drafts.csswg.org/css-anchor-position-1/">
      4 <script src="/resources/testharness.js"></script>
      5 <script src="/resources/testharnessreport.js"></script>
      6 <div id="anchor"></div>
      7 <div id="popover" popover></div>
      8 <style>
      9  #anchor {
     10    anchor-name: --anchor;
     11  }
     12  #popover {
     13    top: anchor(--anchor bottom);
     14  }
     15  ::backdrop {
     16    transition: opacity 1s step-end;
     17    opacity: 1;
     18  }
     19  @starting-style {
     20    ::backdrop {
     21      opacity: 0;
     22    }
     23  }
     24 </style>
     25 <script>
     26  test(() => {
     27    popover.showPopover();
     28    assert_equals(getComputedStyle(popover, "::backdrop").opacity, "0");
     29  }, "Anchored popover ::backdrop transitioning opacity with @starting-style");
     30 </script>