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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/LayoutTests/intersection-observer/edge-inclusive-intersection.html

Issue 1983383002: Convert IntersectionObserver tests to use testRunner.runIdleTasks. (Closed) Base URL: https://chromium.googlesource.com/chromium/src@master
Patch Set: rebase Created 4 years, 7 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
« no previous file with comments | « third_party/WebKit/LayoutTests/intersection-observer/containing-block.html ('k') | third_party/WebKit/LayoutTests/intersection-observer/helper-functions.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <script src="../resources/js-test.js"></script> 2 <script src="../resources/js-test.js"></script>
3 <script src="helper-functions.js"></script> 3 <script src="../resources/intersection-observer-helper-functions.js"></script>
4 <style> 4 <style>
5 #root { 5 #root {
6 width: 200px; 6 width: 200px;
7 height: 200px; 7 height: 200px;
8 overflow: visible; 8 overflow: visible;
9 } 9 }
10 #target { 10 #target {
11 background-color: green; 11 background-color: green;
12 } 12 }
13 </style> 13 </style>
14 <div id="root"> 14 <div id="root">
15 <div id="target" style="width: 100px; height: 100px; transform: translateY(250 px)"></div> 15 <div id="target" style="width: 100px; height: 100px; transform: translateY(250 px)"></div>
16 </div> 16 </div>
17 17
18 <script> 18 <script>
19 description("Verifies that IntersectionObserver detects edge-inclusive intersect ions."); 19 description("Verifies that IntersectionObserver detects edge-inclusive intersect ions.");
20 var root = document.getElementById('root'); 20 var root = document.getElementById('root');
21 var target = document.getElementById('target'); 21 var target = document.getElementById('target');
22 var entries = []; 22 var entries = [];
23 var observer = new IntersectionObserver( 23 var observer = new IntersectionObserver(
24 changes => { entries.push(...changes) }, 24 changes => { entries.push(...changes) },
25 { root: root } 25 { root: root }
26 ); 26 );
27 27
28 onload = function() { 28 onload = function() {
29 observer.observe(target); 29 observer.observe(target);
30 entries.push(...observer.takeRecords()); 30 entries.push(...observer.takeRecords());
31 shouldBeEqualToNumber("entries.length", 0); 31 shouldBeEqualToNumber("entries.length", 0);
32 requestAnimationFrame(() => { requestAnimationFrame(step0) }); 32 waitForNotification(step0);
33 }; 33 };
34 34
35 function step0() { 35 function step0() {
36 entries.push(...observer.takeRecords());
37 shouldBeEqualToNumber("entries.length", 0); 36 shouldBeEqualToNumber("entries.length", 0);
37 waitForNotification(step1);
38 target.style.transform = "translateY(200px)"; 38 target.style.transform = "translateY(200px)";
39 requestAnimationFrame(step1);
40 } 39 }
41 40
42 function step1() { 41 function step1() {
43 entries.push(...observer.takeRecords());
44 shouldBeEqualToNumber("entries.length", 1); 42 shouldBeEqualToNumber("entries.length", 1);
45 if (entries.length > 0) { 43 if (entries.length > 0) {
46 shouldBeEqualToNumber("entries[0].boundingClientRect.left", 8); 44 shouldBeEqualToNumber("entries[0].boundingClientRect.left", 8);
47 shouldBeEqualToNumber("entries[0].boundingClientRect.right", 108); 45 shouldBeEqualToNumber("entries[0].boundingClientRect.right", 108);
48 shouldBeEqualToNumber("entries[0].boundingClientRect.top", 208); 46 shouldBeEqualToNumber("entries[0].boundingClientRect.top", 208);
49 shouldBeEqualToNumber("entries[0].boundingClientRect.bottom", 308); 47 shouldBeEqualToNumber("entries[0].boundingClientRect.bottom", 308);
50 shouldBeEqualToNumber("entries[0].intersectionRect.left", 8); 48 shouldBeEqualToNumber("entries[0].intersectionRect.left", 8);
51 shouldBeEqualToNumber("entries[0].intersectionRect.right", 108); 49 shouldBeEqualToNumber("entries[0].intersectionRect.right", 108);
52 shouldBeEqualToNumber("entries[0].intersectionRect.top", 208); 50 shouldBeEqualToNumber("entries[0].intersectionRect.top", 208);
53 shouldBeEqualToNumber("entries[0].intersectionRect.bottom", 208); 51 shouldBeEqualToNumber("entries[0].intersectionRect.bottom", 208);
54 shouldBeEqualToNumber("entries[0].rootBounds.left", 8); 52 shouldBeEqualToNumber("entries[0].rootBounds.left", 8);
55 shouldBeEqualToNumber("entries[0].rootBounds.right", 208); 53 shouldBeEqualToNumber("entries[0].rootBounds.right", 208);
56 shouldBeEqualToNumber("entries[0].rootBounds.top", 8); 54 shouldBeEqualToNumber("entries[0].rootBounds.top", 8);
57 shouldBeEqualToNumber("entries[0].rootBounds.bottom", 208); 55 shouldBeEqualToNumber("entries[0].rootBounds.bottom", 208);
58 shouldEvaluateToSameObject("entries[0].target", target); 56 shouldEvaluateToSameObject("entries[0].target", target);
59 } 57 }
58 waitForNotification(step2);
60 target.style.transform = "translateY(201px)"; 59 target.style.transform = "translateY(201px)";
61 requestAnimationFrame(step2);
62 } 60 }
63 61
64 function step2() { 62 function step2() {
65 entries.push(...observer.takeRecords());
66 shouldBeEqualToNumber("entries.length", 2); 63 shouldBeEqualToNumber("entries.length", 2);
64 waitForNotification(step3);
67 target.style.height = "0px"; 65 target.style.height = "0px";
68 target.style.width = "300px"; 66 target.style.width = "300px";
69 target.style.transform = "translateY(185px)"; 67 target.style.transform = "translateY(185px)";
70 requestAnimationFrame(step3);
71 } 68 }
72 69
73 function step3() { 70 function step3() {
74 entries.push(...observer.takeRecords());
75 shouldBeEqualToNumber("entries.length", 3); 71 shouldBeEqualToNumber("entries.length", 3);
76 if (entries.length > 2) { 72 if (entries.length > 2) {
77 shouldBeEqualToNumber("entries[2].boundingClientRect.left", 8); 73 shouldBeEqualToNumber("entries[2].boundingClientRect.left", 8);
78 shouldBeEqualToNumber("entries[2].boundingClientRect.right", 308); 74 shouldBeEqualToNumber("entries[2].boundingClientRect.right", 308);
79 shouldBeEqualToNumber("entries[2].boundingClientRect.top", 193); 75 shouldBeEqualToNumber("entries[2].boundingClientRect.top", 193);
80 shouldBeEqualToNumber("entries[2].boundingClientRect.bottom", 193); 76 shouldBeEqualToNumber("entries[2].boundingClientRect.bottom", 193);
81 shouldBeEqualToNumber("entries[2].intersectionRect.left", 8); 77 shouldBeEqualToNumber("entries[2].intersectionRect.left", 8);
82 shouldBeEqualToNumber("entries[2].intersectionRect.right", 208); 78 shouldBeEqualToNumber("entries[2].intersectionRect.right", 208);
83 shouldBeEqualToNumber("entries[2].intersectionRect.top", 193); 79 shouldBeEqualToNumber("entries[2].intersectionRect.top", 193);
84 shouldBeEqualToNumber("entries[2].intersectionRect.bottom", 193); 80 shouldBeEqualToNumber("entries[2].intersectionRect.bottom", 193);
85 shouldBeEqualToNumber("entries[2].rootBounds.left", 8); 81 shouldBeEqualToNumber("entries[2].rootBounds.left", 8);
86 shouldBeEqualToNumber("entries[2].rootBounds.right", 208); 82 shouldBeEqualToNumber("entries[2].rootBounds.right", 208);
87 shouldBeEqualToNumber("entries[2].rootBounds.top", 8); 83 shouldBeEqualToNumber("entries[2].rootBounds.top", 8);
88 shouldBeEqualToNumber("entries[2].rootBounds.bottom", 208); 84 shouldBeEqualToNumber("entries[2].rootBounds.bottom", 208);
89 shouldEvaluateToSameObject("entries[2].target", target); 85 shouldEvaluateToSameObject("entries[2].target", target);
90 } 86 }
91 finishJSTest(); 87 finishJSTest();
92 } 88 }
93 </script> 89 </script>
OLDNEW
« no previous file with comments | « third_party/WebKit/LayoutTests/intersection-observer/containing-block.html ('k') | third_party/WebKit/LayoutTests/intersection-observer/helper-functions.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698