tor-browser

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

remove-element.html (2349B)

      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 pre, #log {
      9  position: absolute;
     10  top: 0;
     11  left: 200px;
     12 }
     13 #root {
     14  display: inline-block;
     15  overflow-y: scroll;
     16  height: 200px;
     17  border: 3px solid black;
     18 }
     19 #target {
     20  width: 100px;
     21  height: 100px;
     22  background-color: green;
     23 }
     24 .spacer {
     25  height: 300px;
     26 }
     27 </style>
     28 
     29 <div id="root">
     30  <div id="leading-space" class="spacer"></div>
     31  <div id="target"></div>
     32  <div id="trailing-space" class="spacer"</div>
     33 </div>
     34 
     35 <script>
     36 var entries = [];
     37 var root, target, trailingSpace;
     38 
     39 runTestCycle(function() {
     40  target = document.getElementById("target");
     41  assert_true(!!target, "Target exists");
     42  trailingSpace = document.getElementById("trailing-space");
     43  assert_true(!!trailingSpace, "TrailingSpace exists");
     44  root = document.getElementById("root");
     45  assert_true(!!root, "Root exists");
     46  var observer = new IntersectionObserver(function(changes) {
     47    entries = entries.concat(changes)
     48  }, {root: root});
     49  observer.observe(target);
     50  entries = entries.concat(observer.takeRecords());
     51  assert_equals(entries.length, 0, "No initial notifications.");
     52  runTestCycle(step0, "First rAF");
     53 }, "Verify that not-intersecting notifications are sent when a target is removed from the DOM tree.");
     54 
     55 function step0() {
     56  root.scrollTop = 150;
     57  runTestCycle(step1, "root.scrollTop = 150");
     58  checkLastEntry(entries, 0, [11, 111, 311, 411, 0, 0, 0, 0, 11, 111, 11, 211, false]);
     59 }
     60 
     61 function step1() {
     62  root.removeChild(target);
     63  runTestCycle(step2, "root.removeChild(target).");
     64  checkLastEntry(entries, 1, [11, 111, 161, 261, 11, 111, 161, 211, 11, 111, 11, 211, true]);
     65 }
     66 
     67 function step2() {
     68  root.scrollTop = 0;
     69  root.insertBefore(target, trailingSpace);
     70  runTestCycle(step3, "root.insertBefore(target, trailingSpace).");
     71  checkLastEntry(entries, 2, [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, false]);
     72 }
     73 
     74 function step3() {
     75  root.scrollTop = 150;
     76  runTestCycle(step4, "root.scrollTop = 150 after reinserting target.");
     77  checkLastEntry(entries, 2);
     78 }
     79 
     80 function step4() {
     81  checkLastEntry(entries, 3, [11, 111, 161, 261, 11, 111, 161, 211, 11, 111, 11, 211, true]);
     82 }
     83 </script>