[CB-11991] Locking screen orientation causes viewport glitch

• Type: Bug
• Status: Closed
• Priority: Major
• Resolution: Duplicate
• Component/s: cordova-plugin-screen-orientation, cordova-plugin-statusbar

Environment

MacOS Sierra, Xcode 8, iPhone 6 iOS 10 simulator and real devices

• Assignee: jcesarmobile
• Reporter: Dmitry Chekanov
• Created: 10/Oct/16 21:08
• Updated: 11/Oct/16 07:58
• Resolved: 11/Oct/16 07:58

Description

I develop an app that has both cordova-plugin-screen-orientation and cordova-plugin-statusbar plugins installed.

When my JS code executes this command:

screen.lockOrientation('landscape');

the screen rotates and oftentimes turns into something like this: https://drive.google.com/open?id=0B6XpnKFCvexaclBvc09STmhzMUU

The viewport becomes clipped. I checked in Safari Inspector - the issue is with the viewport, not with CSS - window.innerHeight reports ~100, and window.innerWidth ~1000 (which is obviously not how it should be).

It doesn't happen all the time. The lighter the page, the harder it is to reproduce.

I looked into the source code of the StatusBar plugin, and it looks like it does some viewport resizing (there's a function called "resizeWebView") that might cause the described issue. Maybe it gets executed when screen rotates but fails to determine the proper screen dimensions to adjust the viewport.

Issue Links

• duplicates: CB-11423 Web view shrinks after locking screen orientation