tor-browser

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

box-shadow.html (2156B)


      1 <!DOCTYPE html>
      2 <meta name="viewport" content="width=device-width,initial-scale=1">
      3 <script src="/resources/testharness.js"></script>
      4 <script src="/resources/testharnessreport.js"></script>
      5 <script src="../resources/intersection-observer-test-utils.js"></script>
      6 
      7 <style>
      8 body, html {
      9  margin: 0;
     10 }
     11 pre, #log {
     12  position: absolute;
     13  top: 0;
     14  left: 200px;
     15 }
     16 iframe {
     17  width: 100px;
     18  height: 100px;
     19  border: 0;
     20 }
     21 #box-shadow {
     22  display: inline-block;
     23  box-shadow: -50px -50px 0 50px rgba(255, 0, 0, 0.7);
     24 }
     25 </style>
     26 
     27 <iframe id=target srcdoc="<!DOCTYPE html><div>Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum.</div>"></iframe><div id=box-shadow></div>
     28 
     29 <script>
     30 var delay = 100;
     31 var entries = [];
     32 var target;
     33 var occluder;
     34 
     35 runTestCycle(function() {
     36  target = document.getElementById("target");
     37  occluder = document.getElementById("box-shadow");
     38  assert_true(!!target, "target exists");
     39  assert_true(!!occluder, "occluder exists");
     40  let observer = new IntersectionObserver(function(changes) {
     41    entries = entries.concat(changes)
     42  }, {trackVisibility: true, delay: delay});
     43  observer.observe(target);
     44  entries = entries.concat(observer.takeRecords());
     45  assert_equals(entries.length, 0, "No initial notifications.");
     46  runTestCycle(step0, "First rAF.", delay);
     47 }, "IntersectionObserverV2 observing an iframe element.", delay);
     48 
     49 function step0() {
     50  occluder.style.boxShadow = "none";
     51  runTestCycle(step1, 'occluder.style.boxShadow = "none"', delay);
     52  assert_equals(entries.length, 1, "Initial notification.");
     53  assert_equals(entries[0].isVisible, false, "Initially occluded.");
     54 }
     55 
     56 function step1() {
     57  occluder.style.boxShadow = "";
     58  runTestCycle(step2, 'occluder.style.boxShadow = ""', delay);
     59  assert_equals(entries.length, 2, "Notification after removing box shadow.");
     60  assert_equals(entries[1].isVisible, true, "Visible when box shadow removed.");
     61 }
     62 
     63 function step2() {
     64  assert_equals(entries.length, 3, "Notification after re-adding box shadow.");
     65  assert_equals(entries[2].isVisible, false, "Occluded when box shadow re-added.");
     66 }
     67 </script>