Playback video can't jump to correct position

[reng99]

What do you want to do with Hls.js?

There is a long playback video (about 4 hours), and we get info as belong:

#EXTM3U
#EXT-X-VERSION:3
#EXT-X-TARGETDURATION:10
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-PROGRAM-DATE-TIME:2022-06-13T04:52:55.479
#EXTINF:10.0,
https://**/VOD/_definst_/mp4:amazons3/F5aEdIM1VjMHJ5akJjemQ3dEtyUnhnRT0=_0.ts
#EXTINF:10.0,
https://**/VOD/_definst_/mp4:amazons3/F5aEdIM1VjMHJ5akJjemQ3dEtyUnhnRT0=_1.ts
#EXTINF:10.32,
...

First Time, the website automatically load the first four videos, video frame and time are matched. But, when I click the video progress bar to random time, the video frame and time sometimes do not match.

What have you tried so far?

I set video.currentTime to correct one, but the video frame and time sometimes do not match. I guess that the fragment has not been requested, and the specific picture cannot be obtained. I get no idea...

[robwalch]

Please fill out the Bug Report Template as part of your issue, making sure to include:

• Test stream/page (if possible)
• Steps to reproduce
• Expected behavior
• Actual behavior

If the issue is related to your stream, and you cannot share the stream, please include all the information we would need to reproduce the issue. This includes how to generate a stream that reproduces the issue.

[reng99]

Thanks for response!

I create a custom video process bar, after I click the bar somewhere, I calculate the bar position and the currentTime. Code as below:

// process distance
this.videoState.distance = (event.clientX + document.documentElement.scrollLeft - this.videoState.leftInit) - this.videoPosition.x;

// currentTime
const currentTimeTemp = this.videoState.distance / this.processWidth * this.videoPlayer.duration;
this.videoPlayer.currentTime = currentTimeTemp;

But, the video screen just stop, can't match the currentTime. I look at the hls.js repository, in the master branch, just do the same, and match screen correctly.