| <!DOCTYPE html> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <style> |
| pre, #log { |
| position: absolute; |
| top: 0; |
| left: 200px; |
| } |
| iframe { |
| width: 150px; |
| height: 500px; |
| } |
| </style> |
| <iframe src="http://localhost:8080/intersection-observer/resources/iframe-with-fixed-position-element.html"></iframe> |
| <script> |
| |
| function checkRect(actual, expected, description) { |
| if (!expected.length) |
| return; |
| assert_equals(actual.left, expected[0], description + '.left'); |
| assert_equals(actual.right, expected[1], description + '.right'); |
| assert_equals(actual.top, expected[2], description + '.top'); |
| assert_equals(actual.bottom, expected[3], description + '.bottom'); |
| } |
| |
| async_test(t => { |
| var iframe = document.querySelector("iframe"); |
| |
| assert_equals(window.innerWidth, 800, "Window must be 800 pixels wide."); |
| assert_equals(window.innerHeight, 600, "Window must be 600 pixels high."); |
| |
| // This window will receive a message from the iframe for each |
| // IntersectionObserver notification. The child should only generate one, |
| // which indicates that a fixed position element is correctly intersecting |
| // the viewport. |
| window.addEventListener("message", event => { |
| t.step(() => { |
| checkRect(event.data.intersectionRect, [25, 125, 100, 200], "Fixed position div intersects viewport") |
| }); |
| t.done(); |
| }); |
| |
| iframe.onload = t.step_func(function() { |
| requestAnimationFrame(() => { iframe.contentWindow.postMessage("", "*") }); |
| }); |
| }, "IntersectionObserver target in cross-origin iframe with fixed position reports viewport intersectino."); |
| </script> |
