Audio track requires two clicks to change if the previously selected track was programmatically added
Description
First, I would like to express my gratitude for the development of such a great package. Video.js has been a lifesaver on multiple occasions.
I'm working on a web application using Vue.js. My application has a "Lectures" section where users can watch pre-recorded lectures. In an effort to support multiple languages, we decided to record extra audio for each lecture separately (with different languages) and then switch between them programmatically using JavaScript. However, we have noticed a problem where if you select one of the added audio tracks and then try to go back to the original (embedded) audio track, you reach a state where no track is selected and the video is playing without any sound.
Reduced test case
https://jsfiddle.net/2dt9rz8w/
Steps to reproduce
- Play the video.
- Switch to the "Spanish" audio track.
- (Try to) switch back to the first track
- No track is selected now, the video is playing without audio.
- If you click on the first track again, it will work this time as normal.
Errors
No error is shown in the console
What version of Video.js are you using?
8.21.0
Video.js plugins used.
None
What browser(s) including version(s) does this occur with?
Chrome 133
What OS(es) and version(s) does this occur with?
windows 10
👋 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.
Unfortunately, the audiotracks feature isn't really meant for that. It's used to expose the available tracks in a segmented stream like hls or dash or if the browser natively supports multiple in-file audio tracks (like safari) it will display those. Our reccomendation for if you have multiple audio tracks is to use a HLS or DASH.