videomail-client 15.7.18 → 15.8.0

package/dist/cjs/index.cjs

@@ -10972,7 +10972,7 @@ var __webpack_exports__ = {};
     var client = __webpack_require__("Q");
     var client_default = /*#__PURE__*/ __webpack_require__.n(client);
     var package_namespaceObject = {
-        rE: "15.7.18"
+        rE: "15.8.0"
     };
     function isAudioEnabled(options) {
         return Boolean(options.audio.enabled);
@@ -19276,9 +19276,10 @@ var __webpack_exports__ = {};
         setVisualStream(localMediaStream) {
             if (localMediaStream) this.attachMediaStream(localMediaStream);
             else {
-                var _this_rawVisualUserMedia, _this_rawVisualUserMedia1;
-                null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) || _this_rawVisualUserMedia.removeAttribute("srcObject");
-                null == (_this_rawVisualUserMedia1 = this.rawVisualUserMedia) || _this_rawVisualUserMedia1.removeAttribute("src");
+                if (this.rawVisualUserMedia) {
+                    this.rawVisualUserMedia.srcObject = null;
+                    this.rawVisualUserMedia.removeAttribute("src");
+                }
                 this.currentVisualStream = void 0;
             }
         }
@@ -19288,26 +19289,21 @@ var __webpack_exports__ = {};
             return !(null == (_this_currentVisualStream = this.currentVisualStream) ? void 0 : _this_currentVisualStream.active);
         }
         hasInvalidDimensions() {
-            var _this_rawVisualUserMedia, _this_rawVisualUserMedia1;
-            if ((null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) ? void 0 : _this_rawVisualUserMedia.videoWidth) && this.rawVisualUserMedia.videoWidth < 3 || (null == (_this_rawVisualUserMedia1 = this.rawVisualUserMedia) ? void 0 : _this_rawVisualUserMedia1.height) && this.rawVisualUserMedia.height < 3) return true;
-            return false;
+            if (!this.rawVisualUserMedia) return false;
+            const { videoWidth, videoHeight } = this.rawVisualUserMedia;
+            return videoWidth > 0 && videoWidth < 3 || videoHeight > 0 && videoHeight < 3;
         }
         logEvent(eventType, params) {
             this.options.logger.debug(`UserMedia: ... ${EVENT_ASCII} event ${eventType}: ${util_pretty(params)}`);
         }
-        outputEvent(e) {
-            var _this_rawVisualUserMedia, _this_rawVisualUserMedia1;
-            this.logEvent(e.type, {
-                readyState: null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) ? void 0 : _this_rawVisualUserMedia.readyState
-            });
-            null == (_this_rawVisualUserMedia1 = this.rawVisualUserMedia) || _this_rawVisualUserMedia1.removeEventListener(e.type, this.outputEvent.bind(this));
-        }
         unloadRemainingEventListeners() {
+            var _this_rawVisualUserMedia;
             this.options.logger.debug("UserMedia: unloadRemainingEventListeners()");
             mediaEvents.forEach((eventName)=>{
                 var _this_rawVisualUserMedia;
-                null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) || _this_rawVisualUserMedia.removeEventListener(eventName, this.outputEvent.bind(this));
+                null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) || _this_rawVisualUserMedia.removeEventListener(eventName, this.outputEvent);
             });
