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

Side by Side Diff: LayoutTests/imported/w3c/web-platform-tests/intersection-observer/containing-block.html

Issue 359780043: WIP for IO
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:
View unified diff | Download patch
OLDNEW
(Empty)
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 #root {
13 width: 170px;
14 height: 200px;
15 overflow-y: scroll;
16 }
17 #target {
18 width: 100px;
19 height: 100px;
20 background-color: green;
21 position: absolute;
22 }
23 </style>
24
25 <div id="root" style="position: absolute">
26 <div id="target" style="left: 50px; top: 250px"></div>
27 </div>
28
29 <script>
30 var entries = [];
31 var root, target;
32
33 runTestCycle(function() {
34 root = document.getElementById("root");
35 assert_true(!!root, "root element exists.");
36 target = document.getElementById("target");
37 assert_true(!!target, "target element exists.");
38 var observer = new IntersectionObserver(function(changes) {
39 entries = entries.concat(changes);
40 }, { root: root });
41 observer.observe(target);
42 entries = entries.concat(observer.takeRecords());
43 assert_equals(entries.length, 0, "No initial notifications.");
44 target.style.top = "10px";
45 runTestCycle(test1, "In containing block and intersecting.");
46 }, "IntersectionObserver should only report intersections if root is a containin g block ancestor of target.");
47
48 function test1() {
49 runTestCycle(test2, "In containing block and not intersecting.");
50 var rootBounds = contentBounds(root);
51 checkLastEntry(entries, 0, [58, 158, 18, 118, 58, 158, 18, 118].concat(rootBou nds));
52 target.style.top = "250px";
53 }
54
55 function test2() {
56 runTestCycle(test3, "Not in containing block and intersecting.");
57 var rootBounds = contentBounds(root);
58 checkLastEntry(entries, 1, [58, 158, 258, 358, 0, 0, 0, 0].concat(rootBounds)) ;
59 root.style.position = "static";
60 target.style.top = "10px";
61 }
62
63 function test3() {
64 runTestCycle(test4, "Not in containing block and not intersecting.");
65 checkLastEntry(entries, 1);
66 target.style.top = "250px";
67 }
68
69 function test4() {
70 checkLastEntry(entries, 1);
71 target.style.top = "0";
72 }
73 </script>
OLDNEW

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