LayoutTests/fast/events/scale-and-scroll-body.html

   1 <html>
   2 <head>
   3     <style>
   4         ::-webkit-scrollbar {
   5             width: 0px;
   6             height: 0px;
   7         }
   8     </style>
   9     <script>
  10       window.enablePixelTesting = true;
  11
  12       function scrollViaJavascript() {
  13           var scaleFactor = 2.0;
  14           if (window.internals) {
  15              window.internals.settings.setPageScaleFactor(scaleFactor, 0, 0);
  16           }
  17
  18           // The page scale, as set by window.internals.settings.setPageScaleFactor should not be apparent
  19           // to javascript. So, we expect scrolling to (100,100) to be page coordinates, rather
  20           // than device pixels.
  21           document.body.scrollLeft = 100;
  22           document.body.scrollTop = 100;
  23
  24           shouldBe("window.document.body.scrollTop", "100");
  25           shouldBe("window.document.body.scrollLeft", "100");
  26           shouldBe("window.scrollX", "100");
  27           shouldBe("window.scrollY", "100");
  28       }
  29
  30       function scrollViaSetScaleFactor() {
  31           if (window.internals) {
  32               // Test that the scroll offset changes even if scaleFactor remains
  33               // the same.
  34               window.internals.settings.setPageScaleFactor(1, 30, 30);
  35               shouldBe("window.document.body.scrollTop", "30");
  36               shouldBe("window.document.body.scrollLeft", "30");
  37           }
  38       }
  39
  40       function test() {
  41           scrollViaSetScaleFactor();
  42           scrollViaJavascript();
  43       }
  44     </script>
  45     <script src="../js/resources/js-test-pre.js"></script>
  46 </head>
  47 <body style="width:2000px; height:2000px; margin:0px;" onload="test();">
  48     <div style="left:0; top:0; width:100px; height:100px; position:absolute; background:yellow;"></div>
  49     <div style="left:100px; top:0; width:100px; height:100px; position:absolute; background:green;"></div>
  50     <div style="left:200px; top:0; width:100px; height:100px; position:absolute; background:blue;"></div>
  51
  52     <div style="left:0; top:100px; width:100px; height:100px; position:absolute; background: green;"></div>
  53     <div style="left:100px; top:100px; width:100px; height:100px; position:absolute; background:blue;"></div>
  54     <div style="left:200px; top:100px; width:100px; height:100px; position:absolute; background:yellow;"></div>
  55
  56     <div id="console"></div>
  57 </body>
  58 </html>