third_party/WebKit/LayoutTests/fast/scroll-behavior/main-frame-pinch-scrollTo.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <style>
   5     body {
   6       height:800px;
   7       width: 600px;
   8     }
   9   </style>
  10   <script src="../../resources/testharness.js"></script>
  11   <script src="../../resources/testharnessreport.js"></script>
  12   <script src="resources/scroll-behavior-test.js"></script>
  13   <script type="text/javascript">
  14     var maxScrollHeight;
  15     var maxScrollWidth;
  16
  17     function getEndPosition(testCase, startPosition) {
  18       var endPosition = {};
  19       // If the pageScaleFactor is set to 1, it means that there is no pinch-zoom,
  20       // i.e. the endPosition = max scroll.
  21       if (testCase.x) {
  22         if (testCase.pageScaleFactor == 1) {
  23           endPosition.x = maxScrollWidth;
  24         } else {
  25           endPosition.x = testCase.x;
  26         }
  27       } else {
  28         endPosition.x = startPosition.x;
  29       }
  30
  31       if (testCase.y) {
  32         if (testCase.pageScaleFactor == 1) {
  33           endPosition.y = maxScrollHeight;
  34         } else {
  35           endPosition.y = testCase.y;
  36         }
  37       } else {
  38         endPosition.y = startPosition.y;
  39       }
  40
  41       return endPosition;
  42     }
  43
  44     function jsScroll(testCase) {
  45       if (testCase.js) {
  46         var scrollToOptions = {behavior: testCase.js};
  47         if (testCase.x)
  48           scrollToOptions.left = testCase.x;
  49         if (testCase.y)
  50           scrollToOptions.top = testCase.y;
  51         document.scrollingElement.scrollTo(scrollToOptions);
  52       } else {
  53         document.scrollingElement.scrollTo(testCase.x, testCase.y);
  54       }
  55     }
  56
  57     const testScrolls = [
  58       {js: "smooth", css: "smooth", x: 0, y: 1000, pageScaleFactor: 1},
  59       {js: "smooth", css: "smooth", x: 10, y: 400, pageScaleFactor: 4},
  60       {js: "instant", css: "instant", x: 0, y: 1000, pageScaleFactor: 1},
  61       {js: "instant", css: "instant", x: 10, y: 400, pageScaleFactor: 4},
  62     ];
  63
  64     function doTest()
  65     {
  66       var testCases = [];
  67       maxScrollHeight = document.scrollingElement.scrollHeight - window.innerHeight;
  68       maxScrollWidth = document.scrollingElement.scrollWidth - window.innerWidth;
  69
  70       for (var i = 0; i < testScrolls.length; i++) {
  71         testCases.push(new ScrollBehaviorTestCase(testScrolls[i]));
  72       }
  73
  74       var scrollBehaviorTest = new ScrollBehaviorTest(document.scrollingElement,
  75                                                       document,
  76                                                       testCases,
  77                                                       getEndPosition,
  78                                                       jsScroll);
  79       scrollBehaviorTest.run();
  80     }
  81
  82     window.addEventListener('load', doTest, false);
  83   </script>
  84 </head>
  85
  86 <body>
  87   <p>Test that scrollTo works on the visual viewport.</p>
  88   <div id="content"></div>
  89 </body>
  90 </html>