@posthog/rrweb-player 0.0.25 → 0.0.27

package/dist/rrweb-player.umd.cjs

@@ -11772,6 +11772,11 @@ class Replayer {
     __publicField2(this, "lastSelectionData", null);
     __publicField2(this, "constructedStyleMutations", []);
     __publicField2(this, "adoptedStyleSheets", []);
+    __publicField2(this, "emitterHandlers", []);
+    __publicField2(this, "serviceSubscription");
+    __publicField2(this, "speedServiceSubscription");
+    __publicField2(this, "timeouts", /* @__PURE__ */ new Set());
+    __publicField2(this, "styleSheetLoadListeners", /* @__PURE__ */ new Map());
     __publicField2(this, "handleResize", (dimension) => {
       this.iframe.style.display = "inherit";
       for (const el of [this.mouseTail, this.iframe]) {
@@ -11931,12 +11936,12 @@ class Replayer {
     this.handleResize = this.handleResize.bind(this);
     this.getCastFn = this.getCastFn.bind(this);
     this.applyEventsSynchronously = this.applyEventsSynchronously.bind(this);
-    this.emitter.on(ReplayerEvents.Resize, this.handleResize);
+    this.addEmitterHandler(ReplayerEvents.Resize, this.handleResize);
     this.setupDom();
     for (const plugin of this.config.plugins || []) {
       if (plugin.getMirror) plugin.getMirror({ nodeMirror: this.mirror });
     }
-    this.emitter.on(ReplayerEvents.Flush, () => {
+    const flushHandler = () => {
       if (this.usingVirtualDom) {
         const replayerHandler = {
           mirror: this.mirror,
@@ -12032,13 +12037,15 @@ class Replayer {
         this.applySelection(this.lastSelectionData);
         this.lastSelectionData = null;
       }
-    });
-    this.emitter.on(ReplayerEvents.PlayBack, () => {
+    };
+    this.addEmitterHandler(ReplayerEvents.Flush, flushHandler);
+    const playBackHandler = () => {
       this.firstFullSnapshot = null;
       this.mirror.reset();
       this.styleMirror.reset();
       this.mediaManager.reset();
-    });
+    };
+    this.addEmitterHandler(ReplayerEvents.PlayBack, playBackHandler);
     const timer = new Timer([], {
       speed: this.config.speed
     });
@@ -12062,7 +12069,7 @@ class Replayer {
       }
     );
     this.service.start();
-    this.service.subscribe((state) => {
+    this.serviceSubscription = this.service.subscribe((state) => {
       this.emitter.emit(ReplayerEvents.StateChange, {
         player: state
       });
@@ -12072,7 +12079,7 @@ class Replayer {
       timer
     });
     this.speedService.start();
-    this.speedService.subscribe((state) => {
+    this.speedServiceSubscription = this.speedService.subscribe((state) => {
       this.emitter.emit(ReplayerEvents.StateChange, {
         speed: state
       });
@@ -12092,7 +12099,7 @@ class Replayer {
     );
     if (firstMeta) {
       const { width, height } = firstMeta.data;
-      setTimeout(() => {
+      this.addTimeout(() => {
         this.emitter.emit(ReplayerEvents.Resize, {
           width,
           height
@@ -12100,7 +12107,7 @@ class Replayer {
       }, 0);
     }
     if (firstFullsnapshot) {
-      setTimeout(() => {
+      this.addTimeout(() => {
         var _a2;
         if (this.firstFullSnapshot) {
           return;
@@ -12129,6 +12136,24 @@ class Replayer {
     this.emitter.off(event, handler);
     return this;
   }
+  /**
+   * Track emitter handlers for cleanup
+   */
+  addEmitterHandler(event, handler) {
+    this.emitter.on(event, handler);
+    this.emitterHandlers.push({ event, handler });
+  }
+  /**
+   * Track timeouts for cleanup
+   */
+  addTimeout(callback, delay) {
+    const timeout = setTimeout(() => {
+      this.timeouts.delete(timeout);
+      callback();
+    }, delay);
+    this.timeouts.add(timeout);
+    return timeout;
+  }
   setConfig(config) {
     Object.keys(config).forEach((key) => {
       config[key];
@@ -12231,10 +12256,31 @@ class Replayer {
    * Memory occupation can be released by removing all references to this replayer.
    */
   destroy() {
+    var _a2, _b2;
+    if (!this.wrapper || !this.wrapper.parentNode) {
+      return;
+    }
     this.pause();
+    this.emitterHandlers.forEach(({ event, handler }) => {
+      this.emitter.off(event, handler);
+    });
+    this.emitterHandlers = [];
+    (_a2 = this.serviceSubscription) == null ? void 0 : _a2.unsubscribe();
+    (_b2 = this.speedServiceSubscription) == null ? void 0 : _b2.unsubscribe();
+    this.serviceSubscription = void 0;
+    this.speedServiceSubscription = void 0;
+    this.timeouts.forEach((timeout) => clearTimeout(timeout));
+    this.timeouts.clear();
+    this.styleSheetLoadListeners.forEach((handler, element2) => {
+      element2.removeEventListener("load", handler);
+    });
+    this.styleSheetLoadListeners.clear();
+    this.imageMap.clear();
+    this.canvasEventMap.clear();
     this.mirror.reset();
     this.styleMirror.reset();
     this.mediaManager.reset();
+    this.resetCache();
     this.config.root.removeChild(this.wrapper);
     this.emitter.emit(ReplayerEvents.Destroy);
   }