| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <script src="../../../resources/js-test.js"></script> |
| <style> |
| body { |
| padding: 0px; |
| margin: 0px; |
| } |
| |
| .spacer { |
| position: absolute; |
| left: 0px; |
| top: 0px; |
| margin: 0px; |
| padding: 0px; |
| width: 2000px; |
| height: 1500px; |
| } |
| </style> |
| <script language="JavaScript" type="text/javascript"> |
| if (window.testRunner && window.internals) { |
| window.internals.setPageScaleFactorLimits(0.5, 4.0); |
| window.jsTestIsAsync = true; |
| testRunner.dumpAsText(); |
| testRunner.waitUntilDone(); |
| } |
| |
| description("This test makes sure the window properties related to the\ |
| viewport remain correct under pinch-to-zoom."); |
| |
| debug('===Unscaled==='); |
| debug(''); |
| shouldBe('window.innerWidth', '800'); |
| shouldBe('window.innerHeight', '600'); |
| |
| function testPinchedIn() { |
| debug(''); |
| debug('===Pinch Zoom in to 2X==='); |
| debug(''); |
| window.internals.setPageScaleFactor(2.0); |
| shouldBe('window.innerWidth', '400'); |
| shouldBe('window.innerHeight', '300'); |
| shouldBe('window.scrollX', '0'); |
| shouldBe('window.scrollY', '0'); |
| |
| window.scrollBy(10, 20); |
| shouldBe('window.scrollX', '10'); |
| shouldBe('window.scrollY', '20'); |
| window.scrollBy(1590, 1180); |
| shouldBe('window.scrollX', '1600'); |
| shouldBe('window.scrollY', '1200'); |
| window.scrollBy(-1600, -1200); |
| shouldBe('window.scrollX', '0'); |
| shouldBe('window.scrollY', '0'); |
| window.scrollTo(1600, 1200); |
| shouldBe('window.scrollX', '1600'); |
| shouldBe('window.scrollY', '1200'); |
| window.scrollTo(0, 0); |
| shouldBe('window.scrollX', '0'); |
| shouldBe('window.scrollY', '0'); |
| } |
| |
| function testMaximallyPinchedOut() { |
| debug(''); |
| debug('===Pinch Out to 0.5X==='); |
| debug(''); |
| window.internals.setPageScaleFactor(0.5); |
| shouldBe('window.innerWidth', '1600'); |
| shouldBe('window.innerHeight', '1200'); |
| shouldBe('window.scrollX', '0'); |
| shouldBe('window.scrollY', '0'); |
| |
| window.scrollBy(10, 20); |
| shouldBe('window.scrollX', '10'); |
| shouldBe('window.scrollY', '20'); |
| window.scrollBy(390, 280); |
| shouldBe('window.scrollX', '400'); |
| shouldBe('window.scrollY', '300'); |
| window.scrollBy(-400, -300); |
| shouldBe('window.scrollX', '0'); |
| shouldBe('window.scrollY', '0'); |
| window.scrollTo(400, 300); |
| shouldBe('window.scrollX', '400'); |
| shouldBe('window.scrollY', '300'); |
| window.scrollTo(0, 0); |
| shouldBe('window.scrollX', '0'); |
| shouldBe('window.scrollY', '0'); |
| } |
| |
| function testOnScroll() { |
| debug(''); |
| debug('===Test OnScroll==='); |
| debug(''); |
| window.internals.setPageScaleFactor(1.0); |
| shouldBe('window.innerWidth', '800'); |
| shouldBe('window.innerHeight', '600'); |
| shouldBe('window.scrollX', '0'); |
| shouldBe('window.scrollY', '0'); |
| |
| // First scroll scrolls only the outer viewport. |
| // Second scrolls the outer and the inner. |
| // Third scrolls only the inner. |
| var scrolls = [100, 400, 100]; |
| var numScrollsReceived = 0; |
| var numRAFCalls = 0; |
| |
| document.onscroll = function() { |
| if (numRAFCalls == 0) |
| return; |
| |
| ++numScrollsReceived; |
| debug('PASS OnScroll called for scroll #' + numScrollsReceived); |
| if (numScrollsReceived < scrolls.length) { |
| var scrollAmount = scrolls[numScrollsReceived]; |
| window.scrollBy(scrollAmount, 0); |
| } else if (numScrollsReceived == scrolls.length) { |
| // Make sure scrollTo that moves only the inner viewport also |
| // triggers a scroll event. |
| window.scrollTo(1200, 0); |
| } else { |
| debug(''); |
| finishJSTest(); |
| } |
| } |
| |
| // Scroll events are fired right before RAF so this is a good place to |
| // make sure event was handled. |
| var failureSentinel = function() { |
| if (numRAFCalls == 0) { |
| window.scrollBy(scrolls[0], 0); |
| }else if (numRAFCalls > numScrollsReceived) { |
| testFailed("Failed to receive scroll event #" + (numScrollsReceived+1)); |
| finishJSTest(); |
| } |
| ++numRAFCalls; |
| window.requestAnimationFrame(failureSentinel); |
| } |
| |
| window.requestAnimationFrame(failureSentinel); |
| } |
| |
| function forceLayout() { |
| window.scrollTo(0, 0); |
| } |
| |
| function runTests() { |
| if (window.testRunner && window.internals) { |
| forceLayout(); |
| testPinchedIn(); |
| testMaximallyPinchedOut(); |
| testOnScroll(); |
| } |
| } |
| |
| onload = runTests; |
| </script> |
| <div class="spacer"></div> |
