OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <script src="../resources/testharness.js"></script> | 2 <script src="../resources/testharness.js"></script> |
3 <script src="../resources/testharnessreport.js"></script> | 3 <script src="../resources/testharnessreport.js"></script> |
4 <script src="./resources/intersection-observer-test-utils.js"></script> | 4 <script src="./resources/intersection-observer-test-utils.js"></script> |
5 | 5 |
6 <style> | 6 <style> |
7 pre, #log { | 7 pre, #log { |
8 position: absolute; | 8 position: absolute; |
9 top: 0; | 9 top: 0; |
10 left: 200px; | 10 left: 200px; |
(...skipping 22 matching lines...) Expand all Loading... |
33 var root = document.getElementById('root'); | 33 var root = document.getElementById('root'); |
34 assert_true(!!root, "root element exists."); | 34 assert_true(!!root, "root element exists."); |
35 var target = document.getElementById('target'); | 35 var target = document.getElementById('target'); |
36 assert_true(!!target, "target element exists."); | 36 assert_true(!!target, "target element exists."); |
37 var observer = new IntersectionObserver(function(changes) { | 37 var observer = new IntersectionObserver(function(changes) { |
38 entries = entries.concat(changes); | 38 entries = entries.concat(changes); |
39 }, { root: root }); | 39 }, { root: root }); |
40 observer.observe(target); | 40 observer.observe(target); |
41 entries = entries.concat(observer.takeRecords()); | 41 entries = entries.concat(observer.takeRecords()); |
42 assert_equals(entries.length, 0, "No initial notifications."); | 42 assert_equals(entries.length, 0, "No initial notifications."); |
43 runTestCycle(step0, "No notifications after first rAF."); | 43 runTestCycle(step0, "First rAF."); |
44 }, "IntersectionObserver should detect and report edge-adjacent and zero-area in
tersections."); | 44 }, "IntersectionObserver should detect and report edge-adjacent and zero-area in
tersections."); |
45 | 45 |
46 function step0() { | 46 function step0() { |
47 runTestCycle(step1, "Set transform=translateY(200px) on target."); | 47 runTestCycle(step1, "Set transform=translateY(200px) on target."); |
48 assert_equals(entries.length, 0, "entries.length"); | 48 checkLastEntry(entries, 0, [8, 108, 258, 358, 0, 0, 0, 0, 8, 208, 8, 208, targ
et]); |
49 target.style.transform = "translateY(200px)"; | 49 target.style.transform = "translateY(200px)"; |
50 } | 50 } |
51 | 51 |
52 function step1() { | 52 function step1() { |
53 runTestCycle(step2, "Set transform=translateY(201px) on target."); | 53 runTestCycle(step2, "Set transform=translateY(201px) on target."); |
54 checkLastEntry(entries, 0, [8, 108, 208, 308, 8, 108, 208, 208, 8, 208, 8, 208
, target]); | 54 checkLastEntry(entries, 1, [8, 108, 208, 308, 8, 108, 208, 208, 8, 208, 8, 208
, target]); |
55 target.style.transform = "translateY(201px)"; | 55 target.style.transform = "translateY(201px)"; |
56 } | 56 } |
57 | 57 |
58 function step2() { | 58 function step2() { |
59 runTestCycle(step3, "Set transform=translateY(185px) on target."); | 59 runTestCycle(step3, "Set transform=translateY(185px) on target."); |
60 checkLastEntry(entries, 1); | 60 checkLastEntry(entries, 2); |
61 target.style.height = "0px"; | 61 target.style.height = "0px"; |
62 target.style.width = "300px"; | 62 target.style.width = "300px"; |
63 target.style.transform = "translateY(185px)"; | 63 target.style.transform = "translateY(185px)"; |
64 } | 64 } |
65 | 65 |
66 function step3() { | 66 function step3() { |
67 checkLastEntry(entries, 2, [8, 308, 193, 193, 8, 208, 193, 193, 8, 208, 8, 208
, target]); | 67 checkLastEntry(entries, 3, [8, 308, 193, 193, 8, 208, 193, 193, 8, 208, 8, 208
, target]); |
68 } | 68 } |
69 </script> | 69 </script> |
OLD | NEW |