frame-with-intersection-observer.html (962B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <script src="/resources/testharness.js"></script> 4 <script src="utils.js"></script> 5 <div id="target" style="width: 100px; height: 100px; position: fixed; top: 0px; left: 0px"></div> 6 <script> 7 let next_token = 0; 8 function init() { 9 const tokens = parseKeylist(); 10 let observer = new IntersectionObserver((entries) => { 11 assert_equals(entries.length, 1); 12 let rect = entries[0].intersectionRect.x + "," + 13 entries[0].intersectionRect.y + "," + 14 entries[0].intersectionRect.width + "," + 15 entries[0].intersectionRect.height + "," + 16 entries[0].isVisible; 17 writeValueToServer(tokens[next_token], rect); 18 next_token = next_token + 1; 19 20 if (next_token == tokens.length) { 21 observer.disconnect(); 22 } 23 }, {trackVisibility: true, delay: 100, threshold: [0.6, 0.75]}); 24 observer.observe(document.getElementById("target")); 25 } 26 27 init(); 28 </script> 29 </html>