| <!DOCTYPE html> |
| <style> |
| body { |
| height: 2000px; |
| width: 2000px; |
| } |
| </style> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script> |
| var pageZoomFactor = 1.25; |
| var pageScaleFactor = 2; |
| var scrollbarThicknessInCSSPixels; |
| |
| function viewport() { |
| return window.visualViewport; |
| } |
| |
| var test = async_test('Verify viewport dimensions exclude scrollbars.'); |
| |
| var doAfterZooming = test.step_func(function() { |
| window.scrollTo(0, 0); |
| scrollbarThicknessInCSSPixels /= pageScaleFactor; |
| |
| assert_equals( |
| viewport().width, |
| 800 / pageScaleFactor - scrollbarThicknessInCSSPixels, |
| "Width with page scale"); |
| assert_equals( |
| viewport().height, |
| 600 / pageScaleFactor - scrollbarThicknessInCSSPixels, |
| "Height with page scale"); |
| |
| window.internals.setPageZoomFactor(pageZoomFactor); |
| |
| // Since the scrollbars don't change size to the user with page zoom, |
| // they're actually smaller in CSS pixels. |
| scrollbarThicknessInCSSPixels /= pageZoomFactor; |
| assert_equals( |
| viewport().width, |
| 800 / pageScaleFactor / pageZoomFactor - scrollbarThicknessInCSSPixels, |
| "Width with page scale and page zoom"); |
| assert_equals( |
| viewport().height, |
| 600 / pageScaleFactor / pageZoomFactor - scrollbarThicknessInCSSPixels, |
| "Height with page scale and page zoom"); |
| test.done(); |
| }); |
| |
| function getUIScript() { |
| return `(function() { |
| uiController.zoomToScale(${pageScaleFactor}, function() { |
| uiController.uiScriptComplete(uiController.zoomScale); |
| }); |
| })();`; |
| } |
| |
| window.onload = function() { |
| scrollbarThicknessInCSSPixels = window.innerWidth - document.documentElement.clientWidth; |
| testRunner.runUIScript(getUIScript(), function(zoomScale) { |
| doAfterZooming(); |
| }); |
| }; |
| </script> |