+            null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) || _this_rawVisualUserMedia.removeEventListener("error", this.handleMediaError);
         }
         audioRecord(audioCallback) {
             var _this_audioRecorder;
@@ -19418,7 +19414,7 @@ var __webpack_exports__ = {};
                 }
             };
             try {
-                var _this_rawVisualUserMedia, _this_rawVisualUserMedia1, _this_rawVisualUserMedia2;
+                var _this_rawVisualUserMedia, _this_rawVisualUserMedia1, _this_rawVisualUserMedia2, _this_rawVisualUserMedia3;
                 const videoTrack = media_getFirstVideoTrack(localMediaStream);
                 this.videoTrackLabel = null == videoTrack ? void 0 : videoTrack.label;
                 if (videoTrack) if (videoTrack.enabled) if (util_isVirtualCamera(videoTrack)) throw error_createError({
@@ -19440,9 +19436,8 @@ var __webpack_exports__ = {};
                 else this.options.logger.debug("UserMedia: detected (but no video tracks exist");
                 null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) || _this_rawVisualUserMedia.addEventListener("loadedmetadata", onLoadedMetaData);
                 null == (_this_rawVisualUserMedia1 = this.rawVisualUserMedia) || _this_rawVisualUserMedia1.addEventListener("play", onPlay);
-                null == (_this_rawVisualUserMedia2 = this.rawVisualUserMedia) || _this_rawVisualUserMedia2.addEventListener("error", (err)=>{
-                    this.options.logger.warn(`Caught video element error event: ${util_pretty(err)}`);
-                });
+                null == (_this_rawVisualUserMedia2 = this.rawVisualUserMedia) || _this_rawVisualUserMedia2.removeEventListener("error", this.handleMediaError);
+                null == (_this_rawVisualUserMedia3 = this.rawVisualUserMedia) || _this_rawVisualUserMedia3.addEventListener("error", this.handleMediaError);
                 this.setVisualStream(localMediaStream);
                 play();
             } catch (exc) {
@@ -19455,8 +19450,8 @@ var __webpack_exports__ = {};
             return this.videoTrackLabel;
         }
         isReady() {
-            var _this_rawVisualUserMedia;
-            return Boolean(null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) ? void 0 : _this_rawVisualUserMedia.src);
+            var _this_rawVisualUserMedia, _this_rawVisualUserMedia1;
+            return Boolean((null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) ? void 0 : _this_rawVisualUserMedia.srcObject) || (null == (_this_rawVisualUserMedia1 = this.rawVisualUserMedia) ? void 0 : _this_rawVisualUserMedia1.currentSrc));
         }
         stop(visualStream, params) {
             try {
@@ -19560,12 +19555,20 @@ var __webpack_exports__ = {};
             };
         }
         constructor(recorder, options){
-            super("UserMedia", options), userMedia_define_property(this, "recorder", void 0), userMedia_define_property(this, "rawVisualUserMedia", void 0), userMedia_define_property(this, "paused", false), userMedia_define_property(this, "recording", false), userMedia_define_property(this, "audioRecorder", void 0), userMedia_define_property(this, "currentVisualStream", void 0), userMedia_define_property(this, "onPlayReached", false), userMedia_define_property(this, "onLoadedMetaDataReached", false), userMedia_define_property(this, "playingPromiseReached", false), userMedia_define_property(this, "videoTrackLabel", void 0);
+            super("UserMedia", options), userMedia_define_property(this, "recorder", void 0), userMedia_define_property(this, "rawVisualUserMedia", void 0), userMedia_define_property(this, "paused", false), userMedia_define_property(this, "recording", false), userMedia_define_property(this, "audioRecorder", void 0), userMedia_define_property(this, "currentVisualStream", void 0), userMedia_define_property(this, "onPlayReached", false), userMedia_define_property(this, "onLoadedMetaDataReached", false), userMedia_define_property(this, "playingPromiseReached", false), userMedia_define_property(this, "videoTrackLabel", void 0), userMedia_define_property(this, "outputEvent", (e)=>{
+                var _this_rawVisualUserMedia, _this_rawVisualUserMedia1;
+                this.logEvent(e.type, {
+                    readyState: null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) ? void 0 : _this_rawVisualUserMedia.readyState
+                });
+                null == (_this_rawVisualUserMedia1 = this.rawVisualUserMedia) || _this_rawVisualUserMedia1.removeEventListener(e.type, this.outputEvent);
+            }), userMedia_define_property(this, "handleMediaError", (event)=>{
+                this.options.logger.warn(`Caught video element error event: ${util_pretty(event)}`);
+            });
             this.recorder = recorder;
             this.rawVisualUserMedia = recorder.getRawVisualUserMedia();
             mediaEvents.forEach((eventName)=>{
                 var _this_rawVisualUserMedia;
-                null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) || _this_rawVisualUserMedia.addEventListener(eventName, this.outputEvent.bind(this), false);
+                null == (_this_rawVisualUserMedia = this.rawVisualUserMedia) || _this_rawVisualUserMedia.addEventListener(eventName, this.outputEvent, false);
             });
         }
     }
