WebKit Bugzilla
Attachment 370287 Details for
Bug 198062
: [iOS] Layout viewport size on google.com increases after rotating to landscape and back
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Requests
|
Help
|
New Account
|
Log In
Remember
[x]
|
Forgot Password
Login:
[x]
[patch]
Patch
bug-198062-20190520174752.patch (text/plain), 8.51 KB, created by
Wenson Hsieh
on 2019-05-20 17:47:53 PDT
(
hide
)
Description:
Patch
Filename:
MIME Type:
Creator:
Wenson Hsieh
Created:
2019-05-20 17:47:53 PDT
Size:
8.51 KB
patch
obsolete
>Subversion Revision: 245472 >diff --git a/Source/WebKit/ChangeLog b/Source/WebKit/ChangeLog >index 57d00f4ec8530695b21622a539b0956113177307..df63eb110a55092788f4b903dc718c08c6eee95a 100644 >--- a/Source/WebKit/ChangeLog >+++ b/Source/WebKit/ChangeLog >@@ -1,3 +1,28 @@ >+2019-05-20 Wenson Hsieh <wenson_hsieh@apple.com> >+ >+ [iOS] Layout viewport size on google.com increases after rotating to landscape and back >+ https://bugs.webkit.org/show_bug.cgi?id=198062 >+ <rdar://problem/50547895> >+ >+ Reviewed by NOBODY (OOPS!). >+ >+ During an animated resize (e.g. when rotating the device on iOS), we currently immediately trigger the new >+ shrink-to-fit content size heuristic in the middle of dynamicViewportSizeUpdate, after the new view layout size >+ has been applied to the viewport configuration but before we've issued a resize event to the page. >+ >+ Thus, on pages that use listen to the resize event and adjust their content accordingly to fit within the new >+ layout width, we prematurely declare that the page has horizontally overflowed, and try to lay out at a larger >+ width and scale down. This causes the page to unnecessarily shrink after rotating to landscale orientation and >+ back. >+ >+ To fix this, we simply move the call to shrink-to-fit-content to the end of the dynamic viewport size update, >+ such that the page has had a chance to adjust to the new layout size. >+ >+ Test: fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation.html >+ >+ * WebProcess/WebPage/ios/WebPageIOS.mm: >+ (WebKit::WebPage::dynamicViewportSizeUpdate): >+ > 2019-05-17 Commit Queue <commit-queue@webkit.org> > > Unreviewed, rolling out r245401. >diff --git a/Source/WebKit/WebProcess/WebPage/ios/WebPageIOS.mm b/Source/WebKit/WebProcess/WebPage/ios/WebPageIOS.mm >index b38db7995877b379fc06753996e1698caa5e8a73..2316d11754780a9f389daaa0684a534ee596a15f 100644 >--- a/Source/WebKit/WebProcess/WebPage/ios/WebPageIOS.mm >+++ b/Source/WebKit/WebProcess/WebPage/ios/WebPageIOS.mm >@@ -2999,11 +2999,6 @@ void WebPage::dynamicViewportSizeUpdate(const FloatSize& viewLayoutSize, const W > if (viewportChanged) > viewportConfigurationChanged(); > >-#if ENABLE(VIEWPORT_RESIZING) >- if (immediatelyShrinkToFitContent()) >- viewportConfigurationChanged(); >-#endif >- > IntSize newLayoutSize = m_viewportConfiguration.layoutSize(); > > if (setFixedLayoutSize(newLayoutSize)) >@@ -3135,6 +3130,11 @@ void WebPage::dynamicViewportSizeUpdate(const FloatSize& viewLayoutSize, const W > setDeviceOrientation(deviceOrientation); > frameView.setScrollOffset(roundedUnobscuredContentRectPosition); > >+#if ENABLE(VIEWPORT_RESIZING) >+ if (immediatelyShrinkToFitContent()) >+ viewportConfigurationChanged(); >+#endif >+ > m_drawingArea->scheduleCompositingLayerFlush(); > > m_pendingDynamicViewportSizeUpdateID = dynamicViewportSizeUpdateID; >diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog >index ed2cbb446312ab3fc431bc01307f97f996e4ee7f..a32a87e95ee41d20ad655d5b2d12b48a3e5bc0dd 100644 >--- a/LayoutTests/ChangeLog >+++ b/LayoutTests/ChangeLog >@@ -1,3 +1,22 @@ >+2019-05-20 Wenson Hsieh <wenson_hsieh@apple.com> >+ >+ [iOS] Layout viewport size on google.com increases after rotating to landscape and back >+ https://bugs.webkit.org/show_bug.cgi?id=198062 >+ <rdar://problem/50547895> >+ >+ Reviewed by NOBODY (OOPS!). >+ >+ Add a UIHelper method to simulate device rotation to a given orientation, and use it in a new layout test that >+ simulates rotation to and from landscape orientation, and verifies that the initial scale did not change from >+ its expected value of 1. >+ >+ * fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation-expected.txt: Added. >+ * fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation.html: Added. >+ * resources/ui-helper.js: >+ (window.UIHelper.rotateDevice.return.new.Promise.): >+ (window.UIHelper.rotateDevice): >+ (window.UIHelper): >+ > 2019-05-17 Simon Fraser <simon.fraser@apple.com> > > REGRESSION (r245170): gmail.com header flickers when hovering over the animating buttons >diff --git a/LayoutTests/fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation-expected.txt b/LayoutTests/fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation-expected.txt >new file mode 100644 >index 0000000000000000000000000000000000000000..6e0e885f76aab513a4aad10f85367026ab82f5e5 >--- /dev/null >+++ b/LayoutTests/fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation-expected.txt >@@ -0,0 +1,18 @@ >+This test verifies that rotating to landscape and back with shouldIgnoreMetaViewport enabled does not cause the initial scale to deviate from its original value. To test manually, load the test page on an appropriately configured device and rotate to landscape and back. The initial scale after rotation should be the same as it was prior to rotation. >+ >+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE". >+ >+ >+ >+Before rotation >+PASS visualViewport.scale is 1 >+ >+After the first rotation >+PASS visualViewport.scale is 1 >+ >+After the second rotation >+PASS visualViewport.scale is 1 >+PASS successfullyParsed is true >+ >+TEST COMPLETE >+ >diff --git a/LayoutTests/fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation.html b/LayoutTests/fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation.html >new file mode 100644 >index 0000000000000000000000000000000000000000..432fc86b01e1e10624c0a54425edcd7e439f4787 >--- /dev/null >+++ b/LayoutTests/fast/events/ios/rotation/do-not-shrink-to-fit-content-after-rotation.html >@@ -0,0 +1,52 @@ >+<!DOCTYPE html> <!-- webkit-test-runner [ shouldIgnoreMetaViewport=true useFlexibleViewport=true ] --> >+<html> >+<head> >+ <meta name="viewport" content="width=device-width, initial-scale=1.0"> >+ <script src="../../../../resources/ui-helper.js"></script> >+ <script src="../../../../resources/js-test.js"></script> >+ <style> >+ body, html { >+ width: 100%; >+ height: 100%; >+ margin: 0; >+ padding: 0; >+ } >+ >+ .bar { >+ width: 0; >+ height: 100px; >+ background: linear-gradient(to right, red 0%, green 50%, blue 100%); >+ } >+ </style> >+</head> >+<body> >+ <div class="bar"></div> >+ <p id="description"></p> >+ <p id="console"></p> >+ <script> >+ jsTestIsAsync = true; >+ bar = document.querySelector(".bar"); >+ bar.style.width = `${innerWidth}px`; >+ >+ addEventListener("resize", () => bar.style.width = `${innerWidth}px`); >+ addEventListener("load", async () => { >+ description("This test verifies that rotating to landscape and back with shouldIgnoreMetaViewport enabled does not cause the initial scale to deviate from its original value. To test manually, load the test page on an appropriately configured device and rotate to landscape and back. The initial scale after rotation should be the same as it was prior to rotation."); >+ >+ debug("\nBefore rotation"); >+ shouldBe("visualViewport.scale", "1"); >+ >+ await UIHelper.rotateDevice("landscape-right", true); >+ await UIHelper.ensurePresentationUpdate(); >+ debug("\nAfter the first rotation"); >+ shouldBe("visualViewport.scale", "1"); >+ >+ await UIHelper.rotateDevice("portrait", true); >+ await UIHelper.ensurePresentationUpdate(); >+ debug("\nAfter the second rotation"); >+ shouldBe("visualViewport.scale", "1"); >+ >+ finishJSTest(); >+ }); >+ </script> >+</body> >+</html> >diff --git a/LayoutTests/resources/ui-helper.js b/LayoutTests/resources/ui-helper.js >index b52276735964fb9df108b0569c782b0f51dbc2dc..0bd5aba756933bf434cdea318a2abd607d0c278a 100644 >--- a/LayoutTests/resources/ui-helper.js >+++ b/LayoutTests/resources/ui-helper.js >@@ -906,4 +906,18 @@ window.UIHelper = class UIHelper { > functionToCall.apply(this, theArguments); > }); > } >+ >+ static rotateDevice(orientationName, animatedResize = false) >+ { >+ if (!this.isWebKit2() || !this.isIOS()) >+ return Promise.resolve(); >+ >+ return new Promise(resolve => { >+ testRunner.runUIScript(`(() => { >+ uiController.${animatedResize ? "simulateRotationLikeSafari" : "simulateRotation"}("${orientationName}", function() { >+ uiController.doAfterVisibleContentRectUpdate(() => uiController.uiScriptComplete()); >+ }); >+ })()`, resolve); >+ }); >+ } > }
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Formatted Diff
|
Diff
Attachments on
bug 198062
: 370287