Use track name over track index, fixes unordered track group switching

Adds 'name' property to audio and subtitle track switching events
Resolves video-dev#3729

api-extractor/report/hls.js.api.md

@@ -84,6 +84,8 @@ export interface AudioTrackSwitchingData {
     // (undocumented)
     id: number;
     // (undocumented)
+    name: string;
+    // (undocumented)
     type: MediaPlaylistType | 'main';
     // (undocumented)
     url: string;
@@ -2008,6 +2010,8 @@ export interface SubtitleTrackSwitchData {
     // (undocumented)
     id: number;
     // (undocumented)
+    name?: string;
+    // (undocumented)
     type?: MediaPlaylistType | 'main';
     // (undocumented)
     url?: string;

demo/chart/timeline-chart.ts

@@ -666,6 +666,9 @@ export class TimelineChart {
 }
 
 function stripDeliveryDirectives(url: string): string {
+  if (url === '') {
+    return url;
+  }
   try {
     const webUrl: URL = new self.URL(url);
     webUrl.searchParams.delete('_HLS_msn');

src/controller/audio-track-controller.ts

@@ -19,6 +19,7 @@ class AudioTrackController extends BasePlaylistController {
   private groupId: string | null = null;
   private tracksInGroup: MediaPlaylist[] = [];
   private trackId: number = -1;
+  private trackName: string = '';
   private selectDefaultTrack: boolean = true;
 
   constructor(hls: Hls) {
@@ -58,6 +59,7 @@ class AudioTrackController extends BasePlaylistController {
     this.groupId = null;
     this.tracksInGroup = [];
     this.trackId = -1;
+    this.trackName = '';
     this.selectDefaultTrack = true;
   }
 
@@ -169,8 +171,9 @@ class AudioTrackController extends BasePlaylistController {
 
   private setAudioTrack(newId: number): void {
     const tracks = this.tracksInGroup;
-    // noop on same audio track id as already set
-    if (this.trackId === newId && tracks[newId]?.details) {
+    const track = tracks[newId];
+    // noop on audio track already set
+    if (track?.details) {
       return;
     }
 
@@ -184,11 +187,12 @@ class AudioTrackController extends BasePlaylistController {
     this.clearTimer();
 
     const lastTrack = tracks[this.trackId];
-    const track = tracks[newId];
     this.log(`Now switching to audio-track index ${newId}`);
+    const { id, name, type, url } = track;
     this.trackId = newId;
-    const { url, type, id } = track;
-    this.hls.trigger(Events.AUDIO_TRACK_SWITCHING, { id, type, url });
+    this.trackName = name;
+    this.selectDefaultTrack = false;
+    this.hls.trigger(Events.AUDIO_TRACK_SWITCHING, { id, name, type, url });
     const hlsUrlParameters = this.switchParams(track.url, lastTrack?.details);
     this.loadPlaylist(hlsUrlParameters);
   }
@@ -199,7 +203,7 @@ class AudioTrackController extends BasePlaylistController {
       audioTracks.length,
       'Initial audio track should be selected when tracks are known'
     );
-    const currentAudioTrackName = audioTracks[this.trackId]?.name;
+    const currentAudioTrackName = this.trackName;
     const trackId =
       this.findTrackId(currentAudioTrackName) || this.findTrackId();
 

src/controller/subtitle-track-controller.ts

@@ -354,8 +354,8 @@ class SubtitleTrackController extends BasePlaylistController {
     this.log(`Switching to subtitle track ${newId}`);
     this.trackId = newId;
     if (track) {
-      const { url, type, id } = track;
-      this.hls.trigger(Events.SUBTITLE_TRACK_SWITCH, { id, type, url });
+      const { id, name, type, url } = track;
+      this.hls.trigger(Events.SUBTITLE_TRACK_SWITCH, { id, name, type, url });
       const hlsUrlParameters = this.switchParams(track.url, lastTrack?.details);
       this.loadPlaylist(hlsUrlParameters);
     } else {

src/types/events.ts

@@ -153,9 +153,10 @@ export interface LevelPTSUpdatedData {
 }
 
 export interface AudioTrackSwitchingData {
-  url: string;
-  type: MediaPlaylistType | 'main';
   id: number;
+  name: string;
+  type: MediaPlaylistType | 'main';
+  url: string;
 }
 
 export interface AudioTrackSwitchedData {
@@ -173,9 +174,10 @@ export interface SubtitleTracksUpdatedData {
 }
 
 export interface SubtitleTrackSwitchData {
-  url?: string;
-  type?: MediaPlaylistType | 'main';
   id: number;
+  name?: string;
+  type?: MediaPlaylistType | 'main';
+  url?: string;
 }
 
 export interface SubtitleTrackLoadedData extends TrackLoadedData {}

tests/unit/controller/subtitle-track-controller.js

@@ -129,6 +129,7 @@ describe('SubtitleTrackController', function () {
         'hlsSubtitleTrackSwitch',
         {
           id: 1,
+          name: 'English',
           type: 'SUBTITLES',
           url: 'bar',
         }
@@ -163,6 +164,7 @@ describe('SubtitleTrackController', function () {
         'hlsSubtitleTrackSwitch',
         {
           id: 0,
+          name: 'English',
           type: 'SUBTITLES',
           url: 'baz',
         }