intersection-ratio-with-fractional-bounds-2.html (1028B)
1 <!DOCTYPE html> 2 <title>IntersectionObserver ratio with fractional bounds</title> 3 <link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1278897"> 4 <meta name="viewport" content="width=device-width,initial-scale=1"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 8 <style> 9 #container { 10 overflow: hidden; 11 width: 500px; 12 } 13 #target { 14 display: list-item; 15 padding: 16.1px; 16 background: rebeccapurple; 17 } 18 </style> 19 20 <div id="container"> 21 <div id="list"> 22 <span id="target"></span> 23 </div> 24 </div> 25 26 <script> 27 async_test(function(t) { 28 let target = document.getElementById("target"); 29 let list = document.getElementById("list"); 30 let observer = new IntersectionObserver(t.step_func_done(function(entries) { 31 assert_equals(entries.length, 1); 32 assert_equals(entries[0].intersectionRatio, 1); 33 assert_equals(entries[0].isIntersecting, true); 34 }), { root: list, threshold: 1 }); 35 observer.observe(target); 36 }); 37 </script>