Revert "fix(large-video): Prevents unnecessary updates when container is hidden"

This reverts commit 6deb0a6385.

modules/UI/videolayout/VideoLayout.js

@@ -158,11 +158,10 @@ const VideoLayout = {
 
             return;
         }
-
-        const state = APP.store.getState();
         const currentContainer = largeVideo.getCurrentContainer();
         const currentContainerType = largeVideo.getCurrentContainerType();
         const isOnLarge = this.isCurrentlyOnLarge(id);
+        const state = APP.store.getState();
         const participant = getParticipantById(state, id);
         const videoTrack = getVideoTrackByParticipant(state, participant);
         const videoStream = videoTrack?.jitsiTrack;

react/features/large-video/actions.any.ts

@@ -11,6 +11,7 @@ import {
     getVirtualScreenshareParticipantByOwnerId
 } from '../base/participants/functions';
 import { toState } from '../base/redux/functions';
+import { isStageFilmstripAvailable } from '../filmstrip/functions';
 import { getAutoPinSetting } from '../video-layout/functions';
 
 import {
@@ -18,7 +19,6 @@ import {
     SET_LARGE_VIDEO_DIMENSIONS,
     UPDATE_KNOWN_LARGE_VIDEO_RESOLUTION
 } from './actionTypes';
-import { shouldHideLargeVideo } from './functions';
 
 /**
  * Action to select the participant to be displayed in LargeVideo based on the
@@ -34,8 +34,12 @@ export function selectParticipantInLargeVideo(participant?: string) {
     return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         const state = getState();
 
-        // Skip large video updates when the large video container is hidden.
-        if (shouldHideLargeVideo(state)) {
+        if (isStageFilmstripAvailable(state, 2)) {
+            return;
+        }
+
+        // Keep Etherpad open.
+        if (state['features/etherpad'].editing) {
             return;
         }
 

react/features/large-video/functions.ts

@@ -1,7 +1,5 @@
 import { IReduxState } from '../app/types';
 import { getParticipantById } from '../base/participants/functions';
-import { isStageFilmstripAvailable } from '../filmstrip/functions';
-import { shouldDisplayTileView } from '../video-layout/functions.any';
 
 /**
  * Selector for the participant currently displaying on the large video.
@@ -14,17 +12,3 @@ export function getLargeVideoParticipant(state: IReduxState) {
 
     return getParticipantById(state, participantId ?? '');
 }
-
-/**
- * Determines whether the large video container should be hidden.
- * Large video is hidden in tile view, stage filmstrip mode (with multiple participants),
- * or when editing etherpad.
- *
- * @param {IReduxState} state - The Redux state.
- * @returns {boolean} True if large video should be hidden, false otherwise.
- */
-export function shouldHideLargeVideo(state: IReduxState): boolean {
-    return shouldDisplayTileView(state)
-        || isStageFilmstripAvailable(state, 2)
-        || Boolean(state['features/etherpad']?.editing);
-}

react/features/large-video/subscriber.any.ts

@@ -1,26 +0,0 @@
-import StateListenerRegistry from '../base/redux/StateListenerRegistry';
-
-import { SELECT_LARGE_VIDEO_PARTICIPANT } from './actionTypes';
-import { selectParticipantInLargeVideo } from './actions.any';
-import { shouldHideLargeVideo } from './functions';
-
-/**
- * Updates the large video when transitioning from a hidden state to visible state.
- * This ensures the large video is properly updated when exiting tile view, stage filmstrip,
- * whiteboard, or etherpad editing modes.
- */
-StateListenerRegistry.register(
-    /* selector */ state => shouldHideLargeVideo(state),
-    /* listener */ (isHidden, { dispatch }) => {
-        // When transitioning from hidden to visible state, select participant (because currently it is undefined).
-        // Otherwise set it to undefined because we don't show the large video.
-        if (!isHidden) {
-            dispatch(selectParticipantInLargeVideo());
-        } else {
-            dispatch({
-                type: SELECT_LARGE_VIDEO_PARTICIPANT,
-                participantId: undefined
-            });
-        }
-    }
-);

react/features/large-video/subscriber.native.ts

@@ -1 +0,0 @@
-import './subscriber.any';

react/features/large-video/subscriber.web.ts

@@ -4,7 +4,6 @@ import StateListenerRegistry from '../base/redux/StateListenerRegistry';
 import { getVideoTrackByParticipant } from '../base/tracks/functions.web';
 
 import { getLargeVideoParticipant } from './functions';
-import './subscriber.any';
 
 /**
  * Updates the on stage participant video.

tests/pageobjects/Filmstrip.ts

@@ -124,20 +124,6 @@ export default class Filmstrip extends BasePageObject {
         return await elem.isExisting() ? await elem.getAttribute('src') : null;
     }
 
-    /**
-     * Returns true if the endpoint is dominant speaker and false otherwise.
-     * Uses the dominant-speaker class on the video thumbnail in order to check.
-     *
-     * @param {string} endpointId - The endpoint id of the participant we want to check.
-     * @returns {boolean} - True if the endpoint is dominant speaker and false otherwise.
-     */
-    async isDominantSpeaker(endpointId: string) {
-        const elem = this.participant.driver.$(
-            `//span[@id='participant_${endpointId}' and contains(@class,'dominant-speaker')]`);
-
-        return await elem.isExisting();
-    }
-
     /**
      * Grants moderator rights to a participant.
      * @param participant

tests/specs/media/activeSpeaker.spec.ts

@@ -66,10 +66,10 @@ async function testActiveSpeaker(
     const otherParticipant1Driver = otherParticipant1.driver;
 
     await otherParticipant1Driver.waitUntil(
-        async () => await otherParticipant1.getFilmstrip().isDominantSpeaker(speakerEndpoint),
+        async () => await otherParticipant1.getLargeVideo().getResource() === speakerEndpoint,
         {
             timeout: 30_000, // 30 seconds
-            timeoutMsg: `${activeSpeaker.name} is not selected as active speaker.`
+            timeoutMsg: 'Active speaker not displayed on large video.'
         });
 
     // just a debug print to go in logs

tests/specs/media/codecSelection.spec.ts

@@ -49,7 +49,6 @@ describe('Codec selection', () => {
     it('asymmetric codecs with AV1', async () => {
         await ensureThreeParticipants({
             configOverwrite: {
-                disableTileView: true,
                 videoQuality: {
                     codecPreferenceOrder: [ 'AV1', 'VP9', 'VP8' ]
                 }
@@ -99,7 +98,6 @@ describe('Codec selection', () => {
 
         await ensureThreeParticipants({
             configOverwrite: {
-                disableTileView: true,
                 videoQuality: {
                     codecPreferenceOrder: [ 'VP8' ]
                 }