Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(225)

Side by Side Diff: third_party/WebKit/LayoutTests/http/tests/intersection-observer/resources/cross-origin-subframe.html

Issue 1776493002: IntersectionObserver: use an idle callback to send notifications. (Closed) Base URL: https://chromium.googlesource.com/chromium/src@master
Patch Set: syntax error Created 4 years, 9 months 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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <script src="helper-functions.js"></script> 2 <script src="helper-functions.js"></script>
3 <div style="height: 200px; width: 100px;"></div> 3 <div style="height: 200px; width: 100px;"></div>
4 <div id="target" style="background-color: green; width:100px; height:100px"></di v> 4 <div id="target" style="background-color: green; width:100px; height:100px"></di v>
5 <div style="height: 200px; width: 100px;"></div> 5 <div style="height: 200px; width: 100px;"></div>
6 <script> 6 <script>
7 var port; 7 var port;
8 var entries = []; 8 var entries = [];
9 var target = document.getElementById('target'); 9 var target = document.getElementById('target');
10 var scroller = document.scrollingElement; 10 var scroller = document.scrollingElement;
11 var nextStep; 11 var nextStep;
12 12
13 // Note that we never use RAF in this code, because this frame might get render- throttled. 13 // Note that we never use RAF in this code, because this frame might get render- throttled.
14 // Instead of RAF-ing, we just post an empty message to the parent window, which will 14 // Instead of RAF-ing, we just post an empty message to the parent window, which will
15 // RAF when it is received, and then send us a message to cause the next step to run. 15 // RAF when it is received, and then send us a message to cause the next step to run.
16 16
17 function observer_callback(changes) {
18 for (var i in changes)
19 entries.push(changes[i]);
20 }
21
22 // Use a rootMargin here, and verify it does NOT get applied for the cross-origi n case. 17 // Use a rootMargin here, and verify it does NOT get applied for the cross-origi n case.
23 var observer = new IntersectionObserver(observer_callback, {rootMargin: "7px"}); 18 var observer = new IntersectionObserver(
19 changes => { entries = entries.concat(changes) },
20 { rootMargin: "7px" }
21 );
24 observer.observe(target); 22 observer.observe(target);
25 23
26 function step0() { 24 function step0() {
27 setTimeout(function() { 25 entries = entries.concat(observer.takeRecords());
28 nextStep = step1; 26 nextStep = step1;
29 port.postMessage({actual: entries.map(entryToJson), expected: []}, "*"); 27 port.postMessage({actual: entries.map(entryToJson), expected: []}, "*");
30 entries = []; 28 entries = [];
31 port.postMessage({scrollTo: 200}, "*"); 29 port.postMessage({scrollTo: 200}, "*");
32 });
33 } 30 }
34 31
35 function step1() { 32 function step1() {
36 setTimeout(function() { 33 entries = entries.concat(observer.takeRecords());
37 port.postMessage({actual: entries.map(entryToJson), expected: []}, "*"); 34 port.postMessage({actual: entries.map(entryToJson), expected: []}, "*");
38 entries = []; 35 entries = [];
39 scroller.scrollTop = 250; 36 scroller.scrollTop = 250;
40 nextStep = step2; 37 nextStep = step2;
41 port.postMessage({}, "*"); 38 port.postMessage({}, "*");
42 });
43 } 39 }
44 40
45 function step2() { 41 function step2() {
46 setTimeout(function() { 42 entries = entries.concat(observer.takeRecords());
47 var expected = [{ 43 var expected = [{
48 boundingClientRect: coordinatesToClientRectJson(-42, 108, 58, 8), 44 boundingClientRect: coordinatesToClientRectJson(-42, 108, 58, 8),
49 intersectionRect: coordinatesToClientRectJson(0, 108, 58, 8), 45 intersectionRect: coordinatesToClientRectJson(0, 108, 58, 8),
50 rootBounds: "null", 46 rootBounds: "null",
51 target: target.id 47 target: target.id
52 }]; 48 }];
53 port.postMessage({actual: entries.map(entryToJson), expected: expected}, "*" ); 49 port.postMessage({actual: entries.map(entryToJson), expected: expected}, "*");
54 entries = []; 50 entries = [];
55 nextStep = step3; 51 nextStep = step3;
56 port.postMessage({scrollTo: 100}, "*"); 52 port.postMessage({scrollTo: 100}, "*");
57 });
58 } 53 }
59 54
60 function step3() { 55 function step3() {
61 setTimeout(function() { 56 entries = entries.concat(observer.takeRecords());
62 var expected = [{ 57 var expected = [{
63 boundingClientRect: coordinatesToClientRectJson(-42, 108, 58, 8), 58 boundingClientRect: coordinatesToClientRectJson(-42, 108, 58, 8),
64 intersectionRect: coordinatesToClientRectJson(0, 0, 0, 0), 59 intersectionRect: coordinatesToClientRectJson(0, 0, 0, 0),
65 rootBounds: "null", 60 rootBounds: "null",
66 target: target.id 61 target: target.id
67 }]; 62 }];
68 port.postMessage({actual: entries.map(entryToJson), expected: expected}, "*" ); 63 port.postMessage({actual: entries.map(entryToJson), expected: expected}, "*");
69 port.postMessage({DONE: 1}, "*"); 64 port.postMessage({DONE: 1}, "*");
70 });
71 } 65 }
72 66
73 function handleMessage(event) 67 function handleMessage(event)
74 { 68 {
75 port = event.source; 69 port = event.source;
76 nextStep(); 70 nextStep();
77 } 71 }
78 72
79 nextStep = step0; 73 nextStep = step0;
80 window.addEventListener("message", handleMessage); 74 window.addEventListener("message", handleMessage);
81 </script> 75 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698