intersection-ratio-with-fractional-bounds.html (1029B)
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=1020466"> 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 body { 10 margin: 0; 11 } 12 #container { 13 display: flex; 14 } 15 #left { 16 height: 100px; 17 width: 0.88875%; 18 background: lightblue; 19 } 20 #target { 21 height: 100px; 22 width: 99.11125%; 23 background: rebeccapurple; 24 } 25 </style> 26 27 <div id="container"> 28 <div id="left"></div> 29 <div id="target"></div> 30 </div> 31 32 <script> 33 async_test(function(t) { 34 let target = document.getElementById("target"); 35 let observer = new IntersectionObserver(t.step_func_done(function(entries) { 36 assert_equals(entries.length, 1); 37 assert_equals(entries[0].intersectionRatio, 1); 38 assert_equals(entries[0].isIntersecting, true); 39 })); 40 observer.observe(target); 41 }); 42 </script>