| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../../resources/js-test.js"></script> |
| 3 |
| 4 <div id="top_div" style="background-color:blue;position:absolute; top:50px; left
:20px; width:600px; height:800px"> |
| 5 </div> |
| 6 |
| 7 <div id="target_div" style="background-color:red;position:absolute; top:855px;
left:66px; width:300px; height:250px"> |
| 8 </div> |
| 9 |
| 10 <script> |
| 11 window.jsTestIsAsync = true; |
| 12 |
| 13 var entries = []; |
| 14 var expectedEntries = [ |
| 15 { |
| 16 time:'mark', |
| 17 boundingClientRect:{top:855, right:366, bottom: 1105, left: 66}, |
| 18 intersectionRect:{top:855, right:366, bottom: 1000, left: 66}, |
| 19 rootBounds: {top:400, right:785, bottom:1000, left:0}, |
| 20 target: document.getElementById('target_div') |
| 21 } |
| 22 ]; |
| 23 |
| 24 var a = {}, b = {}; |
| 25 function shouldBeClientRect(name, value1, value2) |
| 26 { |
| 27 a[name] = value1; |
| 28 b[name] = value2; |
| 29 shouldBe('a.'+name+'.top', 'b.'+name+'.top'); |
| 30 shouldBe('a.'+name+'.right', 'b.'+name+'.right'); |
| 31 shouldBe('a.'+name+'.bottom', 'b.'+name+'.bottom'); |
| 32 shouldBe('a.'+name+'.left', 'b.'+name+'.left'); |
| 33 } |
| 34 |
| 35 function testIntersectionObserver() |
| 36 { |
| 37 var observer = new IntersectionObserver(intersectionCallback, {}); |
| 38 |
| 39 function intersectionCallback(changes) |
| 40 { |
| 41 entries = entries.concat(changes); |
| 42 if (entries.length != expectedEntries.length) |
| 43 return; |
| 44 shouldBe('entries[0].time', '0'); |
| 45 shouldBeClientRect('bounds', changes[0].boundingClientRect, expectedEntr
ies[0].boundingClientRect); |
| 46 shouldBeClientRect('intersection', changes[0].intersectionRect, expected
Entries[0].intersectionRect); |
| 47 shouldBeClientRect('rootBounds', changes[0].rootBounds, expectedEntries[
0].rootBounds); |
| 48 shouldBe('entries[0].target', 'expectedEntries[0].target'); |
| 49 testRunner.notifyDone(); |
| 50 } |
| 51 |
| 52 var target_div = document.getElementById('target_div'); |
| 53 observer.observe(target_div); |
| 54 window.setTimeout(function() { window.scrollBy(0, 400); }, 0); |
| 55 } |
| 56 |
| 57 description("This tests that IntersectionObserver gets called the right number o
f times."); |
| 58 |
| 59 testIntersectionObserver(); |
| 60 testRunner.waitUntilDone(); |
| 61 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1449623002:
IntersectionObserver: second cut. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src@master