diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 17:32:43 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 17:32:43 +0000 |
| commit | 6bf0a5cb5034a7e684dcc3500e841785237ce2dd (patch) | |
| tree | a68f146d7fa01f0134297619fbe7e33db084e0aa /testing/web-platform/tests/intersection-observer/resources/cross-origin-subframe.html | |
| parent | Initial commit. (diff) | |
| download | thunderbird-6bf0a5cb5034a7e684dcc3500e841785237ce2dd.tar.xz thunderbird-6bf0a5cb5034a7e684dcc3500e841785237ce2dd.zip | |
Adding upstream version 1:115.7.0.upstream/1%115.7.0upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/intersection-observer/resources/cross-origin-subframe.html')
| -rw-r--r-- | testing/web-platform/tests/intersection-observer/resources/cross-origin-subframe.html | 171 |
1 files changed, 171 insertions, 0 deletions
diff --git a/testing/web-platform/tests/intersection-observer/resources/cross-origin-subframe.html b/testing/web-platform/tests/intersection-observer/resources/cross-origin-subframe.html new file mode 100644 index 0000000000..1b34d7c7b7 --- /dev/null +++ b/testing/web-platform/tests/intersection-observer/resources/cross-origin-subframe.html @@ -0,0 +1,171 @@ +<!DOCTYPE html> +<div style="height: 200px; width: 100px;"></div> +<div id="target" style="background-color: green; width:100px; height:100px"></div> +<div id="empty-target" style="width: 100px"></div> +<div style="height: 200px; width: 100px;"></div> + +<script> +var port; +var entries = []; +var target = document.getElementById("target"); +var emptyTarget = document.getElementById("empty-target"); +var scroller = document.scrollingElement; +var nextStep; + +function clientRectToJson(rect) { + if (!rect) + return "null"; + return { + top: rect.top, + right: rect.right, + bottom: rect.bottom, + left: rect.left + }; +} + +function entryToJson(entry) { + return { + boundingClientRect: clientRectToJson(entry.boundingClientRect), + intersectionRect: clientRectToJson(entry.intersectionRect), + rootBounds: clientRectToJson(entry.rootBounds), + isIntersecting: entry.isIntersecting, + target: entry.target === document.documentElement ? "html" : entry.target.id + }; +} + +function boundingClientRectToJson(element) { + let r = element.getBoundingClientRect(); + return [r.left, r.right, r.top, r.bottom]; +} + +// Note that we never use RAF in this code, because this frame might get render-throttled. +// Instead of RAF-ing, we just post an empty message to the parent window, which will +// RAF when it is received, and then send us a message to cause the next step to run. + +// Use a rootMargin here, and verify it does NOT get applied for the cross-origin case. +var observer = new IntersectionObserver(function(changes) { + entries = entries.concat(changes) +}, { rootMargin: "7px" }); +observer.observe(target); +observer.observe(emptyTarget); +observer.observe(document.documentElement); + +function step0() { + entries = entries.concat(observer.takeRecords()); + nextStep = step1; + var expected = [{ + boundingClientRect: [8, 108, 208, 308], + intersectionRect: [0, 0, 0, 0], + rootBounds: "null", + isIntersecting: false, + target: target.id + }, { + boundingClientRect: [8, 108, 308, 308], + intersectionRect: [0, 0, 0, 0], + rootBounds: "null", + isIntersecting: false, + target: emptyTarget.id + }, { + boundingClientRect: boundingClientRectToJson(document.documentElement), + intersectionRect: [0, 0, 0, 0], + rootBounds: "null", + isIntersecting: false, + target: "html" + }]; + port.postMessage({ + actual: entries.map(entryToJson), + expected: expected, + description: "First rAF" + }, "*"); + entries = []; + port.postMessage({scrollTo: 200}, "*"); +} + +function step1() { + entries = entries.concat(observer.takeRecords()); + var client_rect = boundingClientRectToJson(document.documentElement); + // When the top document is scrolled all the way up, the iframe element is + // 108px below the scrolling viewport, and the iframe has a 2px border. When + // the top document is scrolled to y=200, the top 90px of the iframe's content + // is visible. + var expected = [{ + boundingClientRect: client_rect, + intersectionRect: client_rect.slice(0, 3).concat(90), + rootBounds: "null", + isIntersecting: true, + target: "html" + }]; + port.postMessage({ + actual: entries.map(entryToJson), + expected: expected, + description: "topDocument.scrollingElement.scrollTop = 200" + }, "*"); + entries = []; + scroller.scrollTop = 250; + nextStep = step2; + port.postMessage({}, "*"); +} + +function step2() { + entries = entries.concat(observer.takeRecords()); + var expected = [{ + boundingClientRect: [8, 108, -42, 58], + intersectionRect: [8, 108, 0, 58], + rootBounds: "null", + isIntersecting: true, + target: target.id + }, { + boundingClientRect: [8, 108, 58, 58], + intersectionRect: [8, 108, 58, 58], + rootBounds: "null", + isIntersecting: true, + target: emptyTarget.id + }]; + port.postMessage({ + actual: entries.map(entryToJson), + expected: expected, + description: "iframeDocument.scrollingElement.scrollTop = 250" + }, "*"); + entries = []; + nextStep = step3; + port.postMessage({scrollTo: 100}, "*"); +} + +function step3() { + entries = entries.concat(observer.takeRecords()); + var expected = [{ + boundingClientRect: [8, 108, -42, 58], + intersectionRect: [0, 0, 0, 0], + rootBounds: "null", + isIntersecting: false, + target: target.id + }, { + boundingClientRect: [8, 108, 58, 58], + intersectionRect: [0, 0, 0, 0], + rootBounds: "null", + isIntersecting: false, + target: emptyTarget.id + }, { + boundingClientRect: boundingClientRectToJson(document.documentElement), + intersectionRect: [0, 0, 0, 0], + rootBounds: "null", + isIntersecting: false, + target: "html" + }]; + port.postMessage({ + actual: entries.map(entryToJson), + expected: expected, + description: "topDocument.scrollingElement.scrollTop = 100" + }, "*"); + port.postMessage({DONE: 1}, "*"); +} + +function handleMessage(event) +{ + port = event.source; + nextStep(); +} + +nextStep = step0; +window.addEventListener("message", handleMessage); +</script> |