OLD | NEW |
---|---|
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <script src="../resources/js-test.js"></script> | 2 <script src="../resources/testharness.js"></script> |
3 <script src="../resources/intersection-observer-helper-functions.js"></script> | 3 <script src="../resources/testharnessreport.js"></script> |
4 <iframe id="iframe" srcdoc="<div id='target'><div style='width:1000px;height:100 0px'></div></div>"></iframe> | 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: 180px; | |
14 height: 100px; | |
15 } | |
16 </style> | |
17 | |
18 <iframe id="iframe" srcdoc="<div id='target' style='width:1000px;height:1000px;' ></div>"></iframe> | |
19 | |
5 <script> | 20 <script> |
6 description("Ensure that change.boundingClientRect matches change.target.getBoun dingClientRect() for a clipped element with overflow inside an iframe."); | 21 var target; |
7 | 22 var entries = []; |
23 var observer; | |
8 var iframe = document.getElementById("iframe"); | 24 var iframe = document.getElementById("iframe"); |
9 var entries = []; | |
10 var target; | |
11 | 25 |
12 iframe.onload = function() { | 26 iframe.onload = function() { |
13 target = iframe.contentDocument.getElementById("target"); | 27 runTestCycle(function() { |
14 new IntersectionObserver((changes) => { | 28 assert_equals(window.innerWidth, 800, "Window must be 800 pixels wide."); |
15 entries.push(...changes); | 29 assert_equals(window.innerHeight, 600, "Window must be 600 pixels high."); |
16 }).observe(target); | 30 |
17 waitForNotification(step0); | 31 target = iframe.contentDocument.getElementById("target"); |
32 assert_true(!!target, "Target element exists."); | |
33 observer = new IntersectionObserver(function(changes) { | |
34 entries = entries.concat(changes); | |
35 }); | |
36 observer.observe(target); | |
37 entries = entries.concat(observer.takeRecords()); | |
38 assert_equals(entries.length, 0, "No initial notifications."); | |
39 runTestCycle(test0, "First rAF should generate notification."); | |
40 }, "IntersectionObserverEntry.boundingClientRect should match target.boundingC lientRect()"); | |
18 }; | 41 }; |
19 | 42 |
20 function step0() { | 43 function test0() { |
21 shouldBeEqualToNumber("entries.length", 1); | 44 assert_equals(entries.length, 1, "One notification."); |
22 if (entries.length > 0) { | 45 var bcr = target.getBoundingClientRect(); |
23 shouldBe("entries[0].boundingClientRect.top", "target.getBoundingClientRect( ).top"); | 46 checkEntry(entries, 0, [bcr.left, bcr.right, bcr.top, bcr.bottom]); |
foolip
2017/01/11 13:42:53
See question about checkLastEntry in framework, se
| |
24 shouldBe("entries[0].boundingClientRect.left", "target.getBoundingClientRect ().left"); | |
25 shouldBe("entries[0].boundingClientRect.width", "target.getBoundingClientRec t().width"); | |
26 shouldBe("entries[0].boundingClientRect.height", "target.getBoundingClientRe ct().height"); | |
27 } | |
28 finishJSTest(); | |
29 } | 47 } |
30 </script> | 48 </script> |
OLD | NEW |