From a6054030292b9784be293587cce4263ffa0b5867 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pawe=C5=82=20Domas?= <pawel@vowel.com>
Date: Tue, 4 May 2021 14:49:24 -0500
Subject: [PATCH] fix(Video.js): prevent DOMException: The play() request was
 interrupted by a new load request

---
 react/features/base/media/components/web/Video.js | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/react/features/base/media/components/web/Video.js b/react/features/base/media/components/web/Video.js
index c140228ca..da0e3859a 100644
--- a/react/features/base/media/components/web/Video.js
+++ b/react/features/base/media/components/web/Video.js
@@ -144,6 +144,7 @@ type Props = {
  */
 class Video extends Component<Props> {
     _videoElement: ?Object;
+    _mounted: boolean;
 
     /**
      * Default values for {@code Video} component's properties.
@@ -189,6 +190,8 @@ class Video extends Component<Props> {
      * @returns {void}
      */
     componentDidMount() {
+        this._mounted = true;
+
         if (this._videoElement) {
             this._videoElement.volume = 0;
             this._videoElement.onplaying = this._onVideoPlaying;
@@ -200,7 +203,14 @@ class Video extends Component<Props> {
             // Ensure the video gets play() called on it. This may be necessary in the
             // case where the local video container was moved and re-attached, in which
             // case video does not autoplay.
-            this._videoElement.play();
+            this._videoElement.play()
+                .catch(error => {
+                    // Prevent uncaught "DOMException: The play() request was interrupted by a new load request"
+                    // when video playback takes long to start and it starts after the component was unmounted.
+                    if (this._mounted) {
+                        throw error;
+                    }
+                });
         }
     }
 
@@ -212,6 +222,7 @@ class Video extends Component<Props> {
      * @returns {void}
      */
     componentWillUnmount() {
+        this._mounted = false;
         this._detachTrack(this.props.videoTrack);
     }