third_party/WebKit/LayoutTests/intersection-observer/iframe-root.html - Issue 1449623002: IntersectionObserver: second cut.

Side by Side Diff: third_party/WebKit/LayoutTests/intersection-observer/iframe-root.html

Issue 1449623002: IntersectionObserver: second cut. (Closed) Base URL: https://chromium.googlesource.com/chromium/src@master

Patch Set: Implemented root margin Created 5 years ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

« third_party/WebKit/LayoutTests/intersection-observer/iframe-no-root.html ('K') | « third_party/WebKit/LayoutTests/intersection-observer/iframe-no-root-expected.txt ('k') | third_party/WebKit/LayoutTests/intersection-observer/iframe-root-expected.txt » ('j') | third_party/WebKit/LayoutTests/intersection-observer/multiple-thresholds.html » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
(Empty)
	1 <!DOCTYPE html>

	2 <div style="width:100%;height:700px;"></div>
	esprehn 2015/12/12 00:14:13 ditto ditto szager1 2015/12/16 19:15:34 Done. Show quoted text On 2015/12/12 00:14:13, esprehn wrote: > ditto Done.
	3 <div id="root" style="display: inline-block; overflow-y: scroll; height: 200px;" >

	4 <div id="target" style="width:100px; height:300px"></div>

	5 <iframe id="target-iframe" src="../resources/intersection-observer-subframe.ht ml" style="width: 300px; height: 100px; overflow-y: scroll" onload="runtests()"> </iframe>

	6 </div>

	7 <div style="width:100%; height:700px;"></div>

	8

	9 <script src="../resources/js-test.js"></script>

	10 <script src="helper-functions.js"></script>
	esprehn 2015/12/12 00:14:12 ditto ditto szager1 2015/12/16 19:15:34 Done. Show quoted text On 2015/12/12 00:14:12, esprehn wrote: > ditto Done.
	11 <script>

	12 description("Simple intersection observer test with no explicit root and target in an iframe.");

	13 var entries = [];

	14

	15 function runtests() {
	esprehn 2015/12/12 00:14:12 ditto ditto szager1 2015/12/16 19:15:34 Done. Show quoted text On 2015/12/12 00:14:12, esprehn wrote: > ditto Done.
	16 var root = document.getElementById("root");

	17 var targetIframe = document.getElementById("target-iframe");

	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 // TODO: It shouldn't be necessary to RAF after the call to observer()

	29 // and before changing the scroll position, but it is.

	30

	31 var expected0 = [];

	32 function step0() {

	33 setTimeout(function() {

	34 checkResults(expected0, "entries");

	35 document.scrollingElement.scrollTop = 250;

	36 requestAnimationFrame(step1);

	37 });

	38 }

	39

	40 var expected1 = [];

	41 function step1() {

	42 setTimeout(function() {

	43 checkResults(expected1, "entries");

	44 iframeScroller.scrollTop = 200;

	45 requestAnimationFrame(step2);

	46 });

	47 }

	48

	49 var expected2 = [];

	50 function step2() {

	51 setTimeout(function() {

	52 checkResults(expected2, "entries");

	53 root.scrollTop = 175;

	54 requestAnimationFrame(step3);

	55 });

	56 }

	57

	58 var expected3 = [

	59 {

	60 'boundingClientRect': [ 18, 118, 593, 693 ],

	61 'intersectionRect': [ 18, 118, 593, 658 ],

	62 'rootBounds' : [ 8, 312, 458, 658 ],

	63 'target': target
	esprehn 2015/12/12 00:14:12 ditto ditto szager1 2015/12/16 19:15:33 Done. Show quoted text On 2015/12/12 00:14:12, esprehn wrote: > ditto Done.
	64 }

	65 ];

	66 function step3() {

	67 setTimeout(function() {

	68 checkResults(expected3, "entries");

	69 document.scrollingElement.scrollTop = 100;

	70 requestAnimationFrame(step4);

	71 });

	72 }

	73

	74 var expected4 = expected3;

	75 function step4() {

	76 setTimeout(function() {

	77 checkResults(expected4, "entries", 1);

	78 root.scrollTop = 100;

	79 requestAnimationFrame(step5);

	80 });

	81 }

	82

	83 var expected5 = expected4.concat([

	84 {

	85 'boundingClientRect': [ 18, 118, 818, 918 ],

	86 'intersectionRect': [ 0, 0, 0, 0 ],

	87 'rootBounds' : [ 8, 312, 608, 808 ],
	esprehn 2015/12/12 00:14:12 ditto ditto szager1 2015/12/16 19:15:33 Done. Show quoted text On 2015/12/12 00:14:12, esprehn wrote: > ditto Done.
	88 'target': target

	89 }

	90 ]);

	91 function step5() {

	92 setTimeout(function() {

	93 checkResults(expected5, "entries", 1);

	94 finishTest();

	95 document.scrollingElement.scrollTop = 0;

	96 });

	97 }

	98

	99 requestAnimationFrame(step0);

	100 }

	101 </script>

OLD	NEW