diff --git a/hls-video-element.d.ts b/hls-video-element.d.ts
index a3622a8..e9e5278 100644
--- a/hls-video-element.d.ts
+++ b/hls-video-element.d.ts
@@ -1,7 +1,11 @@
 import { CustomVideoElement } from 'custom-media-element';
 import Hls from 'hls.js';
 
-declare class HLSVideoElement extends CustomVideoElement {
+type HlsVideoElementConstructor<T> = { new(): T };
+
+export function HlsVideoMixin(superclass: any): HlsVideoElementConstructor<HLSVideoElement>;
+
+export class HLSVideoElement extends CustomVideoElement {
   /**
    * The current instance of the HLS.js library.
    *
@@ -18,11 +22,6 @@ declare class HLSVideoElement extends CustomVideoElement {
    */
   attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
 
-  /**
-   * Loads the HLS.js instance and attach it to the video element.
-   */
-  load(): Promise<void>;
-
   /**
    * Unloads the HLS.js instance and detaches it from the video element.
    */
diff --git a/hls-video-element.js b/hls-video-element.js
index 8481e94..d6fd4a2 100644
--- a/hls-video-element.js
+++ b/hls-video-element.js
@@ -92,8 +92,13 @@ const HlsVideoMixin = (superclass) => {
         this.api.on(Hls.Events.MANIFEST_PARSED, (event, data) => {
           removeAllMediaTracks();
 
-          const videoTrack = this.addVideoTrack('main');
-          videoTrack.selected = true;
+          let videoTrack = this.videoTracks.getTrackById('main');
+
+          if (!videoTrack) {
+            videoTrack = this.addVideoTrack('main');
+            videoTrack.id = 'main';
+            videoTrack.selected = true;
+          }
 
           for (const [id, level] of data.levels.entries()) {
             const videoRendition = videoTrack.addRendition(