videojs / video.js

Video.js - open source HTML5 video player
https://videojs.com
Other
38.13k stars 7.46k forks source link

Player video start shaking when change progress of the video (HLS in Safari with use overrideNative) #8569

Open DariaLitvinova opened 9 months ago

DariaLitvinova commented 9 months ago

Description

with using overrideNative .m3u8 video in Safari starts shaking when you try to rewind or fast forward or just change the progress bar. this not reproduced if set fixed sized for width player - not more than 853 px, in other cases the video is shaking

In added link you can reproduce it in fullscreen mode.

Reduced test case

link

Steps to reproduce

  1. start play
  2. open fullscreen mode
  3. try to rewind, fast forward, change the progress bar

https://github.com/videojs/video.js/assets/144791019/b30a49bc-8f93-4f87-9849-89e8968456e7

Errors

No response

What version of Video.js are you using?

7.21.2

Video.js plugins used.

No response

What browser(s) including version(s) does this occur with?

Safari 17.2.1

What OS(es) and version(s) does this occur with?

Sonoma 14.2.1 image

welcome[bot] commented 9 months ago

👋 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.

mister-ben commented 9 months ago

I didn't observe this with wither native or MSE playback, but the rendition size errors from mediastreamvalidator seem relevant.

Error: Playlist video resolution doesn't match parsed video resolution
--> Detail:  Playlist: 854 x 480, Video: 802 x 480
--> Source:  vod/sessions/b4cd55a3a85946c98f2c56cd4230f7c6/media/playlist.m3u8/2

--> Detail:  Playlist: 1280 x 720, Video: 1204 x 720
--> Source:  vod/sessions/b4cd55a3a85946c98f2c56cd4230f7c6/media/playlist.m3u8/1

--> Detail:  Playlist: 1920 x 1080, Video: 1805 x 1080
--> Source:  vod/sessions/b4cd55a3a85946c98f2c56cd4230f7c6/media/playlist.m3u8/0