tor-browser

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

only-child-image-pair.html (1409B)


      1 <!DOCTYPE html>
      2 <html class="reftest-wait foo">
      3 <title>View transitions: ensure :only-child is supported on view-transition-image-pair</title>
      4 <link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/">
      5 <link rel="author" href="mailto:khushalsagar@chromium.org">
      6 
      7 <script src="/resources/testharness.js"></script>
      8 <script src="/resources/testharnessreport.js"></script>
      9 
     10 <style>
     11 ::view-transition {
     12  background-color: black;
     13 }
     14 html:only-child {
     15  background-color: black;
     16 }
     17 :root:only-child {
     18  background-color: black;
     19 }
     20 :only-child {
     21  background-color: black;
     22 }
     23 .foo:only-child {
     24  background-color: black;
     25 }
     26 
     27 ::view-transition-image-pair(root):only-child {
     28  background-color: red;
     29 }
     30 ::view-transition-image-pair(*):only-child {
     31  color: red;
     32 }
     33 </style>
     34 
     35 <script>
     36 promise_test(() => {
     37  assert_implements(document.startViewTransition, "Missing document.startViewTransition");
     38  return new Promise(async (resolve, reject) => {
     39    let transition = document.startViewTransition();
     40    transition.ready.then(() => {
     41      let style = getComputedStyle(document.documentElement, "::view-transition-image-pair(root)");
     42      if (style.backgroundColor == "rgb(255, 0, 0)" && style.color == "rgb(255, 0, 0)")
     43        resolve();
     44      else
     45        reject(style.backgroundColor + " and " + style.color);
     46    });
     47  });
     48 }, ":only-child should always match for ::view-transition-image-pair");
     49 </script>