@@ -19627,13 +19630,16 @@ var __webpack_exports__ = {};
             }
         }
         sendPings() {
+            this.stopPings();
             this.pingInterval = window.setInterval(()=>{
                 this.options.logger.debug("Recorder: pinging...");
                 this.writeStream(Buffer.from(""));
             }, this.options.timeouts.pingInterval);
         }
         stopPings() {
-            clearInterval(this.pingInterval);
+            if (void 0 === this.pingInterval) return;
+            window.clearInterval(this.pingInterval);
+            this.pingInterval = void 0;
         }
         onAudioSample(audioSample) {
             this.samplesCount++;
@@ -19664,13 +19670,13 @@ var __webpack_exports__ = {};
             }
         }
         clearRetryTimeout() {
-            if (!this.retryTimeout) return;
+            if (void 0 === this.retryTimeout) return;
             this.options.logger.debug("Recorder: clearRetryTimeout()");
             window.clearTimeout(this.retryTimeout);
             this.retryTimeout = void 0;
         }
         clearConnectionTimeout() {
-            if (!this.connectionTimeout) return;
+            if (void 0 === this.connectionTimeout) return;
             this.options.logger.debug("Recorder: clearConnectionTimeout()");
             window.clearTimeout(this.connectionTimeout);
             this.connectionTimeout = void 0;
@@ -19999,19 +20005,23 @@ var __webpack_exports__ = {};
             const characteristics = null == (_this_userMedia = this.userMedia) ? void 0 : _this_userMedia.getCharacteristics();
             this.options.logger.debug(`Recorder: userMediaErrorCallback(), name: ${err.name}, message: ${err.message} and Webcam characteristics: ${characteristics ? util_pretty(characteristics) : "none"}`);
             const errorListeners = this.getListeners("ERROR");
-            if (null == errorListeners ? void 0 : errorListeners.length) {
-                if (err.name !== error_VideomailError.MEDIA_DEVICE_NOT_SUPPORTED) {
-                    const videomailError = error_createError({
-                        err,
-                        options: this.options,
-                        usedConstraints
-                    });
-                    this.emit("ERROR", {
-                        err: videomailError
-                    });
-                } else this.options.logger.debug(`Recorder: ignore user media error ${util_pretty(err)}`);
-                this.retryTimeout = window.setTimeout(this.initSocket.bind(this), this.options.timeouts.userMedia);
-            } else if (this.unloaded) this.options.logger.debug(`Recorder: already unloaded. Not going to throw error ${util_pretty(err)}`);
+            if (null == errorListeners ? void 0 : errorListeners.length) if (err.name !== error_VideomailError.MEDIA_DEVICE_NOT_SUPPORTED) {
+                const videomailError = error_createError({
+                    err,
+                    options: this.options,
+                    usedConstraints
+                });
+                this.emit("ERROR", {
+                    err: videomailError
+                });
+            } else {
+                this.options.logger.debug(`Recorder: ignore user media error ${util_pretty(err)}`);
+                this.retryTimeout = window.setTimeout(()=>{
+                    this.retryTimeout = void 0;
+                    this.loadUserMedia();
+                }, this.options.timeouts.userMedia);
+            }
+            else if (this.unloaded) this.options.logger.debug(`Recorder: already unloaded. Not going to throw error ${util_pretty(err)}`);
             else {
                 this.options.logger.debug(`Recorder: no error listeners attached but throwing error ${util_pretty(err)}`);
                 throw error_createError({
@@ -20235,7 +20245,8 @@ var __webpack_exports__ = {};
                 limitReached
             });
             null == (_this_loop = this.loop) || _this_loop.complete();
-            setTimeout(()=>{
+            this.stopTimeout = window.setTimeout(()=>{
+                this.stopTimeout = void 0;
                 this.stopTime = Date.now();
                 const videoType = this.replay.getVideoType();
                 if (!videoType) throw new Error("Unable to video record when no video type is defined.");
@@ -20285,6 +20296,9 @@ var __webpack_exports__ = {};
             this.reset();
             this.clearUserMediaTimeout();
             this.clearConnectionTimeout();
+            this.clearRetryTimeout();
+            this.clearStopTimeout();
+            this.stopPings();
             this.connecting = false;
             if (this.userMedia) this.userMedia.unloadRemainingEventListeners();
             if (this.submitting) ;
@@ -20308,12 +20322,17 @@ var __webpack_exports__ = {};
             }
         }
         clearUserMediaTimeout() {
-            if (this.userMediaTimeout) {
+            if (void 0 !== this.userMediaTimeout) {
                 this.options.logger.debug("Recorder: clearUserMediaTimeout()");
                 window.clearTimeout(this.userMediaTimeout);
                 this.userMediaTimeout = void 0;
             }
         }
+        clearStopTimeout() {
+            if (void 0 === this.stopTimeout) return;
+            window.clearTimeout(this.stopTimeout);
+            this.stopTimeout = void 0;
+        }
         validate() {
             return this.connected && void 0 === this.canvas;
         }
@@ -20697,7 +20716,7 @@ var __webpack_exports__ = {};
             return this.userMediaLoaded;
         }
         constructor(visuals, replay, options){
-            super("Recorder", options), recorder_define_property(this, "visuals", void 0), recorder_define_property(this, "replay", void 0), recorder_define_property(this, "loop", void 0), recorder_define_property(this, "originalAnimationFrameObject", void 0), recorder_define_property(this, "samplesCount", 0), recorder_define_property(this, "framesCount", 0), recorder_define_property(this, "recordingStats", void 0), recorder_define_property(this, "confirmedFrameNumber", 0), recorder_define_property(this, "confirmedSampleNumber", 0), recorder_define_property(this, "recorderElement", void 0), recorder_define_property(this, "userMedia", void 0), recorder_define_property(this, "userMediaTimeout", void 0), recorder_define_property(this, "retryTimeout", void 0), recorder_define_property(this, "connectionTimeout", void 0), recorder_define_property(this, "frameProgress", void 0), recorder_define_property(this, "sampleProgress", void 0), recorder_define_property(this, "canvas", void 0), recorder_define_property(this, "ctx", void 0), recorder_define_property(this, "userMediaLoaded", void 0), recorder_define_property(this, "userMediaLoading", false), recorder_define_property(this, "submitting", false), recorder_define_property(this, "unloaded", void 0), recorder_define_property(this, "stopTime", void 0), recorder_define_property(this, "stream", void 0), recorder_define_property(this, "connecting", false), recorder_define_property(this, "connected", false), recorder_define_property(this, "connectionFailed", false), recorder_define_property(this, "blocking", false), recorder_define_property(this, "built", false), recorder_define_property(this, "key", void 0), recorder_define_property(this, "waitingTime", void 0), recorder_define_property(this, "connectingStartedAt", void 0), recorder_define_property(this, "lastCloseEvent", void 0), recorder_define_property(this, "lastSocketError", void 0), recorder_define_property(this, "pingInterval", void 0), recorder_define_property(this, "frame", void 0), recorder_define_property(this, "recordingBuffer", void 0), recorder_define_property(this, "facingMode", void 0);
+            super("Recorder", options), recorder_define_property(this, "visuals", void 0), recorder_define_property(this, "replay", void 0), recorder_define_property(this, "loop", void 0), recorder_define_property(this, "originalAnimationFrameObject", void 0), recorder_define_property(this, "samplesCount", 0), recorder_define_property(this, "framesCount", 0), recorder_define_property(this, "recordingStats", void 0), recorder_define_property(this, "confirmedFrameNumber", 0), recorder_define_property(this, "confirmedSampleNumber", 0), recorder_define_property(this, "recorderElement", void 0), recorder_define_property(this, "userMedia", void 0), recorder_define_property(this, "userMediaTimeout", void 0), recorder_define_property(this, "retryTimeout", void 0), recorder_define_property(this, "connectionTimeout", void 0), recorder_define_property(this, "stopTimeout", void 0), recorder_define_property(this, "frameProgress", void 0), recorder_define_property(this, "sampleProgress", void 0), recorder_define_property(this, "canvas", void 0), recorder_define_property(this, "ctx", void 0), recorder_define_property(this, "userMediaLoaded", void 0), recorder_define_property(this, "userMediaLoading", false), recorder_define_property(this, "submitting", false), recorder_define_property(this, "unloaded", void 0), recorder_define_property(this, "stopTime", void 0), recorder_define_property(this, "stream", void 0), recorder_define_property(this, "connecting", false), recorder_define_property(this, "connected", false), recorder_define_property(this, "connectionFailed", false), recorder_define_property(this, "blocking", false), recorder_define_property(this, "built", false), recorder_define_property(this, "key", void 0), recorder_define_property(this, "waitingTime", void 0), recorder_define_property(this, "connectingStartedAt", void 0), recorder_define_property(this, "lastCloseEvent", void 0), recorder_define_property(this, "lastSocketError", void 0), recorder_define_property(this, "pingInterval", void 0), recorder_define_property(this, "frame", void 0), recorder_define_property(this, "recordingBuffer", void 0), recorder_define_property(this, "facingMode", void 0);
             this.visuals = visuals;
             this.replay = replay;
             this.facingMode = options.video.facingMode;
@@ -20794,14 +20813,13 @@ var __webpack_exports__ = {};
             if (hasAudio) this.replayElement.volume = 1;
             else if (!isAudioEnabled(this.options)) this.replayElement.setAttribute("muted", "true");
             this.replayElement.load();
-            if (this.videomail) this.replayElement.addEventListener("canplaythrough", ()=>{
-                this.emit("REPLAY_SHOWN");
-            }, {
-                once: true
-            });
-            else this.replayElement.addEventListener("canplaythrough", ()=>{
-                this.emit("PREVIEW_SHOWN");
-            }, {
+            if (this.canPlayThroughHandler) this.replayElement.removeEventListener("canplaythrough", this.canPlayThroughHandler);
+            const eventName = this.videomail ? "REPLAY_SHOWN" : "PREVIEW_SHOWN";
+            this.canPlayThroughHandler = ()=>{
+                this.canPlayThroughHandler = void 0;
+                this.emit(eventName);
+            };
+            this.replayElement.addEventListener("canplaythrough", this.canPlayThroughHandler, {
                 once: true
             });
         }
@@ -20824,49 +20842,27 @@ var __webpack_exports__ = {};
                     null == (_this_replayElement = this.replayElement) || _this_replayElement.setAttribute("controls", "controls");
                     this.show(null == params ? void 0 : params.width, null == params ? void 0 : params.height, null == params ? void 0 : params.hasAudio);
                 });
-                this.replayElement.addEventListener("touchstart", (e)=>{
-                    var _this_replayElement;
-                    e.preventDefault();
-                    if (null == (_this_replayElement = this.replayElement) ? void 0 : _this_replayElement.paused) this.replayElement.play().catch((exc)=>{
-                        throw error_createError({
-                            message: "Failed to play replay video while paused upon touchstart event.",
-                            exc,
-                            options: this.options
-                        });
-                    });
-                    else {
-                        var _this_replayElement1;
-                        null == (_this_replayElement1 = this.replayElement) || _this_replayElement1.pause();
-                    }
-                }, {
-                    passive: true
-                });
-                this.replayElement.addEventListener("click", (e)=>{
-                    var _this_replayElement;
-                    e.preventDefault();
-                    if (null == (_this_replayElement = this.replayElement) ? void 0 : _this_replayElement.paused) this.replayElement.play().catch((exc)=>{
-                        throw error_createError({
-                            message: "Failed to play replay video while paused upon click event.",
-                            exc,
-                            options: this.options
-                        });
-                    });
-                    else {
-                        var _this_replayElement1;
-                        null == (_this_replayElement1 = this.replayElement) || _this_replayElement1.pause();
-                    }
-                });
+                this.replayElement.addEventListener("touchstart", this.togglePlayback);
+                this.replayElement.addEventListener("click", this.togglePlayback);
             }
             this.built = true;
             this.options.logger.debug("Replay: built.");
         }
         unload(params) {
+            var _this_replayElement, _this_replayElement1;
             this.options.logger.debug("Replay: unload()");
+            if (this.canPlayThroughHandler) {
+                var _this_replayElement2;
+                null == (_this_replayElement2 = this.replayElement) || _this_replayElement2.removeEventListener("canplaythrough", this.canPlayThroughHandler);
+                this.canPlayThroughHandler = void 0;
+            }
+            null == (_this_replayElement = this.replayElement) || _this_replayElement.removeEventListener("touchstart", this.togglePlayback);
+            null == (_this_replayElement1 = this.replayElement) || _this_replayElement1.removeEventListener("click", this.togglePlayback);
             this.removeAllListeners();
             if (null == params ? void 0 : params.startingOver) this.hide();
             else {
-                var _this_replayElement;
-                null == (_this_replayElement = this.replayElement) || _this_replayElement.remove();
+                var _this_replayElement3;
+                null == (_this_replayElement3 = this.replayElement) || _this_replayElement3.remove();
                 this.replayElement = void 0;
             }
             this.videomail = void 0;
@@ -20908,7 +20904,7 @@ var __webpack_exports__ = {};
             let source = this.getVideoSource(type);
             let url = src;
             if (url && bustCache) url += `?${Date.now()}`;
-            if (source) if (src) source.setAttribute("src", src);
+            if (source) if (url) source.setAttribute("src", url);
             else source.remove();
             else if (src) {
                 const { fps } = this.options.video;
@@ -20972,7 +20968,24 @@ var __webpack_exports__ = {};
             return this.replayElement;
         }
         constructor(visuals, options){
-            super("Replay", options), replay_define_property(this, "visuals", void 0), replay_define_property(this, "built", false), replay_define_property(this, "replayElement", void 0), replay_define_property(this, "videomail", void 0);
+            super("Replay", options), replay_define_property(this, "visuals", void 0), replay_define_property(this, "built", false), replay_define_property(this, "replayElement", void 0), replay_define_property(this, "videomail", void 0), replay_define_property(this, "canPlayThroughHandler", void 0), replay_define_property(this, "togglePlayback", (e)=>{
+                var _this_replayElement;
+                e.preventDefault();
+                if (null == (_this_replayElement = this.replayElement) ? void 0 : _this_replayElement.paused) this.replayElement.play().catch((exc)=>{
+                    const err = error_createError({
+                        message: `Failed to play replay video upon ${e.type} event.`,
+                        exc,
+                        options: this.options
+                    });
+                    this.emit("ERROR", {
+                        err
+                    });
+                });
+                else {
+                    var _this_replayElement1;
+                    null == (_this_replayElement1 = this.replayElement) || _this_replayElement1.pause();
+                }
+            });
             this.visuals = visuals;
         }
     }
@@ -21395,18 +21408,11 @@ var __webpack_exports__ = {};
         }
         initEvents(playerOnly = false) {
             this.options.logger.debug(`Container: initEvents (playerOnly = ${playerOnly})`);
-            if (this.options.recalculateDimensionsOnWindowResize) window.addEventListener("resize", ()=>{
-                if (!this.built) return;
-                this.emit("WINDOW_RESIZE", "container");
-            });
-            if (this.options.enableAutoUnload) window.addEventListener("beforeunload", (e)=>{
-                this.unload({
-                    e
-                });
-            }, {
+            if (this.options.recalculateDimensionsOnWindowResize) window.addEventListener("resize", this.handleWindowResize);
+            if (this.options.enableAutoUnload) window.addEventListener("beforeunload", this.handleBeforeUnload, {
                 once: true
             });
-            if (!playerOnly) this.visibility.onChange((visible)=>{
+            if (!playerOnly) this.stopListeningToVisibility = this.visibility.onChange((visible)=>{
                 if (this.built) if (visible) {
                     if (isAutoPauseEnabled(this.options) && this.isCountingDown()) this.resume();
                     this.emit("VISIBLE");
@@ -21416,19 +21422,7 @@ var __webpack_exports__ = {};
                 }
             });
             if (this.options.enableSpace) {
-                if (!playerOnly) window.addEventListener("keydown", (e)=>{
-                    const element = e.target;
-                    const tagName = element.tagName;
-                    const isEditable = element.isContentEditable || "true" === element.contentEditable;
-                    if (!isEditable && tagName && "INPUT" !== tagName.toUpperCase() && "TEXTAREA" !== tagName.toUpperCase()) {
-                        const code = e.code;
-                        if ("Space" === code) {
-                            e.preventDefault();
-                            if (this.options.enablePause) this.visuals.pauseOrResume();
-                            else this.visuals.recordOrStop();
-                        }
-                    }
-                });
+                if (!playerOnly) window.addEventListener("keydown", this.handleKeyDown);
             }
             this.on("ERROR", (params)=>{
                 this.processError(params);
@@ -21465,6 +21459,14 @@ var __webpack_exports__ = {};
             }
             this.endWaiting();
         }
+        removeBrowserEventListeners() {
+            var _this_stopListeningToVisibility, _this;
+            window.removeEventListener("resize", this.handleWindowResize);
+            window.removeEventListener("beforeunload", this.handleBeforeUnload);
+            window.removeEventListener("keydown", this.handleKeyDown);
+            null == (_this_stopListeningToVisibility = (_this = this).stopListeningToVisibility) || _this_stopListeningToVisibility.call(_this);
+            this.stopListeningToVisibility = void 0;
+        }
         hideMySelf() {
             html_hideElement(this.containerElement);
         }
@@ -21536,6 +21538,7 @@ var __webpack_exports__ = {};
                     exc
                 });
             } finally{
+                this.removeBrowserEventListeners();
                 this.removeAllListeners();
                 this.built = this.submitted = false;
             }
@@ -21817,7 +21820,22 @@ var __webpack_exports__ = {};
             this.visuals.setLimitSeconds(limitSeconds);
         }
         constructor(options){
-            super("Container", options), container_define_property(this, "visibility", document_visibility_default()()), container_define_property(this, "htmlElement", document.querySelector("html")), container_define_property(this, "visuals", void 0), container_define_property(this, "buttons", void 0), container_define_property(this, "resource", void 0), container_define_property(this, "form", void 0), container_define_property(this, "hasError", false), container_define_property(this, "submitted", false), container_define_property(this, "lastValidation", false), container_define_property(this, "containerElement", void 0), container_define_property(this, "built", false);
+            super("Container", options), container_define_property(this, "visibility", document_visibility_default()()), container_define_property(this, "htmlElement", document.querySelector("html")), container_define_property(this, "visuals", void 0), container_define_property(this, "buttons", void 0), container_define_property(this, "resource", void 0), container_define_property(this, "form", void 0), container_define_property(this, "hasError", false), container_define_property(this, "submitted", false), container_define_property(this, "lastValidation", false), container_define_property(this, "containerElement", void 0), container_define_property(this, "built", false), container_define_property(this, "stopListeningToVisibility", void 0), container_define_property(this, "handleWindowResize", ()=>{
+                if (this.built) this.emit("WINDOW_RESIZE", "container");
+            }), container_define_property(this, "handleBeforeUnload", (e)=>{
+                this.unload({
+                    e
+                });
+            }), container_define_property(this, "handleKeyDown", (e)=>{
+                const element = e.target;
+                const tagName = element.tagName;
+                const isEditable = element.isContentEditable || "true" === element.contentEditable;
+                if (!isEditable && tagName && "INPUT" !== tagName.toUpperCase() && "TEXTAREA" !== tagName.toUpperCase() && "Space" === e.code) {
+                    e.preventDefault();
+                    if (this.options.enablePause) this.visuals.pauseOrResume();
+                    else this.visuals.recordOrStop();
+                }
+            });
             this.visuals = new wrappers_visuals(this, options);
             this.buttons = new buttons(this, options);
             this.resource = new src_resource(options);