the captions can't immediately change right position when zoomin full screen or PictureInPicture

[R8KwEwN2hvrhY]

Description

the captions can't immediately change right position when zoomin full screen or PictureInPicture

Reduced test case

none

Steps to reproduce

1. zoomin full screen or PictureInPicture

Errors

No response

What version of Video.js are you using?

8.5.1

Video.js plugins used.

No response

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

115

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

windows11

[mister-ben]

Have you got an example to look at. There might be a very brief delay before the text repositions/resizes, but are you saying your captions are staying there?

[R8KwEwN2hvrhY]

Have you got an example to look at. There might be a very brief delay before the text repositions/resizes, but are you saying your captions are staying there?

when Next sentence will aright，but current sentence look not well position.

https://github.com/videojs/video.js/assets/17196859/ae5437ed-2577-4d19-85df-552da4322bc0

[R8KwEwN2hvrhY]

i found that if dash include captions,current sentence will quickly move to the right position. if use follow way add captions

                    var oldTracks = player.remoteTextTracks()
                    var k = oldTracks.length
                    while (k--) {
                      player.removeRemoteTextTrack(oldTracks[k])
                    }
                    var zhurl = {
                      kind: 'subtitles',
                      label: chs
                      src: ""
                      default: 'true',
                    };
                    player.addRemoteTextTrack(zhurl, true);

will something not right....

[mister-ben]

Not seeing that here: https://codepen.io/mister-ben/full/poQQbBE?v=8.5.1 Can you make a reproducable test case?

[R8KwEwN2hvrhY]

Not seeing that here: https://codepen.io/mister-ben/full/poQQbBE?v=8.5.1 Can you make a reproducable test case?

sorry,i don't know how to use it....

i use follow html ,you can change the src of video and captions

<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.5.1/video-js.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.5.1/video.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.5.1/lang/zh-CN.min.js"></script>

<video
    height="450px"
    width="720px"
    class="video-js"
    id="my-player">

  <p class="vjs-no-js">
    To view this video please enable JavaScript, and consider upgrading to a
    web browser that
    <a href="https://videojs.com/html5-video-support/" target="_blank">
      supports HTML5 video
    </a>
  </p>
</video>

<script>
var options = {
        controlBar: {volumePanel: {inline: false}},
        muted: false,
        enableDocumentPictureInPicture: true,
        experimentalSvgIcons: true,
    controls : true,
    loop : false,
    language: 'zh-CN',
    errorDisplay: false,
    playbackRates: [0.5, 1, 1.5, 2,2.5,3],
    TitleBar: {'text':''},    
};

var player = videojs('my-player',options,function onPlayerReady() {
  videojs.log('Your player is ready!');
  //player.src([{src:"https://vjs.zencdn.net/v/oceans.mp4",type:"video/mp4"}])
  player.src([{src:"http://127.0.0.1:81/download/22.mp4",type:"video/mp4"}])
  // In this context, `this` is the player that was created by Video.js.

var oldTracks = player.remoteTextTracks()
var k = oldTracks.length
while (k--) {
  player.removeRemoteTextTrack(oldTracks[k])
}
var zhurl = {
  kind: 'subtitles',
  label: 'chs',
  src: "http://127.0.0.1:81/download/22.vtt",
  default: 'true',
};
player.addRemoteTextTrack(zhurl, true);

  this.play();

  // How about an event listener?
  this.on('ended', function() {
    videojs.log('Awww...over so soon?!');
  });
});
</script>

and follow is test video and captions 22.zip

[video-archivist-bot]

Hey! We've detected some video files in a comment on this issue. If you'd like to permanently archive these videos and tie them to this project, a maintainer of the project can reply to this issue with the following commands:

• for https://vjs.zencdn.net/v/oceans.mp4: say @video-archivist-bot save OEDD2E
• for http://127.0.0.1:81/download/22.mp4: say @video-archivist-bot save NAzP8j

[R8KwEwN2hvrhY]

ok,when update 8.6.1,it looks ok..........

[mister-ben]

Good to hear, the change in #8442 must have resolved your issue too.