Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code | Sign in
(69)

Delta Between Two Patch Sets: LayoutTests/imported/w3c/web-platform-tests/intersection-observer/multiple-targets.html

Issue 359780043: WIP for IO
Left Patch Set: Cleaned up root parsing Created 5 years, 8 months ago
Right Patch Set: 22 tests pass Created 5 years, 8 months ago
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments. Please Sign in to add in-line comments.
Jump to:
Right: Side by side diff | Download
LEFTRIGHT
(no file at all)
1 <!DOCTYPE html>
2 <script src="/resources/testharness.js"></script>
3 <script src="/resources/testharnessreport.js"></script>
4 <script src="./resources/intersection-observer-test-utils.js"></script>
5
6 <style>
7 pre, #log {
8 position: absolute;
9 top: 0;
10 left: 200px;
11 }
12 .spacer {
13 height: calc(100vh + 100px);
14 }
15 .target {
16 width: 100px;
17 height: 100px;
18 margin: 10px;
19 background-color: green;
20 }
21 </style>
22
23 <div class="spacer"></div>
24 <div id="target1" class="target"></div>
25 <div id="target2" class="target"></div>
26 <div id="target3" class="target"></div>
27
28 <script>
29 var entries = [];
30 var target1, target2, target3;
31
32 runTestCycle(function() {
33 target1 = document.getElementById("target1");
34 assert_true(!!target1, "target1 exists.");
35 target2 = document.getElementById("target2");
36 assert_true(!!target2, "target2 exists.");
37 target3 = document.getElementById("target3");
38 assert_true(!!target3, "target3 exists.");
39 var observer = new IntersectionObserver(function(changes) {
40 entries = entries.concat(changes)
41 });
42 observer.observe(target1);
43 observer.observe(target2);
44 observer.observe(target3);
45 entries = entries.concat(observer.takeRecords());
46 assert_equals(entries.length, 0, "No initial notifications.");
47 runTestCycle(step0, "First rAF.");
48 }, "One observer with multiple targets.");
49
50 function step0() {
51 document.scrollingElement.scrollTop = 150;
52 runTestCycle(step1, "document.scrollingElement.scrollTop = 150");
53 assert_equals(entries.length, 3, "Three initial notifications.");
54 assert_equals(entries[0].target, target1, "entries[0].target === target1");
55 assert_equals(entries[1].target, target2, "entries[1].target === target2");
56 assert_equals(entries[2].target, target3, "entries[2].target === target3");
57 }
58
59 function step1() {
60 document.scrollingElement.scrollTop = 10000;
61 runTestCycle(step2, "document.scrollingElement.scrollTop = 10000");
62 assert_equals(entries.length, 4, "Four notifications.");
63 assert_equals(entries[3].target, target1, "entries[3].target === target1");
64 }
65
66 function step2() {
67 document.scrollingElement.scrollTop = 0;
68 runTestCycle(step3, "document.scrollingElement.scrollTop = 0");
69 assert_equals(entries.length, 6, "Six notifications.");
70 assert_equals(entries[4].target, target2, "entries[4].target === target2");
71 assert_equals(entries[5].target, target3, "entries[5].target === target3");
72 }
73
74 function step3() {
75 assert_equals(entries.length, 9, "Nine notifications.");
76 assert_equals(entries[6].target, target1, "entries[6].target === target1");
77 assert_equals(entries[7].target, target2, "entries[7].target === target2");
78 assert_equals(entries[8].target, target3, "entries[8].target === target3");
79 }
80 </script>
LEFTRIGHT

Powered by Google App Engine
RSS Feeds Recent Issues | This issue
This is Rietveld f62528b