layout/generic/test/page_scroll_with_fixed_pos_window.html@6474c204b198
layout/generic/test/page_scroll_with_fixed_pos_window.html
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <title>Scrolling by pages with fixed-pos headers and footers</title>
5 <style>
6 .fp { position:fixed; left:0; width:100%; }
7 .fp2 { position:fixed; left:0; width:100%; }
8 </style>
9 </head>
10 <body onscroll="didScroll()" onload="test()">
11 <div class="fp" id="top" style="top:0; height:10px; background:yellow;"></div>
12 <div class="fp2" id="top2" style="top:10px; height:11px; background:blue;"></div>
13 <div class="fp" style="top:50%; height:7px; background:cyan;"></div>
14 <div class="fp2" id="bottom2" style="bottom:9px; height:12px; background:red;"></div>
15 <div class="fp" id="bottom" style="bottom:0; height:13px; background:yellow;"></div>
16 <p id="target">Something to click on to get focus
17 <div style="height:3000px;"></div>
18 <pre id="test">
19 <script class="testbody">
20 var SimpleTest = window.opener.SimpleTest;
21 var SpecialPowers = window.opener.SpecialPowers;
22 var is = window.opener.is;
24 function showElements(show, classname) {
25 var elements = document.getElementsByClassName(classname);
26 for (var i = 0; i < elements.length; ++i) {
27 elements[i].style.display = show ? '' : 'none';
28 }
29 }
30 function showFixedPosElements(show) {
31 showElements(show, "fp");
32 }
33 function showFixedPosElements2(show) {
34 showElements(show, "fp2");
35 }
37 var nextCont;
38 function didScroll() {
39 var c = nextCont;
40 nextCont = null;
41 if (c) {
42 c();
43 }
44 }
46 function scrollDownOnePageWithContinuation(cont) {
47 document.documentElement.scrollTop = 0;
48 nextCont = cont;
49 window.scrollByPages(1);
50 }
52 function test() {
53 var smoothScrollPref = "general.smoothScroll";
54 SpecialPowers.setBoolPref(smoothScrollPref, false);
56 showFixedPosElements(false);
57 showFixedPosElements2(false);
58 scrollDownOnePageWithContinuation(function() {
59 var fullPageScrollDown = document.documentElement.scrollTop;
61 showFixedPosElements(true);
62 scrollDownOnePageWithContinuation(function() {
63 var fullPageScrollDownWithHeaderAndFooter = document.documentElement.scrollTop;
64 is(fullPageScrollDownWithHeaderAndFooter, fullPageScrollDown - (10 + 13),
65 "Reduce scroll distance by size of small header and footer");
67 document.getElementById("bottom").style.height = (window.innerHeight - 20) + "px";
68 scrollDownOnePageWithContinuation(function() {
69 is(document.documentElement.scrollTop, fullPageScrollDown - 10,
70 "Ignore really big elements when reducing scroll size");
71 document.getElementById("bottom").style.height = "13px";
73 document.getElementById("top").style.width = "100px";
74 scrollDownOnePageWithContinuation(function() {
75 is(document.documentElement.scrollTop, fullPageScrollDown - 13,
76 "Ignore elements that don't span the entire viewport side");
77 document.getElementById("top").style.width = "100%";
79 showFixedPosElements2(true);
80 scrollDownOnePageWithContinuation(function() {
81 is(document.documentElement.scrollTop, fullPageScrollDown - (10 + 11 + 9 + 12),
82 "Combine multiple overlapping elements");
84 // Scroll back up so test results are visible
85 document.documentElement.scrollTop = 0;
86 SpecialPowers.clearUserPref(smoothScrollPref);
87 SimpleTest.finish();
88 window.close();
89 });
90 });
91 });
92 });
93 });
94 }
95 </script>
96 </pre>
97 </body>
98 </html>
