Attempt to fix tests and fix RoomSummaryCard having wrong member count

src/components/views/right_panel/RoomSummaryCard.tsx

@@ -181,6 +181,14 @@ const onRoomSettingsClick = () => {
     defaultDispatcher.dispatch({ action: "open_room_settings" });
 };
 
+const useMemberCount = (room: Room) => {
+    const [count, setCount] = useState(room.getJoinedMembers().length);
+    useEventEmitter(room.currentState, "RoomState.members", () => {
+        setCount(room.getJoinedMembers().length);
+    });
+    return count;
+};
+
 const RoomSummaryCard: React.FC<IProps> = ({ room, onClose }) => {
     const cli = useContext(MatrixClientContext);
 
@@ -210,10 +218,12 @@ const RoomSummaryCard: React.FC<IProps> = ({ room, onClose }) => {
         </div>
     </React.Fragment>;
 
+    const memberCount = useMemberCount(room);
+
     return <BaseCard header={header} className="mx_RoomSummaryCard" onClose={onClose}>
         <Group title={_t("About")} className="mx_RoomSummaryCard_aboutGroup">
             <Button className="mx_RoomSummaryCard_icon_people" onClick={onRoomMembersClick}>
-                {_t("%(count)s people", { count: room.getJoinedMembers().length })}
+                {_t("%(count)s people", { count: memberCount })}
             </Button>
             <Button className="mx_RoomSummaryCard_icon_files" onClick={onRoomFilesClick}>
                 {_t("Show files")}

test/end-to-end-tests/src/usecases/memberlist.js

@@ -17,11 +17,6 @@ limitations under the License.
 
 const assert = require('assert');
 
-module.exports.openMemberList = async function(session) {
-    const peopleButton = await session.query(".mx_RoomSummaryCard_icon_people");
-    await peopleButton.click();
-};
-
 async function openMemberInfo(session, name) {
     const membersAndNames = await getMembersInMemberlist(session);
     const matchingLabel = membersAndNames.filter((m) => {
@@ -68,16 +63,26 @@ module.exports.verifyDeviceForUser = async function(session, name, expectedDevic
 };
 
 async function getMembersInMemberlist(session) {
-    const memberPanelButton = await session.query(".mx_RightPanel_membersButton");
     try {
-        await session.query(".mx_RightPanel_headerButton_highlight", 500);
+        await session.query('.mx_RoomHeader .mx_RightPanel_headerButton_highlight[aria-label="Room Info"]');
-        // Right panel is open - toggle it to ensure it's the member list
-        // Sometimes our tests have this opened to MemberInfo
-        await memberPanelButton.click();
-        await memberPanelButton.click();
     } catch (e) {
-        // Member list is closed - open it
+        // If the room summary is not yet open, open it
+        const roomSummaryButton = await session.query('.mx_RoomHeader .mx_AccessibleButton[aria-label="Room Info"]');
+        await roomSummaryButton.click();
+    }
+
+    for (let i = 0; i < 5; i++) {
+        try {
+            const backButton = await session.query(".mx_BaseCard_back", 500);
+            // Right panel is open to the wrong thing - go back up to the Room Summary Card
+            // Sometimes our tests have this opened to MemberInfo
+            await backButton.click();
+        } catch (e) {
+            const memberPanelButton = await session.query(".mx_RoomSummaryCard_icon_people");
+            // We are back at the room summary card
             await memberPanelButton.click();
+            break; // stop trying to go further back
+        }
     }
     const memberNameElements = await session.queryAll(".mx_MemberList .mx_EntityTile_name");
     return Promise.all(memberNameElements.map(async (el) => {

test/end-to-end-tests/src/usecases/verify.js

@@ -16,11 +16,10 @@ limitations under the License.
 */
 
 const assert = require('assert');
-const {openMemberList, openMemberInfo} = require("./memberlist");
+const {openMemberInfo} = require("./memberlist");
 
 async function startVerification(session, name) {
     session.log.step("opens their opponent's profile and starts verification");
-    await openMemberList(session);
     await openMemberInfo(session, name);
     // click verify in member info
     const firstVerifyButton = await session.query(".mx_UserInfo_verifyButton");