fix(viewer): Update volume icon after UI is loaded (#1066)

* fix(viewer): Update volume icon after UI is loaded * fix(viewer): move autoplay after loadUI
box · Sep 6, 2019 · 7c6a491 · 7c6a491
1 parent 9fccb6a
commit 7c6a491
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 20 deletions.
diff --git a/src/lib/viewers/media/DashViewer.js b/src/lib/viewers/media/DashViewer.js
@@ -572,12 +572,13 @@ class DashViewer extends VideoBaseViewer {
             return;
         }
 
+        this.calculateVideoDimensions();
+        this.loadUI();
+
         if (this.isAutoplayEnabled()) {
             this.autoplay();
         }
 
-        this.calculateVideoDimensions();
-        this.loadUI();
         this.loadFilmStrip();
         this.resize();
         this.handleVolume();

diff --git a/src/lib/viewers/media/MediaBaseViewer.js b/src/lib/viewers/media/MediaBaseViewer.js
@@ -175,9 +175,6 @@ class MediaBaseViewer extends BaseViewer {
             .then(() => {
                 this.startLoadTimer();
                 this.mediaEl.src = this.mediaUrl;
-                if (this.isAutoplayEnabled()) {
-                    this.autoplay();
-                }
             })
             .catch(this.handleAssetError);
     }
@@ -203,14 +200,20 @@ class MediaBaseViewer extends BaseViewer {
         if (this.destroyed) {
             return;
         }
+
+        this.loadUI();
+
+        if (this.isAutoplayEnabled()) {
+            this.autoplay();
+        }
+
         this.setMediaTime(this.startTimeInSeconds);
+        this.resize();
         this.handleVolume();
+
         this.loaded = true;
         this.emit(VIEWER_EVENT.load);
 
-        this.loadUI();
-        this.resize();
-
         // Make media element visible after resize
         this.showMedia();
 

diff --git a/src/lib/viewers/media/__tests__/MediaBaseViewer-test.js b/src/lib/viewers/media/__tests__/MediaBaseViewer-test.js
@@ -115,8 +115,6 @@ describe('lib/viewers/media/MediaBaseViewer', () => {
         beforeEach(() => {
             media.mediaEl = document.createElement('video');
             media.mediaEl.addEventListener = sandbox.stub();
-            sandbox.stub(media, 'isAutoplayEnabled').returns(false);
-            sandbox.stub(media, 'autoplay');
         });
 
         it('should load mediaUrl in the media element', () => {
@@ -138,16 +136,6 @@ describe('lib/viewers/media/MediaBaseViewer', () => {
             });
         });
 
-        it('should autoplay if enabled', () => {
-            media.isAutoplayEnabled.returns(true);
-            sandbox.stub(media, 'getRepStatus').returns({ getPromise: () => Promise.resolve() });
-            media.mediaEl = document.createElement('video');
-
-            return media.load().then(() => {
-                expect(media.autoplay).to.be.called;
-            });
-        });
-
         it('should invoke startLoadTimer()', () => {
             sandbox.stub(media, 'startLoadTimer');
             sandbox.stub(media, 'getRepStatus').returns({ getPromise: () => Promise.resolve() });
@@ -177,6 +165,16 @@ describe('lib/viewers/media/MediaBaseViewer', () => {
             expect(media.showMedia).to.be.called;
             expect(document.activeElement).to.equal(media.mediaContainerEl);
         });
+
+        it('should autoplay if enabled', () => {
+            sandbox.stub(media, 'isAutoplayEnabled').returns(true);
+            sandbox.stub(media, 'autoplay');
+            media.mediaEl = document.createElement('video');
+
+            media.loadeddataHandler();
+
+            expect(media.autoplay).to.be.called;
+        });
     });
 
     describe('showMedia()', () => {