scaled-target.html (1345B)
1 <!DOCTYPE html> 2 <script src="/resources/testharness.js"></script> 3 <script src="/resources/testharnessreport.js"></script> 4 <script src="../resources/intersection-observer-test-utils.js"></script> 5 6 <style> 7 pre, #log { 8 position: absolute; 9 top: 0; 10 left: 200px; 11 } 12 #iframe { 13 width: 100px; 14 height: 100px; 15 border: 0; 16 margin-bottom: 10px; 17 } 18 #occluder { 19 width: 100px; 20 height: 100px; 21 background-color: blue; 22 position: relative; 23 } 24 </style> 25 26 <iframe id="iframe" src="../resources/scaled-target-subframe.html"></iframe> 27 <div id="occluder"></div> 28 29 <script> 30 async_test(function(t) { 31 let iframe = document.getElementById("iframe"); 32 33 function step0(event) { 34 assert_equals(event.data, ""); 35 } 36 37 function step1(event) { 38 iframe.style.transform = "scale(2)"; 39 assert_equals(JSON.stringify(event.data), 40 JSON.stringify([true])); 41 } 42 43 function step2(event) { 44 assert_equals(JSON.stringify(event.data), 45 JSON.stringify([false])); 46 } 47 48 let steps = [step0, step1, step2]; 49 50 window.addEventListener("message", event => { 51 if (steps.length) { 52 t.step(steps.shift(), t, event); 53 waitForFrame(t, () => { 54 iframe.contentWindow.postMessage("", "*") 55 }); 56 } else { 57 t.done(); 58 } 59 }); 60 61 }, "IntersectionObserver V2 test with scale applied to target."); 62 </script>