hls.js 1.5.6 → 1.5.7-0.canary.10015

package/src/controller/fps-controller.ts

@@ -1,5 +1,4 @@
 import { Events } from '../events';
-import { logger } from '../utils/logger';
 import type { ComponentAPI } from '../types/component-api';
 import type Hls from '../hls';
 import type { MediaAttachingData } from '../types/events';
@@ -84,13 +83,13 @@ class FPSController implements ComponentAPI {
           totalDroppedFrames: droppedFrames,
         });
         if (droppedFPS > 0) {
-          // logger.log('checkFPS : droppedFPS/decodedFPS:' + droppedFPS/(1000 * currentDecoded / currentPeriod));
+          // hls.logger.log('checkFPS : droppedFPS/decodedFPS:' + droppedFPS/(1000 * currentDecoded / currentPeriod));
           if (
             currentDropped >
             hls.config.fpsDroppedMonitoringThreshold * currentDecoded
           ) {
             let currentLevel = hls.currentLevel;
-            logger.warn(
+            hls.logger.warn(
               'drop FPS ratio greater than max allowed value for currentLevel: ' +
                 currentLevel,
             );

package/src/controller/gap-controller.ts

@@ -1,20 +1,22 @@
-import type { BufferInfo } from '../utils/buffer-helper';
+import { State } from './base-stream-controller';
 import { BufferHelper } from '../utils/buffer-helper';
 import { ErrorTypes, ErrorDetails } from '../errors';
 import { PlaylistLevelType } from '../types/loader';
 import { Events } from '../events';
-import { logger } from '../utils/logger';
+import { Logger } from '../utils/logger';
 import type Hls from '../hls';
+import type { BufferInfo } from '../utils/buffer-helper';
 import type { HlsConfig } from '../config';
 import type { Fragment } from '../loader/fragment';
 import type { FragmentTracker } from './fragment-tracker';
+import type { LevelDetails } from '../loader/level-details';
 
 export const STALL_MINIMUM_DURATION_MS = 250;
 export const MAX_START_GAP_JUMP = 2.0;
 export const SKIP_BUFFER_HOLE_STEP_SECONDS = 0.1;
 export const SKIP_BUFFER_RANGE_START = 0.05;
 
-export default class GapController {
+export default class GapController extends Logger {
   private config: HlsConfig;
   private media: HTMLMediaElement | null = null;
   private fragmentTracker: FragmentTracker;
@@ -24,8 +26,15 @@ export default class GapController {
   private stalled: number | null = null;
   private moved: boolean = false;
   private seeking: boolean = false;
+  private ended: number = 0;
 
-  constructor(config, media, fragmentTracker, hls) {
+  constructor(
+    config: HlsConfig,
+    media: HTMLMediaElement,
+    fragmentTracker: FragmentTracker,
+    hls: Hls,
+  ) {
+    super('gap-controller', hls.logger);
     this.config = config;
     this.media = media;
     this.fragmentTracker = fragmentTracker;
@@ -44,7 +53,12 @@ export default class GapController {
    *
    * @param lastCurrentTime - Previously read playhead position
    */
-  public poll(lastCurrentTime: number, activeFrag: Fragment | null) {
+  public poll(
+    lastCurrentTime: number,
+    activeFrag: Fragment | null,
+    levelDetails: LevelDetails | undefined,
+    state: string,
+  ) {
     const { config, media, stalled } = this;
     if (media === null) {
       return;
@@ -57,6 +71,7 @@ export default class GapController {
 
     // The playhead is moving, no-op
     if (currentTime !== lastCurrentTime) {
+      this.ended = 0;
       this.moved = true;
       if (!seeking) {
         this.nudgeRetry = 0;
@@ -65,7 +80,7 @@ export default class GapController {
         // The playhead is now moving, but was previously stalled
         if (this.stallReported) {
           const stalledDuration = self.performance.now() - stalled;
-          logger.warn(
+          this.warn(
             `playback not stuck anymore @${currentTime}, after ${Math.round(
               stalledDuration,
             )}ms`,
@@ -128,12 +143,9 @@ export default class GapController {
       // When joining a live stream with audio tracks, account for live playlist window sliding by allowing
       // a larger jump over start gaps caused by the audio-stream-controller buffering a start fragment
       // that begins over 1 target duration after the video start position.
-      const level = this.hls.levels
-        ? this.hls.levels[this.hls.currentLevel]
-        : null;
-      const isLive = level?.details?.live;
+      const isLive = !!levelDetails?.live;
       const maxStartGapJump = isLive
-        ? level!.details!.targetduration * 2
+        ? levelDetails!.targetduration * 2
         : MAX_START_GAP_JUMP;
       const partialOrGap = this.fragmentTracker.getPartialFragment(currentTime);
       if (startJump > 0 && (startJump <= maxStartGapJump || partialOrGap)) {
@@ -153,6 +165,21 @@ export default class GapController {
 
     const stalledDuration = tnow - stalled;
     if (!seeking && stalledDuration >= STALL_MINIMUM_DURATION_MS) {
+      // Dispatch MEDIA_ENDED when media.ended/ended event is not signalled at end of stream
+      if (
+        state === State.ENDED &&
+        !(levelDetails && levelDetails.live) &&
+        Math.abs(currentTime - (levelDetails?.edge || 0)) < 1
+      ) {
+        if (stalledDuration < 1000 || this.ended) {
+          return;
+        }
+        this.ended = currentTime;
+        this.hls.trigger(Events.MEDIA_ENDED, {
+          stalled: true,
+        });
+        return;
+      }
       // Report stalling after trying to fix
       this._reportStall(bufferInfo);
       if (!this.media) {
@@ -206,7 +233,7 @@ export default class GapController {
           bufferInfo.nextStart - currentTime < config.maxBufferHole)) &&
       stalledDurationMs > config.highBufferWatchdogPeriod * 1000
     ) {
-      logger.warn('Trying to nudge playhead over buffer-hole');
+      this.warn('Trying to nudge playhead over buffer-hole');
       // Try to nudge currentTime over a buffer hole if we've been stalling for the configured amount of seconds
       // We only try to jump the hole if it's under the configured size
       // Reset stalled so to rearm watchdog timer
@@ -230,7 +257,7 @@ export default class GapController {
           media.currentTime
         } due to low buffer (${JSON.stringify(bufferInfo)})`,
       );
-      logger.warn(error.message);
+      this.warn(error.message);
       hls.trigger(Events.ERROR, {
         type: ErrorTypes.MEDIA_ERROR,
         details: ErrorDetails.BUFFER_STALLED_ERROR,
@@ -305,7 +332,7 @@ export default class GapController {
           startTime + SKIP_BUFFER_RANGE_START,
           currentTime + SKIP_BUFFER_HOLE_STEP_SECONDS,
         );
-        logger.warn(
+        this.warn(
           `skipping hole, adjusting currentTime from ${currentTime} to ${targetTime}`,
         );
         this.moved = true;
@@ -348,7 +375,7 @@ export default class GapController {
       const error = new Error(
         `Nudging 'currentTime' from ${currentTime} to ${targetTime}`,
       );
-      logger.warn(error.message);
+      this.warn(error.message);
       media.currentTime = targetTime;
       hls.trigger(Events.ERROR, {
         type: ErrorTypes.MEDIA_ERROR,
@@ -360,7 +387,7 @@ export default class GapController {
       const error = new Error(
         `Playhead still not moving while enough data buffered @${currentTime} after ${config.nudgeMaxRetry} nudges`,
       );
-      logger.error(error.message);
+      this.error(error.message);
       hls.trigger(Events.ERROR, {
         type: ErrorTypes.MEDIA_ERROR,
         details: ErrorDetails.BUFFER_STALLED_ERROR,

package/src/controller/latency-controller.ts

@@ -6,7 +6,6 @@ import type {
   LevelUpdatedData,
   MediaAttachingData,
 } from '../types/events';
-import { logger } from '../utils/logger';
 import type { ComponentAPI } from '../types/component-api';
 import type Hls from '../hls';
 import type { HlsConfig } from '../config';
@@ -19,7 +18,6 @@ export default class LatencyController implements ComponentAPI {
   private currentTime: number = 0;
   private stallCount: number = 0;
   private _latency: number | null = null;
-  private timeupdateHandler = () => this.timeupdate();
 
   constructor(hls: Hls) {
     this.hls = hls;
@@ -126,7 +124,7 @@ export default class LatencyController implements ComponentAPI {
     this.onMediaDetaching();
     this.levelDetails = null;
     // @ts-ignore
-    this.hls = this.timeupdateHandler = null;
+    this.hls = null;
   }
 
   private registerListeners() {
@@ -150,12 +148,12 @@ export default class LatencyController implements ComponentAPI {
     data: MediaAttachingData,
   ) {
     this.media = data.media;
-    this.media.addEventListener('timeupdate', this.timeupdateHandler);
+    this.media.addEventListener('timeupdate', this.onTimeupdate);
   }
 
   private onMediaDetaching() {
     if (this.media) {
-      this.media.removeEventListener('timeupdate', this.timeupdateHandler);
+      this.media.removeEventListener('timeupdate', this.onTimeupdate);
       this.media = null;
     }
   }
@@ -172,10 +170,10 @@ export default class LatencyController implements ComponentAPI {
   ) {
     this.levelDetails = details;
     if (details.advanced) {
-      this.timeupdate();
+      this.onTimeupdate();
     }
     if (!details.live && this.media) {
-      this.media.removeEventListener('timeupdate', this.timeupdateHandler);
+      this.media.removeEventListener('timeupdate', this.onTimeupdate);
     }
   }
 
@@ -185,13 +183,13 @@ export default class LatencyController implements ComponentAPI {
     }
     this.stallCount++;
     if (this.levelDetails?.live) {
-      logger.warn(
-        '[playback-rate-controller]: Stall detected, adjusting target latency',
+      this.hls.logger.warn(
+        '[latency-controller]: Stall detected, adjusting target latency',
       );
     }
   }
 
-  private timeupdate() {
+  private onTimeupdate = () => {
     const { media, levelDetails } = this;
     if (!media || !levelDetails) {
       return;
@@ -242,7 +240,7 @@ export default class LatencyController implements ComponentAPI {
     } else if (media.playbackRate !== 1 && media.playbackRate !== 0) {
       media.playbackRate = 1;
     }
-  }
+  };
 
   private estimateLiveEdge(): number | null {
     const { levelDetails } = this;

package/src/controller/level-controller.ts

@@ -27,8 +27,6 @@ import type Hls from '../hls';
 import type { HlsUrlParameters, LevelParsed } from '../types/level';
 import type { MediaPlaylist } from '../types/media-playlist';
 
-let chromeOrFirefox: boolean;
-
 export default class LevelController extends BasePlaylistController {
   private _levels: Level[] = [];
   private _firstLevel: number = -1;
@@ -45,7 +43,7 @@ export default class LevelController extends BasePlaylistController {
     hls: Hls,
     contentSteeringController: ContentSteeringController | null,
   ) {
-    super(hls, '[level-controller]');
+    super(hls, 'level-controller');
     this.steering = contentSteeringController;
     this._registerListeners();
   }
@@ -119,22 +117,12 @@ export default class LevelController extends BasePlaylistController {
 
     data.levels.forEach((levelParsed: LevelParsed) => {
       const attributes = levelParsed.attrs;
-
-      // erase audio codec info if browser does not support mp4a.40.34.
-      // demuxer will autodetect codec and fallback to mpeg/audio
       let { audioCodec, videoCodec } = levelParsed;
-      if (audioCodec?.indexOf('mp4a.40.34') !== -1) {
-        chromeOrFirefox ||= /chrome|firefox/i.test(navigator.userAgent);
-        if (chromeOrFirefox) {
-          levelParsed.audioCodec = audioCodec = undefined;
-        }
-      }
-
       if (audioCodec) {
-        levelParsed.audioCodec = audioCodec = getCodecCompatibleName(
-          audioCodec,
-          preferManagedMediaSource,
-        );
+        // Returns empty and set to undefined for 'mp4a.40.34' with fallback to 'audio/mpeg' SourceBuffer
+        levelParsed.audioCodec = audioCodec =
+          getCodecCompatibleName(audioCodec, preferManagedMediaSource) ||
+          undefined;
       }
 
       if (videoCodec?.indexOf('avc1') === 0) {
@@ -568,7 +556,13 @@ export default class LevelController extends BasePlaylistController {
       if (curLevel.fragmentError === 0) {
         curLevel.loadError = 0;
       }
-      this.playlistLoaded(level, data, curLevel.details);
+      // Ignore matching details populated by loading a Media Playlist directly
+      let previousDetails = curLevel.details;
+      if (previousDetails === data.details && previousDetails.advanced) {
+        previousDetails = undefined;
+      }
+
+      this.playlistLoaded(level, data, previousDetails);
     } else if (data.deliveryDirectives?.skip) {
       // received a delta playlist update that cannot be merged
       details.deltaUpdateFailed = true;

package/src/controller/stream-controller.ts

@@ -49,8 +49,6 @@ export default class StreamController
   private altAudio: boolean = false;
   private audioOnly: boolean = false;
   private fragPlaying: Fragment | null = null;
-  private onvplaying: EventListener | null = null;
-  private onvseeked: EventListener | null = null;
   private fragLastKbps: number = 0;
   private couldBacktrack: boolean = false;
   private backtrackFragment: Fragment | null = null;
@@ -66,17 +64,15 @@ export default class StreamController
       hls,
       fragmentTracker,
       keyLoader,
-      '[stream-controller]',
+      'stream-controller',
       PlaylistLevelType.MAIN,
     );
-    this._registerListeners();
+    this.registerListeners();
   }
 
-  private _registerListeners() {
+  protected registerListeners() {
+    super.registerListeners();
     const { hls } = this;
-    hls.on(Events.MEDIA_ATTACHED, this.onMediaAttached, this);
-    hls.on(Events.MEDIA_DETACHING, this.onMediaDetaching, this);
-    hls.on(Events.MANIFEST_LOADING, this.onManifestLoading, this);
     hls.on(Events.MANIFEST_PARSED, this.onManifestParsed, this);
     hls.on(Events.LEVEL_LOADING, this.onLevelLoading, this);
     hls.on(Events.LEVEL_LOADED, this.onLevelLoaded, this);
@@ -85,7 +81,6 @@ export default class StreamController
       this.onFragLoadEmergencyAborted,
       this,
     );
-    hls.on(Events.ERROR, this.onError, this);
     hls.on(Events.AUDIO_TRACK_SWITCHING, this.onAudioTrackSwitching, this);
     hls.on(Events.AUDIO_TRACK_SWITCHED, this.onAudioTrackSwitched, this);
     hls.on(Events.BUFFER_CREATED, this.onBufferCreated, this);
@@ -94,11 +89,9 @@ export default class StreamController
     hls.on(Events.FRAG_BUFFERED, this.onFragBuffered, this);
   }
 
-  protected _unregisterListeners() {
+  protected unregisterListeners() {
+    super.unregisterListeners();
     const { hls } = this;
-    hls.off(Events.MEDIA_ATTACHED, this.onMediaAttached, this);
-    hls.off(Events.MEDIA_DETACHING, this.onMediaDetaching, this);
-    hls.off(Events.MANIFEST_LOADING, this.onManifestLoading, this);
     hls.off(Events.MANIFEST_PARSED, this.onManifestParsed, this);
     hls.off(Events.LEVEL_LOADED, this.onLevelLoaded, this);
     hls.off(
@@ -106,7 +99,6 @@ export default class StreamController
       this.onFragLoadEmergencyAborted,
       this,
     );
-    hls.off(Events.ERROR, this.onError, this);
     hls.off(Events.AUDIO_TRACK_SWITCHING, this.onAudioTrackSwitching, this);
     hls.off(Events.AUDIO_TRACK_SWITCHED, this.onAudioTrackSwitched, this);
     hls.off(Events.BUFFER_CREATED, this.onBufferCreated, this);
@@ -116,7 +108,9 @@ export default class StreamController
   }
 
   protected onHandlerDestroying() {
-    this._unregisterListeners();
+    // @ts-ignore
+    this.onMediaPlaying = this.onMediaSeeked = null;
+    this.unregisterListeners();
     super.onHandlerDestroying();
   }
 
@@ -516,10 +510,8 @@ export default class StreamController
   ) {
     super.onMediaAttached(event, data);
     const media = data.media;
-    this.onvplaying = this.onMediaPlaying.bind(this);
-    this.onvseeked = this.onMediaSeeked.bind(this);
-    media.addEventListener('playing', this.onvplaying as EventListener);
-    media.addEventListener('seeked', this.onvseeked as EventListener);
+    media.addEventListener('playing', this.onMediaPlaying);
+    media.addEventListener('seeked', this.onMediaSeeked);
     this.gapController = new GapController(
       this.config,
       media,
@@ -530,10 +522,9 @@ export default class StreamController
 
   protected onMediaDetaching() {
     const { media } = this;
-    if (media && this.onvplaying && this.onvseeked) {
-      media.removeEventListener('playing', this.onvplaying);
-      media.removeEventListener('seeked', this.onvseeked);
-      this.onvplaying = this.onvseeked = null;
+    if (media) {
+      media.removeEventListener('playing', this.onMediaPlaying);
+      media.removeEventListener('seeked', this.onMediaSeeked);
       this.videoBuffer = null;
     }
     this.fragPlaying = null;
@@ -544,12 +535,12 @@ export default class StreamController
     super.onMediaDetaching();
   }
 
-  private onMediaPlaying() {
+  private onMediaPlaying = () => {
     // tick to speed up FRAG_CHANGED triggering
     this.tick();
-  }
+  };
 
-  private onMediaSeeked() {
+  private onMediaSeeked = () => {
     const media = this.media;
     const currentTime = media ? media.currentTime : null;
     if (Number.isFinite(currentTime)) {
@@ -569,9 +560,9 @@ export default class StreamController
 
     // tick to speed up FRAG_CHANGED triggering
     this.tick();
-  }
+  };
 
-  private onManifestLoading() {
+  protected onManifestLoading() {
     // reset buffer on manifest loading
     this.log('Trigger BUFFER_RESET');
     this.hls.trigger(Events.BUFFER_RESET, undefined);
@@ -884,7 +875,7 @@ export default class StreamController
     this.fragBufferedComplete(frag, part);
   }
 
-  private onError(event: Events.ERROR, data: ErrorData) {
+  protected onError(event: Events.ERROR, data: ErrorData) {
     if (data.fatal) {
       this.state = State.ERROR;
       return;
@@ -942,8 +933,10 @@ export default class StreamController
 
     if (this.loadedmetadata || !BufferHelper.getBuffered(media).length) {
       // Resolve gaps using the main buffer, whose ranges are the intersections of the A/V sourcebuffers
-      const activeFrag = this.state !== State.IDLE ? this.fragCurrent : null;
-      gapController.poll(this.lastCurrentTime, activeFrag);
+      const state = this.state;
+      const activeFrag = state !== State.IDLE ? this.fragCurrent : null;
+      const levelDetails = this.getLevelDetails();
+      gapController.poll(this.lastCurrentTime, activeFrag, levelDetails, state);
     }
 
     this.lastCurrentTime = media.currentTime;

package/src/controller/subtitle-stream-controller.ts

@@ -9,6 +9,10 @@ import { PlaylistLevelType } from '../types/loader';
 import { Level } from '../types/level';
 import { subtitleOptionsIdentical } from '../utils/media-option-attributes';
 import { ErrorDetails, ErrorTypes } from '../errors';
+import {
+  isFullSegmentEncryption,
+  getAesModeFromFullSegmentMethod,
+} from '../utils/encryption-methods-util';
 import type { NetworkComponentAPI } from '../types/component-api';
 import type Hls from '../hls';
 import type { FragmentTracker } from './fragment-tracker';
@@ -51,25 +55,22 @@ export class SubtitleStreamController
       hls,
       fragmentTracker,
       keyLoader,
-      '[subtitle-stream-controller]',
+      'subtitle-stream-controller',
       PlaylistLevelType.SUBTITLE,
     );
-    this._registerListeners();
+    this.registerListeners();
   }
 
   protected onHandlerDestroying() {
-    this._unregisterListeners();
+    this.unregisterListeners();
     super.onHandlerDestroying();
     this.mainDetails = null;
   }
 
-  private _registerListeners() {
+  protected registerListeners() {
+    super.registerListeners();
     const { hls } = this;
-    hls.on(Events.MEDIA_ATTACHED, this.onMediaAttached, this);
-    hls.on(Events.MEDIA_DETACHING, this.onMediaDetaching, this);
-    hls.on(Events.MANIFEST_LOADING, this.onManifestLoading, this);
     hls.on(Events.LEVEL_LOADED, this.onLevelLoaded, this);
-    hls.on(Events.ERROR, this.onError, this);
     hls.on(Events.SUBTITLE_TRACKS_UPDATED, this.onSubtitleTracksUpdated, this);
     hls.on(Events.SUBTITLE_TRACK_SWITCH, this.onSubtitleTrackSwitch, this);
     hls.on(Events.SUBTITLE_TRACK_LOADED, this.onSubtitleTrackLoaded, this);
@@ -78,13 +79,10 @@ export class SubtitleStreamController
     hls.on(Events.FRAG_BUFFERED, this.onFragBuffered, this);
   }
 
-  private _unregisterListeners() {
+  protected unregisterListeners() {
+    super.unregisterListeners();
     const { hls } = this;
-    hls.off(Events.MEDIA_ATTACHED, this.onMediaAttached, this);
-    hls.off(Events.MEDIA_DETACHING, this.onMediaDetaching, this);
-    hls.off(Events.MANIFEST_LOADING, this.onManifestLoading, this);
     hls.off(Events.LEVEL_LOADED, this.onLevelLoaded, this);
-    hls.off(Events.ERROR, this.onError, this);
     hls.off(Events.SUBTITLE_TRACKS_UPDATED, this.onSubtitleTracksUpdated, this);
     hls.off(Events.SUBTITLE_TRACK_SWITCH, this.onSubtitleTrackSwitch, this);
     hls.off(Events.SUBTITLE_TRACK_LOADED, this.onSubtitleTrackLoaded, this);
@@ -360,7 +358,7 @@ export class SubtitleStreamController
       payload.byteLength > 0 &&
       decryptData?.key &&
       decryptData.iv &&
-      decryptData.method === 'AES-128'
+      isFullSegmentEncryption(decryptData.method)
     ) {
       const startTime = performance.now();
       // decrypt the subtitles
@@ -369,6 +367,7 @@ export class SubtitleStreamController
           new Uint8Array(payload),
           decryptData.key.buffer,
           decryptData.iv.buffer,
+          getAesModeFromFullSegmentMethod(decryptData.method),
         )
         .catch((err) => {
           hls.trigger(Events.ERROR, {

package/src/controller/subtitle-track-controller.ts

@@ -35,13 +35,14 @@ class SubtitleTrackController extends BasePlaylistController {
   private currentTrack: MediaPlaylist | null = null;
   private selectDefaultTrack: boolean = true;
   private queuedDefaultTrack: number = -1;
-  private asyncPollTrackChange: () => void = () => this.pollTrackChange(0);
   private useTextTrackPolling: boolean = false;
   private subtitlePollingInterval: number = -1;
   private _subtitleDisplay: boolean = true;
 
+  private asyncPollTrackChange = () => this.pollTrackChange(0);
+
   constructor(hls: Hls) {
-    super(hls, '[subtitle-track-controller]');
+    super(hls, 'subtitle-track-controller');
     this.registerListeners();
   }
 
@@ -50,7 +51,8 @@ class SubtitleTrackController extends BasePlaylistController {
     this.tracks.length = 0;
     this.tracksInGroup.length = 0;
     this.currentTrack = null;
-    this.onTextTracksChanged = this.asyncPollTrackChange = null as any;
+    // @ts-ignore
+    this.onTextTracksChanged = this.asyncPollTrackChange = null;
     super.destroy();
   }
 

package/src/controller/timeline-controller.ts

@@ -28,7 +28,6 @@ import type {
   BufferFlushingData,
   FragLoadingData,
 } from '../types/events';
-import { logger } from '../utils/logger';
 import type Hls from '../hls';
 import type { ComponentAPI } from '../types/component-api';
 import type { HlsConfig } from '../config';
@@ -136,17 +135,12 @@ export class TimelineController implements ComponentAPI {
   }
 
   private initCea608Parsers() {
-    if (
-      this.config.enableCEA708Captions &&
-      (!this.cea608Parser1 || !this.cea608Parser2)
-    ) {
-      const channel1 = new OutputFilter(this, 'textTrack1');
-      const channel2 = new OutputFilter(this, 'textTrack2');
-      const channel3 = new OutputFilter(this, 'textTrack3');
-      const channel4 = new OutputFilter(this, 'textTrack4');
-      this.cea608Parser1 = new Cea608Parser(1, channel1, channel2);
-      this.cea608Parser2 = new Cea608Parser(3, channel3, channel4);
-    }
+    const channel1 = new OutputFilter(this, 'textTrack1');
+    const channel2 = new OutputFilter(this, 'textTrack2');
+    const channel3 = new OutputFilter(this, 'textTrack3');
+    const channel4 = new OutputFilter(this, 'textTrack4');
+    this.cea608Parser1 = new Cea608Parser(1, channel1, channel2);
+    this.cea608Parser2 = new Cea608Parser(3, channel3, channel4);
   }
 
   public addCues(
@@ -410,7 +404,7 @@ export class TimelineController implements ComponentAPI {
             .filter((t) => t !== null)
             .map((t) => (t as TextTrack).label);
           if (unusedTextTracks.length) {
-            logger.warn(
+            this.hls.logger.warn(
               `Media element contains unused subtitle tracks: ${unusedTextTracks.join(
                 ', ',
               )}. Replace media element for each source to clear TextTracks and captions menu.`,
@@ -468,21 +462,19 @@ export class TimelineController implements ComponentAPI {
   }
 
   private onFragLoading(event: Events.FRAG_LOADING, data: FragLoadingData) {
-    this.initCea608Parsers();
-    const { cea608Parser1, cea608Parser2, lastCc, lastSn, lastPartIndex } =
-      this;
-    if (!this.enabled || !cea608Parser1 || !cea608Parser2) {
-      return;
-    }
     // if this frag isn't contiguous, clear the parser so cues with bad start/end times aren't added to the textTrack
-    if (data.frag.type === PlaylistLevelType.MAIN) {
+    if (this.enabled && data.frag.type === PlaylistLevelType.MAIN) {
+      const { cea608Parser1, cea608Parser2, lastSn } = this;
+      if (!cea608Parser1 || !cea608Parser2) {
+        return;
+      }
       const { cc, sn } = data.frag;
-      const partIndex = data?.part?.index ?? -1;
+      const partIndex = data.part?.index ?? -1;
       if (
         !(
           sn === lastSn + 1 ||
-          (sn === lastSn && partIndex === lastPartIndex + 1) ||
-          cc === lastCc
+          (sn === lastSn && partIndex === this.lastPartIndex + 1) ||
+          cc === this.lastCc
         )
       ) {
         cea608Parser1.reset();
@@ -550,7 +542,7 @@ export class TimelineController implements ComponentAPI {
         });
       },
       (error) => {
-        logger.log(`Failed to parse IMSC1: ${error}`);
+        hls.logger.log(`Failed to parse IMSC1: ${error}`);
         hls.trigger(Events.SUBTITLE_FRAG_PROCESSED, {
           success: false,
           frag: frag,
@@ -597,7 +589,7 @@ export class TimelineController implements ComponentAPI {
           this._fallbackToIMSC1(frag, payload);
         }
         // Something went wrong while parsing. Trigger event with success false.
-        logger.log(`Failed to parse VTT cue: ${error}`);
+        hls.logger.log(`Failed to parse VTT cue: ${error}`);
         if (missingInitPTS && maxAvCC > frag.cc) {
           return;
         }
@@ -669,9 +661,7 @@ export class TimelineController implements ComponentAPI {
     event: Events.FRAG_PARSING_USERDATA,
     data: FragParsingUserdataData,
   ) {
-    this.initCea608Parsers();
-    const { cea608Parser1, cea608Parser2 } = this;
-    if (!this.enabled || !cea608Parser1 || !cea608Parser2) {
+    if (!this.enabled || !this.config.enableCEA708Captions) {
       return;
     }
     const { frag, samples } = data;
@@ -686,9 +676,12 @@ export class TimelineController implements ComponentAPI {
     for (let i = 0; i < samples.length; i++) {
       const ccBytes = samples[i].bytes;
       if (ccBytes) {
+        if (!this.cea608Parser1) {
+          this.initCea608Parsers();
+        }
         const ccdatas = this.extractCea608Data(ccBytes);
-        cea608Parser1.addData(samples[i].pts, ccdatas[0]);
-        cea608Parser2.addData(samples[i].pts, ccdatas[1]);
+        this.cea608Parser1!.addData(samples[i].pts, ccdatas[0]);
+        this.cea608Parser2!.addData(samples[i].pts, ccdatas[1]);
       }
     }
   }