Video.js: Video does not remain in view after exiting full screen mode

[mveenstra]

Description

Exiting full screen mode causes the video to no longer be in view after changing orientation

Steps to reproduce

1. Load video in portrait mode (iPhone 8 plus, Chrome & Safari)
2. Play video in portrait mode and enter full screen
3. Change orientation to landscape while still in full screen mode
4. Change back to portrait mode and exit full screen mode

Results

Expected

Video remains in view when exiting full screen mode and changing phone orientation

Actual

Inconsistent behavior when exiting full screen video after changing device orientation. In some cases the video remains in view. Other times the video is completely out of view and the user has been shifted to another part of the page.

Error output

No errors being output

Additional Information

videojs

Using npm videojs version 7.5.6 (also happens with version 7.6.0 using CDN)

browsers

Safari and Chrome

OSes

IOS

Here is a video of the issue using BrowserStack using 7.6.0, iPhone 8 Plus, Chrome!
https://www.dropbox.com/s/bbtzwf3w6v1r3sk/exit-FS-video.webm
https://objective-jennings-297ca0.netlify.com/

[welcome[bot]]

👋 Thanks for opening your first issue here! 👋

If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.
To help make it easier for us to investigate your issue, please follow the contributing guidelines.

[gkatsev]

I assume you've confirmed this happens with a physical device as well? I wonder if that's really something we can do anything about. I'd be interesting to know how taking a random element fullscreen, rotating the display, and then exiting fullscreen affects the page scroll.

[mveenstra]

Hi @gkatsev - yes, I also tested using a real device and get the same results. Shifting content from mobile portrait and landscape is something that I observe frequently due to changing layouts and length of content - this causes the scroll position to change but it is not noticeable because of the fullscreen overlay. However, I opened an issue because I was seeing inconsistent behavior. In some cases, the video remains in view while other times it does not. Wondering if you have any additional insight. Thanks so much for your time.

[gkatsev]

Yeah, makes sense. Don't really have anything else off the top of my head beyond trying to see how it works with non video/videojs elements that go fullscreen and also comparing it with Android maybe. Also, good to compare with iPad given that ipad has the fullscreen api and iphone doesn't but you can still take a video element t the native fullscreen on ipad via the pinch/expand gesture.

[mveenstra]

Hi @gkatsev - just wanted to circle back here! After testing several other video libraries and a plain HTML5 video, I observed the same behavior. There was one library that actually seemed to manage the change in scroll position a bit better (plyr js).

In any case, appreciate your time! Perhaps we can close this issue or mark as an enhancement feature. Thank you!

[gkatsev]

Thanks for circling back @mveenstra!
I'm going to close it in this case we're unlikely to have time to look into it more on our end. If you figure something out related to this, please let us know!