| OLD | NEW | 
 | (Empty) | 
|    1 <!DOCTYPE html> |  | 
|    2 <script src="../resources/js-test.js"></script> |  | 
|    3 <script src="helper-functions.js"></script> |  | 
|    4 <div style="width:100%; height:700px;"></div> |  | 
|    5 <div id="root" style="display: inline-block; overflow-y: scroll; height: 200px;"
     > |  | 
|    6   <div id="target" style="width:100px; height:300px"></div> |  | 
|    7   <iframe id="target-iframe" src="../resources/intersection-observer-subframe.ht
     ml" style="width: 300px; height: 100px; overflow-y: scroll"></iframe> |  | 
|    8 </div> |  | 
|    9 <div style="width:100%; height:700px;"></div> |  | 
|   10  |  | 
|   11 <script> |  | 
|   12 description("Simple intersection observer test with no explicit root and target 
     in an iframe."); |  | 
|   13 var entries = []; |  | 
|   14 var root = document.getElementById("root"); |  | 
|   15 var targetIframe = document.getElementById("target-iframe"); |  | 
|   16  |  | 
|   17 targetIframe.onload = function() { |  | 
|   18   var target = targetIframe.contentDocument.getElementById("target"); |  | 
|   19   var iframeScroller = targetIframe.contentDocument.scrollingElement; |  | 
|   20  |  | 
|   21   observer_callback = function(changes) { |  | 
|   22     for (var i in changes) |  | 
|   23       entries.push(changes[i]); |  | 
|   24   }; |  | 
|   25   var observer = new IntersectionObserver(observer_callback, {"root": document.g
     etElementById("root")}); |  | 
|   26   observer.observe(target); |  | 
|   27  |  | 
|   28   function step0() { |  | 
|   29     setTimeout(function() { |  | 
|   30       shouldBeEqualToNumber("entries.length", 0); |  | 
|   31       document.scrollingElement.scrollTop = 250; |  | 
|   32       requestAnimationFrame(step1); |  | 
|   33     }); |  | 
|   34   } |  | 
|   35  |  | 
|   36   function step1() { |  | 
|   37     setTimeout(function() { |  | 
|   38       shouldBeEqualToNumber("entries.length", 0); |  | 
|   39       iframeScroller.scrollTop = 200; |  | 
|   40       requestAnimationFrame(step2); |  | 
|   41     }); |  | 
|   42   } |  | 
|   43  |  | 
|   44   function step2() { |  | 
|   45     setTimeout(function() { |  | 
|   46       shouldBeEqualToNumber("entries.length", 0); |  | 
|   47       root.scrollTop = 175; |  | 
|   48       requestAnimationFrame(step3); |  | 
|   49     }); |  | 
|   50   } |  | 
|   51  |  | 
|   52   function step3() { |  | 
|   53     setTimeout(function() { |  | 
|   54       shouldBeEqualToNumber("entries.length", 1); |  | 
|   55       shouldBeEqualToNumber("entries[0].boundingClientRect.left", 18); |  | 
|   56       shouldBeEqualToNumber("entries[0].boundingClientRect.right", 118); |  | 
|   57       shouldBeEqualToNumber("entries[0].boundingClientRect.top", 593); |  | 
|   58       shouldBeEqualToNumber("entries[0].boundingClientRect.bottom", 693); |  | 
|   59       shouldBeEqualToNumber("entries[0].intersectionRect.left", 18); |  | 
|   60       shouldBeEqualToNumber("entries[0].intersectionRect.right", 118); |  | 
|   61       shouldBeEqualToNumber("entries[0].intersectionRect.top", 593); |  | 
|   62       shouldBeEqualToNumber("entries[0].intersectionRect.bottom", 658); |  | 
|   63       shouldBeEqualToNumber("entries[0].rootBounds.left", 8); |  | 
|   64       shouldBeEqualToNumber("entries[0].rootBounds.right", 312); |  | 
|   65       shouldBeEqualToNumber("entries[0].rootBounds.top", 458); |  | 
|   66       shouldBeEqualToNumber("entries[0].rootBounds.bottom", 658); |  | 
|   67       shouldEvaluateToSameObject("entries[0].target", target); |  | 
|   68       document.scrollingElement.scrollTop = 100; |  | 
|   69       requestAnimationFrame(step4); |  | 
|   70     }); |  | 
|   71   } |  | 
|   72  |  | 
|   73   function step4() { |  | 
|   74     setTimeout(function() { |  | 
|   75       shouldBeEqualToNumber("entries.length", 1); |  | 
|   76       root.scrollTop = 100; |  | 
|   77       requestAnimationFrame(step5); |  | 
|   78     }); |  | 
|   79   } |  | 
|   80  |  | 
|   81   function step5() { |  | 
|   82     setTimeout(function() { |  | 
|   83       shouldBeEqualToNumber("entries.length", 2); |  | 
|   84       shouldBeEqualToNumber("entries[1].boundingClientRect.left", 18); |  | 
|   85       shouldBeEqualToNumber("entries[1].boundingClientRect.right", 118); |  | 
|   86       shouldBeEqualToNumber("entries[1].boundingClientRect.top", 818); |  | 
|   87       shouldBeEqualToNumber("entries[1].boundingClientRect.bottom", 918); |  | 
|   88       shouldBeEqualToNumber("entries[1].intersectionRect.left", 0); |  | 
|   89       shouldBeEqualToNumber("entries[1].intersectionRect.right", 0); |  | 
|   90       shouldBeEqualToNumber("entries[1].intersectionRect.top", 0); |  | 
|   91       shouldBeEqualToNumber("entries[1].intersectionRect.bottom", 0); |  | 
|   92       shouldBeEqualToNumber("entries[1].rootBounds.left", 8); |  | 
|   93       shouldBeEqualToNumber("entries[1].rootBounds.right", 312); |  | 
|   94       shouldBeEqualToNumber("entries[1].rootBounds.top", 608); |  | 
|   95       shouldBeEqualToNumber("entries[1].rootBounds.bottom", 808); |  | 
|   96       shouldEvaluateToSameObject("entries[1].target", target); |  | 
|   97       finishJSTest(); |  | 
|   98       document.scrollingElement.scrollTop = 0; |  | 
|   99     }); |  | 
|  100   } |  | 
|  101  |  | 
|  102   step0(); |  | 
|  103 } |  | 
|  104 </script> |  | 
| OLD | NEW |