1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/generic/test/page_scroll_with_fixed_pos_window.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,98 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<head>
1.7 + <title>Scrolling by pages with fixed-pos headers and footers</title>
1.8 + <style>
1.9 + .fp { position:fixed; left:0; width:100%; }
1.10 + .fp2 { position:fixed; left:0; width:100%; }
1.11 + </style>
1.12 +</head>
1.13 +<body onscroll="didScroll()" onload="test()">
1.14 +<div class="fp" id="top" style="top:0; height:10px; background:yellow;"></div>
1.15 +<div class="fp2" id="top2" style="top:10px; height:11px; background:blue;"></div>
1.16 +<div class="fp" style="top:50%; height:7px; background:cyan;"></div>
1.17 +<div class="fp2" id="bottom2" style="bottom:9px; height:12px; background:red;"></div>
1.18 +<div class="fp" id="bottom" style="bottom:0; height:13px; background:yellow;"></div>
1.19 +<p id="target">Something to click on to get focus
1.20 +<div style="height:3000px;"></div>
1.21 +<pre id="test">
1.22 +<script class="testbody">
1.23 +var SimpleTest = window.opener.SimpleTest;
1.24 +var SpecialPowers = window.opener.SpecialPowers;
1.25 +var is = window.opener.is;
1.26 +
1.27 +function showElements(show, classname) {
1.28 + var elements = document.getElementsByClassName(classname);
1.29 + for (var i = 0; i < elements.length; ++i) {
1.30 + elements[i].style.display = show ? '' : 'none';
1.31 + }
1.32 +}
1.33 +function showFixedPosElements(show) {
1.34 + showElements(show, "fp");
1.35 +}
1.36 +function showFixedPosElements2(show) {
1.37 + showElements(show, "fp2");
1.38 +}
1.39 +
1.40 +var nextCont;
1.41 +function didScroll() {
1.42 + var c = nextCont;
1.43 + nextCont = null;
1.44 + if (c) {
1.45 + c();
1.46 + }
1.47 +}
1.48 +
1.49 +function scrollDownOnePageWithContinuation(cont) {
1.50 + document.documentElement.scrollTop = 0;
1.51 + nextCont = cont;
1.52 + window.scrollByPages(1);
1.53 +}
1.54 +
1.55 +function test() {
1.56 + var smoothScrollPref = "general.smoothScroll";
1.57 + SpecialPowers.setBoolPref(smoothScrollPref, false);
1.58 +
1.59 + showFixedPosElements(false);
1.60 + showFixedPosElements2(false);
1.61 + scrollDownOnePageWithContinuation(function() {
1.62 + var fullPageScrollDown = document.documentElement.scrollTop;
1.63 +
1.64 + showFixedPosElements(true);
1.65 + scrollDownOnePageWithContinuation(function() {
1.66 + var fullPageScrollDownWithHeaderAndFooter = document.documentElement.scrollTop;
1.67 + is(fullPageScrollDownWithHeaderAndFooter, fullPageScrollDown - (10 + 13),
1.68 + "Reduce scroll distance by size of small header and footer");
1.69 +
1.70 + document.getElementById("bottom").style.height = (window.innerHeight - 20) + "px";
1.71 + scrollDownOnePageWithContinuation(function() {
1.72 + is(document.documentElement.scrollTop, fullPageScrollDown - 10,
1.73 + "Ignore really big elements when reducing scroll size");
1.74 + document.getElementById("bottom").style.height = "13px";
1.75 +
1.76 + document.getElementById("top").style.width = "100px";
1.77 + scrollDownOnePageWithContinuation(function() {
1.78 + is(document.documentElement.scrollTop, fullPageScrollDown - 13,
1.79 + "Ignore elements that don't span the entire viewport side");
1.80 + document.getElementById("top").style.width = "100%";
1.81 +
1.82 + showFixedPosElements2(true);
1.83 + scrollDownOnePageWithContinuation(function() {
1.84 + is(document.documentElement.scrollTop, fullPageScrollDown - (10 + 11 + 9 + 12),
1.85 + "Combine multiple overlapping elements");
1.86 +
1.87 + // Scroll back up so test results are visible
1.88 + document.documentElement.scrollTop = 0;
1.89 + SpecialPowers.clearUserPref(smoothScrollPref);
1.90 + SimpleTest.finish();
1.91 + window.close();
1.92 + });
1.93 + });
1.94 + });
1.95 + });
1.96 + });
1.97 +}
1.98 +</script>
1.99 +</pre>
1.100 +</body>
1.101 +</html>
