diff --git a/browser/components/loop/content/shared/js/mixins.js b/browser/components/loop/content/shared/js/mixins.js index f51ea978fa47..9fe560b3a546 100644 --- a/browser/components/loop/content/shared/js/mixins.js +++ b/browser/components/loop/content/shared/js/mixins.js @@ -240,6 +240,18 @@ loop.shared.mixins = (function() { rootObject.removeEventListener("resize", this.updateVideoContainer); }, + /** + * Resets the dimensions cache, e.g. for when the session is ended, and + * before a new session, so that we always ensure we see an update when a + * new session is started. + */ + resetDimensionsCache: function() { + this._videoDimensionsCache = { + local: {}, + remote: {} + }; + }, + /** * Whenever the dimensions change of a video stream, this function is called * by `updateVideoDimensions` to store the new values and notifies the callee diff --git a/browser/components/loop/standalone/content/js/standaloneRoomViews.js b/browser/components/loop/standalone/content/js/standaloneRoomViews.js index 61b57c2691a0..d4c893ed8dbc 100644 --- a/browser/components/loop/standalone/content/js/standaloneRoomViews.js +++ b/browser/components/loop/standalone/content/js/standaloneRoomViews.js @@ -383,6 +383,12 @@ loop.standaloneRoomViews = (function(mozL10n) { this.updateVideoContainer(); } + if (nextState.roomState === ROOM_STATES.INIT || + nextState.roomState === ROOM_STATES.GATHER || + nextState.roomState === ROOM_STATES.READY) { + this.resetDimensionsCache(); + } + // When screen sharing stops. if (this.state.receivingScreenShare && !nextState.receivingScreenShare) { // Remove the custom screenshare styles on the remote camera. diff --git a/browser/components/loop/standalone/content/js/standaloneRoomViews.jsx b/browser/components/loop/standalone/content/js/standaloneRoomViews.jsx index d43c26300aba..7340c366f3c1 100644 --- a/browser/components/loop/standalone/content/js/standaloneRoomViews.jsx +++ b/browser/components/loop/standalone/content/js/standaloneRoomViews.jsx @@ -383,6 +383,12 @@ loop.standaloneRoomViews = (function(mozL10n) { this.updateVideoContainer(); } + if (nextState.roomState === ROOM_STATES.INIT || + nextState.roomState === ROOM_STATES.GATHER || + nextState.roomState === ROOM_STATES.READY) { + this.resetDimensionsCache(); + } + // When screen sharing stops. if (this.state.receivingScreenShare && !nextState.receivingScreenShare) { // Remove the custom screenshare styles on the remote camera. diff --git a/browser/components/loop/test/standalone/standaloneRoomViews_test.js b/browser/components/loop/test/standalone/standaloneRoomViews_test.js index f0c114913a14..86c4e291ac41 100644 --- a/browser/components/loop/test/standalone/standaloneRoomViews_test.js +++ b/browser/components/loop/test/standalone/standaloneRoomViews_test.js @@ -214,6 +214,19 @@ describe("loop.standaloneRoomViews", function() { sinon.assert.calledOnce(view.updateVideoContainer); }); + + it("should reset the video dimensions cache when the gather state is entered", function() { + activeRoomStore.setStoreState({roomState: ROOM_STATES.SESSION_CONNECTED}); + + var view = mountTestComponent(); + + activeRoomStore.setStoreState({roomState: ROOM_STATES.GATHER}); + + expect(view._videoDimensionsCache).eql({ + local: {}, + remote: {} + }); + }) }); describe("#publishStream", function() {