| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../resources/js-test.js"></script> |
| 3 <script src="../resources/intersection-observer-helper-functions.js"></script> |
| 4 <style> |
| 5 .target { |
| 6 width: 100px; |
| 7 height: 100px; |
| 8 margin: 10px; |
| 9 background-color: green; |
| 10 } |
| 11 </style> |
| 12 <div style="width:100%; height:700px;"></div> |
| 13 <div id="target1" class="target"></div> |
| 14 <div id="target2" class="target"></div> |
| 15 <div id="target3" class="target"></div> |
| 16 |
| 17 <script> |
| 18 description("Verify that notifications for multiple targets are sorted by the or
der in which observe() was called on each target."); |
| 19 var target1 = document.getElementById("target1"); |
| 20 var target2 = document.getElementById("target2"); |
| 21 var target3 = document.getElementById("target3"); |
| 22 var entries = []; |
| 23 var observer = new IntersectionObserver( |
| 24 changes => { entries.push(...changes); } |
| 25 ); |
| 26 |
| 27 onload = function() { |
| 28 observer.observe(target1); |
| 29 observer.observe(target2); |
| 30 observer.observe(target3); |
| 31 entries = entries.concat(observer.takeRecords()); |
| 32 shouldBeEqualToNumber("entries.length", 0); |
| 33 document.scrollingElement.scrollTop = 150; |
| 34 waitForNotification(step0); |
| 35 } |
| 36 |
| 37 function step0() { |
| 38 shouldBeEqualToNumber("entries.length", 1); |
| 39 if (entries.length > 0) |
| 40 shouldBeEqualToString("entries[0].target.id", "target1"); |
| 41 document.scrollingElement.scrollTop = 10000; |
| 42 waitForNotification(step1); |
| 43 } |
| 44 |
| 45 function step1() { |
| 46 shouldBeEqualToNumber("entries.length", 3); |
| 47 if (entries.length > 1) |
| 48 shouldBeEqualToString("entries[1].target.id", "target2"); |
| 49 if (entries.length > 2) |
| 50 shouldBeEqualToString("entries[2].target.id", "target3"); |
| 51 document.scrollingElement.scrollTop = 0; |
| 52 waitForNotification(step2); |
| 53 } |
| 54 |
| 55 function step2() { |
| 56 shouldBeEqualToNumber("entries.length", 6); |
| 57 if (entries.length > 3) |
| 58 shouldBeEqualToString("entries[3].target.id", "target1"); |
| 59 if (entries.length > 4) |
| 60 shouldBeEqualToString("entries[4].target.id", "target2"); |
| 61 if (entries.length > 5) |
| 62 shouldBeEqualToString("entries[5].target.id", "target3"); |
| 63 finishJSTest(); |
| 64 } |
| 65 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2028363002:
IntersectionObserver: make order of notifications deterministic. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src@master