1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
<!DOCTYPE html>
<meta name="viewport" content="width=device-width,initial-scale=1">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<title>Intersection observer with cross-origin iframe and tall viewport</title>
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1984635">
<style>
pre, #log {
position: absolute;
top: 0;
left: 200px;
}
iframe {
width: 160px;
height: 5100px;
border: 0;
outline: 1px solid;
}
.spacer {
height: calc(200vh + 100px);
}
</style>
<div class="spacer"></div>
<iframe src="http://{{hosts[alt][]}}:{{ports[http][0]}}/intersection-observer/resources/cross-origin-tall-subframe.sub.html?nest=4" sandbox="allow-scripts"></iframe>
<div class="spacer"></div>
<script>
let iframe = document.querySelector("iframe");
async function queryIframeState() {
let response = new Promise(resolve => {
window.addEventListener("message", function(e) {
resolve(e.data);
}, { once: true });
});
iframe.contentWindow.postMessage({ request: true }, "*");
let data = await response;
assert_true(Array.isArray(data.entries), "Expected an array of entries");
assert_equals(data.entries.length, 1, "Only one entry expected");
return data.entries[0];
}
async function assertFrameTargetIntersects(expected, msg) {
let framesToTry = 10;
let state;
for (let i = 0; i < framesToTry; ++i) {
state = await queryIframeState();
if (state.isIntersecting == expected) {
break;
}
await new Promise(r => requestAnimationFrame(r));
}
assert_equals(state.isIntersecting, expected, `Target should be ${expected ? "intersecting" : "not intersecting"} ${msg}`);
return state;
}
onload = () => {
promise_test(async function() {
await assertFrameTargetIntersects(false, "at start");
iframe.scrollIntoView({ block: "start" });
await assertFrameTargetIntersects(false, "when frame top visible");
iframe.scrollIntoView({ block: "end" });
await assertFrameTargetIntersects(true, "when frame bottom visible");
iframe.scrollIntoView({ block: "start" });
await assertFrameTargetIntersects(false, "when frame top visible again");
});
}
</script>
|
