Index: third_party/WebKit/LayoutTests/fast/dom/Window/window-scaled-viewport-properties.html |
diff --git a/third_party/WebKit/LayoutTests/fast/dom/Window/window-scaled-viewport-properties.html b/third_party/WebKit/LayoutTests/fast/dom/Window/window-scaled-viewport-properties.html |
index 790c0bfbb22286ea447e149c71c4098e7f569773..d7dd7eeaac4a6ca0b9ee713dd0d298cf7a898947 100644 |
--- a/third_party/WebKit/LayoutTests/fast/dom/Window/window-scaled-viewport-properties.html |
+++ b/third_party/WebKit/LayoutTests/fast/dom/Window/window-scaled-viewport-properties.html |
@@ -1,9 +1,12 @@ |
-<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
+<!DOCTYPE html> |
<script src="../../../resources/js-test.js"></script> |
<style> |
body { |
padding: 0px; |
margin: 0px; |
+ /* Overflow hidden so that the size of the scrollbar is not added to |
+ the innerHeight/Width properties. */ |
+ overflow: hidden; |
} |
.spacer { |
@@ -18,136 +21,111 @@ |
</style> |
<script language="JavaScript" type="text/javascript"> |
if (window.testRunner && window.internals) { |
+ // Note that the layout viewport is based on the minimum page scale. |
+ // Thus, the minimum scale of 0.5 causes the layout viewport to become |
+ // twice of what we would normally expect. |
window.internals.setPageScaleFactorLimits(0.5, 4.0); |
window.jsTestIsAsync = true; |
testRunner.dumpAsText(); |
testRunner.waitUntilDone(); |
+ setPrintTestResultsLazily(); |
} |
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==='); |
+ function testUnscaled () { |
bokan
2015/10/21 15:23:06
Nit: Function name too :)
ymalik
2015/10/21 16:29:27
Oops. Totally my carelessness. Done :)
|
+ debug('===Initial Scale==='); |
debug(''); |
- window.internals.setPageScaleFactor(2.0); |
- shouldBe('window.innerWidth', '400'); |
- shouldBe('window.innerHeight', '300'); |
- shouldBe('window.scrollX', '0'); |
- shouldBe('window.scrollY', '0'); |
+ shouldBe('window.innerWidth', '1600'); |
+ shouldBe('window.innerHeight', '1200'); |
+ shouldBe('internals.visualViewportWidth()', '1600'); |
+ shouldBe('internals.visualViewportHeight()', '1200'); |
+ } |
- 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'); |
+ function jsScrollTo(x, y) { |
+ window.scrollTo(x, y); |
+ } |
+ |
+ function jsScrollBy(x, y) { |
+ window.scrollBy(x, y); |
+ } |
+ |
+ function testScrolls(jsScroll) { |
+ // Test that the layout and visual viewport viewport scroll. |
+ jsScroll(100, 200); |
+ shouldBe('window.scrollX', '100'); |
+ shouldBe('window.scrollY', '200'); |
+ shouldBe('internals.visualViewportScrollX()', '100'); |
+ shouldBe('internals.visualViewportScrollY()', '200'); |
+ |
+ // Test that the scroll doesn't bubble to the visual viewport. |
+ jsScroll(1500, 1100); |
+ shouldBe('window.scrollX', '400'); |
+ shouldBe('window.scrollY', '300'); |
+ shouldBe('internals.visualViewportScrollX()', '400'); |
+ shouldBe('internals.visualViewportScrollY()', '300'); |
+ |
+ // Reset. |
window.scrollTo(0, 0); |
shouldBe('window.scrollX', '0'); |
shouldBe('window.scrollY', '0'); |
} |
- function testMaximallyPinchedOut() { |
+ function testPinchedIn() { |
debug(''); |
- debug('===Pinch Out to 0.5X==='); |
+ debug('===Pinch Zoom in to 2X==='); |
debug(''); |
- window.internals.setPageScaleFactor(0.5); |
+ window.internals.setPageScaleFactor(2.0); |
+ // Test that the innerWidth, innerHeight, scrollX, scrollY are relative |
+ // to the layout viewport after page scale. |
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'); |
+ // Test that the visual viewport size changes after page scale. |
+ shouldBe('internals.visualViewportWidth()', '400'); |
+ shouldBe('internals.visualViewportHeight()', '300'); |
+ |
+ debug('===ScrollBy==='); |
+ testScrolls(jsScrollBy); |
+ debug('===ScrollTo==='); |
+ testScrolls(jsScrollTo); |
} |
- function testOnScroll() { |
+ function testMaximallyPinchedOut() { |
debug(''); |
- debug('===Test OnScroll==='); |
+ debug('===Pinch Out to 0.5X==='); |
debug(''); |
- window.internals.setPageScaleFactor(1.0); |
- shouldBe('window.innerWidth', '800'); |
- shouldBe('window.innerHeight', '600'); |
+ window.internals.setPageScaleFactor(0.5); |
+ shouldBe('window.innerWidth', '1600'); |
+ shouldBe('window.innerHeight', '1200'); |
shouldBe('window.scrollX', '0'); |
shouldBe('window.scrollY', '0'); |
+ shouldBe('internals.visualViewportWidth()', '1600'); |
+ shouldBe('internals.visualViewportHeight()', '1200'); |
- // 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); |
+ debug('===ScrollBy==='); |
+ testScrolls(jsScrollBy); |
+ debug('===ScrollTo==='); |
+ testScrolls(jsScrollTo); |
} |
function forceLayout() { |
- window.scrollTo(0, 0); |
+ window.scrollX; |
} |
function runTests() { |
if (window.testRunner && window.internals) { |
+ // TODO(ymalik): The call to setPageScaleFactorLimits should force |
+ // layout. Fix that instead of forcing layout here. |
forceLayout(); |
+ testUnscaled(); |
testPinchedIn(); |
testMaximallyPinchedOut(); |
- testOnScroll(); |
+ finishJSTest(); |
} |
} |