Do not detach and reattach media if in an hls.js event loop (prevents…

… recursive calls when handlers call loadSource)

Resolves #3732

src/hls.ts

@@ -54,6 +54,7 @@ export default class Hls implements HlsEventEmitter {
   private emeController: EMEController;
 
   private _media: HTMLMediaElement | null = null;
+  private _eventLoop: Events | null = null;
   private url: string | null = null;
 
   static get version(): string {
@@ -235,7 +236,10 @@ export default class Hls implements HlsEventEmitter {
     name: E,
     eventObject: Parameters<HlsListeners[E]>[1]
   ): boolean {
-    return this._emitter.emit(event, name, eventObject);
+    this._eventLoop = event;
+    const result = this._emitter.emit(event, name, eventObject);
+    this._eventLoop = null;
+    return result;
   }
 
   trigger<E extends keyof HlsListeners>(
@@ -316,7 +320,7 @@ export default class Hls implements HlsEventEmitter {
   loadSource(url: string) {
     this.stopLoad();
     const media = this.media;
-    if (media && this.url) {
+    if (media && this.url && this._eventLoop === null) {
       this.detachMedia();
       this.attachMedia(media);
     }