Sometimes the height does not change when orientation change from Landscape to Portrait on iOS PWA

[Takkiii]

Demo

RPReplay_Final1639494891.MP4

Detail

When changing orientation from Landspace to Portrait, sometimes the height doesn't change.

But this doesn't always happen, it's really sometimes.
It may be reproduced immediately, or it may not be reproduced unless the orientation is changed many times.

I used next-pwa to make PWA, and react-div-100vh@0.6.0 doesn't have this problem.

Source

Using react-div-100vh@0.7.0

https://github.com/Takkiii/pwa-orientation-behavior-app

Using react-div-100vh@0.6.0

https://github.com/Takkiii/pwa-orientation-behavior-app/tree/react-div-100vh/0.6.0

[mvasin]

Hey @Takkiii ! Thanks for the demos. Swapping document.documentElement.clientHeight for window.innerHeight took place for reasons outlined here #37

Honestly, seems like there's no good solution (see #75). Any changes we made so far fixed some of complaints but provoked others.

Seems like we just should wait for browser adoption of https://www.w3.org/TR/2021/WD-css-values-4-20211016/#dynamic-viewport-percentage-units which at the moment is non-existent https://caniuse.com/?search=dvh.

[shivamragnar]

Hey @Takkiii thanks for posting this issue, I am also having exactly the same issue. Have you come up with anything yet for this issue ?

[Takkiii]

Hi, @shivamragnar.

I haven't found a good solution, so I'm still using 0.6.0.
I'm sorry I can't help you😢

[shivamragnar]

Thanks @Takkiii for the quick response, i will also try with 0.6.0 🙂