After an orientation change event on Chrome iOS 87.0.4280.77, the window.innerWidth appears to be incorrect. Initially, the innerWidth is 414px when viewed on an iPhone. However, after changing the phone's orientation from landscape to portrait, the innerWidth decreases to 326px.
I have also cross-checked the innerwidth using and found that it reflects the same innerWidth values as in my code.
View before the orientation change
View after changing to landscape and back to portrait
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
</head>
<body>
<script type="text/javascript">
alert("innerWidth1:"+window.innerWidth); // initial innerwidth before orientation change
window.addEventListener('orientationchange', function() {
alert("innerWidth2:"+window.innerWidth); // innerwidth after orientation change
});
</script>
</body>
</html>
Has anyone else faced a similar issue? Any insights would be appreciated.
Thank you.