| <!DOCTYPE html> |
| <div style="height:200px;"></div> |
| <script> |
| onload = () => { |
| let numRecords = 0; |
| let popup = window.open("root-bounds-popup.html"); |
| popup.addEventListener("load", (event) => { |
| popup.postMessage("start", "*"); |
| }); |
| // The popup will send a "start" message after it has created an |
| // IntersectionObserver, and it will send an additional message for each |
| // IntersectionObserver notification it receives. |
| window.addEventListener("message", event => { |
| if (event.data == "start") { |
| let target = popup.document.getElementById("target"); |
| target.remove(); |
| document.body.appendChild(target); |
| requestAnimationFrame(() => { |
| document.scrollingElement.scrollTop = 1000; |
| // We send a "continue" message here to ensure that the popup window |
| // will run a lifecycle update, which is necessary to generate and |
| // deliver IntersectionObserver notifications. |
| popup.postMessage("continue", "*"); |
| }); |
| } else { |
| numRecords++; |
| // Forward all IntersectionObserver notifications on to the embedding |
| // window. |
| window.parent.postMessage(event.data, "*"); |
| if (numRecords > 2) |
| window.parent.postMessage("done", "*"); |
| } |
| }); |
| }; |
| </script> |
