Fix tests

Signed-off-by: Michael Telatynski <[email protected]>

Author: t3chguy

src/i18n/strings/en_EN.json

@@ -3203,7 +3203,6 @@
         "download_action_decrypting": "Decrypting",
         "download_action_downloading": "Downloading",
         "edits": {
-            "tooltip_label": "Edited at %(date)s. Click to view edits.",
             "tooltip_sub": "Click to view edits",
             "tooltip_title": "Edited at %(date)s"
         },

test/components/structures/LeftPanel-test.tsx

@@ -16,9 +16,9 @@ limitations under the License.
 */
 
 import React from "react";
-import { render, RenderResult, screen } from "@testing-library/react";
 import { mocked } from "jest-mock";
 
+import { render, RenderResult, screen } from "../..";
 import LeftPanel from "../../../src/components/structures/LeftPanel";
 import PageType from "../../../src/PageTypes";
 import ResizeNotifier from "../../../src/utils/ResizeNotifier";

test/components/structures/UserMenu-test.tsx

@@ -15,9 +15,9 @@ limitations under the License.
 */
 
 import React from "react";
-import { act, render, RenderResult } from "@testing-library/react";
 import { MatrixClient, MatrixEvent } from "matrix-js-sdk/src/matrix";
 
+import { act, render, RenderResult } from "../..";
 import UnwrappedUserMenu from "../../../src/components/structures/UserMenu";
 import { stubClient, wrapInSdkContext } from "../../test-utils";
 import {

test/components/structures/__snapshots__/UserMenu-test.tsx.snap

@@ -10,9 +10,9 @@ exports[`<UserMenu> when rendered should render as expected 1`] = `
       aria-haspopup="true"
       aria-label="User menu"
       class="mx_AccessibleButton mx_UserMenu_contextMenuButton"
+      data-state="closed"
       role="button"
       tabindex="0"
-      title="User menu"
     >
       <div
         class="mx_UserMenu_userAvatar"

test/components/views/location/LocationViewDialog-test.tsx

@@ -15,9 +15,9 @@ limitations under the License.
 */
 
 import React from "react";
-import { render, RenderResult } from "@testing-library/react";
 import { RoomMember, LocationAssetType } from "matrix-js-sdk/src/matrix";
 
+import { render, RenderResult } from "../../..";
 import LocationViewDialog from "../../../../src/components/views/location/LocationViewDialog";
 import { TILE_SERVER_WK_KEY } from "../../../../src/utils/WellKnownUtils";
 import { getMockClientWithEventEmitter, makeLocationEvent } from "../../../test-utils";

test/components/views/location/ZoomButtons-test.tsx

@@ -16,8 +16,8 @@ limitations under the License.
 
 import React from "react";
 import * as maplibregl from "maplibre-gl";
-import { render, screen } from "@testing-library/react";
 
+import { render, screen } from "../../..";
 import ZoomButtons from "../../../../src/components/views/location/ZoomButtons";
 
 describe("<ZoomButtons />", () => {

test/components/views/location/__snapshots__/LocationViewDialog-test.tsx.snap

@@ -24,21 +24,21 @@ exports[`<LocationViewDialog /> renders map correctly 1`] = `
   >
     <div
       class="mx_AccessibleButton mx_ZoomButtons_button"
+      data-state="closed"
       data-testid="map-zoom-in-button"
       role="button"
       tabindex="0"
-      title="Zoom in"
     >
       <div
         class="mx_ZoomButtons_icon"
       />
     </div>
     <div
       class="mx_AccessibleButton mx_ZoomButtons_button"
+      data-state="closed"
       data-testid="map-zoom-out-button"
       role="button"
       tabindex="0"
-      title="Zoom out"
     >
       <div
         class="mx_ZoomButtons_icon"

test/components/views/location/__snapshots__/ZoomButtons-test.tsx.snap

@@ -7,21 +7,21 @@ exports[`<ZoomButtons /> renders buttons 1`] = `
   >
     <div
       class="mx_AccessibleButton mx_ZoomButtons_button"
+      data-state="closed"
       data-testid="map-zoom-in-button"
       role="button"
       tabindex="0"
-      title="Zoom in"
     >
       <div
         class="mx_ZoomButtons_icon"
       />
     </div>
     <div
       class="mx_AccessibleButton mx_ZoomButtons_button"
+      data-state="closed"
       data-testid="map-zoom-out-button"
       role="button"
       tabindex="0"
-      title="Zoom out"
     >
       <div
         class="mx_ZoomButtons_icon"

test/components/views/right_panel/UserInfo-test.tsx

@@ -15,7 +15,7 @@ limitations under the License.
 */
 
 import React from "react";
-import { fireEvent, render, screen, waitFor, cleanup, act, within } from "@testing-library/react";
+import { fireEvent, render, screen, waitFor, cleanup, act } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { Mocked, mocked } from "jest-mock";
 import {
@@ -288,7 +288,8 @@ describe("<UserInfo />", () => {
 
         it("renders close button correctly when encryption panel with a pending verification request", () => {
             renderComponent({ phase: RightPanelPhases.EncryptionPanel, verificationRequest });
-            expect(screen.getByTestId("base-card-close-button")).toHaveAttribute("title", "Cancel");
+            screen.getByTestId("base-card-close-button").focus();
+            expect(screen.getByRole("tooltip")).toHaveTextContent("Cancel");
         });
     });
 
@@ -355,11 +356,8 @@ describe("<UserInfo />", () => {
             // click it
             await userEvent.click(devicesButton);
 
-            // there should now be a button with the device id ...
-            const deviceButton = screen.getByRole("button", { description: "d1" });
-
-            // ... which should contain the device name
-            expect(within(deviceButton).getByText("my device")).toBeInTheDocument();
+            // there should now be a button with the device id which should contain the device name
+            expect(screen.getByRole("button", { name: "my device" })).toBeInTheDocument();
         });
 
         it("renders <BasicUserInfo />", async () => {
@@ -460,7 +458,11 @@ describe("<DeviceItem />", () => {
 
     const renderComponent = (props = {}) => {
         const Wrapper = (wrapperProps = {}) => {
-            return <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />;
+            return (
+                <TooltipProvider>
+                    <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />
+                </TooltipProvider>
+            );
         };
 
         return render(<DeviceItem {...defaultProps} {...props} />, {

test/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap

@@ -4,9 +4,9 @@ exports[`<DeviceItem /> ambiguous display name 1`] = `
 <div>
   <div
     class="mx_AccessibleButton mx_UserInfo_device mx_UserInfo_device_unverified"
+    data-state="closed"
     role="button"
     tabindex="0"
-    title="deviceId"
   >
     <div
       class="mx_E2EIcon mx_E2EIcon_normal"
@@ -27,9 +27,9 @@ exports[`<DeviceItem /> with display name 1`] = `
 <div>
   <div
     class="mx_AccessibleButton mx_UserInfo_device mx_UserInfo_device_unverified"
+    data-state="closed"
     role="button"
     tabindex="0"
-    title="deviceId"
   >
     <div
       class="mx_E2EIcon mx_E2EIcon_normal"
@@ -50,9 +50,9 @@ exports[`<DeviceItem /> without display name 1`] = `
 <div>
   <div
     class="mx_AccessibleButton mx_UserInfo_device mx_UserInfo_device_unverified"
+    data-state="closed"
     role="button"
     tabindex="0"
-    title="deviceId"
   >
     <div
       class="mx_E2EIcon mx_E2EIcon_normal"
@@ -79,10 +79,10 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
     >
       <div
         class="mx_AccessibleButton mx_BaseCard_close"
+        data-state="closed"
         data-testid="base-card-close-button"
         role="button"
         tabindex="0"
-        title="Close"
       />
       <div
         class="mx_BaseCard_headerProp"

test/components/views/rooms/RoomPreviewCard-test.tsx

@@ -16,9 +16,9 @@ limitations under the License.
 
 import React from "react";
 import { mocked, Mocked } from "jest-mock";
-import { render, screen, act } from "@testing-library/react";
 import { PendingEventOrdering, Room, RoomStateEvent, RoomType } from "matrix-js-sdk/src/matrix";
 
+import { render, screen, act } from "../../..";
 import type { MatrixClient, RoomMember } from "matrix-js-sdk/src/matrix";
 import { stubClient, wrapInMatrixClientContext, mkRoomMember } from "../../../test-utils";
 import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";

test/components/views/rooms/VoiceRecordComposerTile-test.tsx

@@ -15,10 +15,10 @@ limitations under the License.
 */
 
 import React, { createRef, RefObject } from "react";
-import { render } from "@testing-library/react";
 import { MatrixClient, MsgType, Room } from "matrix-js-sdk/src/matrix";
 import { mocked } from "jest-mock";
 
+import { render } from "../../..";
 import VoiceRecordComposerTile from "../../../../src/components/views/rooms/VoiceRecordComposerTile";
 import { doMaybeLocalRoomAction } from "../../../../src/utils/local-room";
 import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";

test/components/views/rooms/__snapshots__/MemberTile-test.tsx.snap

@@ -5,9 +5,9 @@ exports[`MemberTile should display an verified E2EIcon when the e2E status = Ver
   <div>
     <div
       class="mx_AccessibleButton mx_EntityTile mx_EntityTile_offline_neveractive"
+      data-state="closed"
       role="button"
       tabindex="0"
-      title="@userId:matrix.org (power 0)"
     >
       <div
         class="mx_EntityTile_avatar"
@@ -58,9 +58,9 @@ exports[`MemberTile should display an warning E2EIcon when the e2E status = Warn
   <div>
     <div
       class="mx_AccessibleButton mx_EntityTile mx_EntityTile_offline_neveractive"
+      data-state="closed"
       role="button"
       tabindex="0"
-      title="@userId:matrix.org (power 0)"
     >
       <div
         class="mx_EntityTile_avatar"
@@ -111,9 +111,9 @@ exports[`MemberTile should not display an E2EIcon when the e2E status = normal 1
   <div>
     <div
       class="mx_AccessibleButton mx_EntityTile mx_EntityTile_offline_neveractive"
+      data-state="closed"
       role="button"
       tabindex="0"
-      title="@userId:matrix.org (power 0)"
     >
       <div
         class="mx_EntityTile_avatar"

test/components/views/settings/devices/CurrentDeviceSection-test.tsx

@@ -15,8 +15,8 @@ limitations under the License.
 */
 
 import React from "react";
-import { act, fireEvent, render } from "@testing-library/react";
 
+import { act, fireEvent, render } from "../../../..";
 import CurrentDeviceSection from "../../../../../src/components/views/settings/devices/CurrentDeviceSection";
 import { DeviceType } from "../../../../../src/utils/device/parseUserAgent";
 

test/components/views/settings/devices/DeviceExpandDetailsButton-test.tsx

@@ -15,8 +15,8 @@ limitations under the License.
 */
 
 import React from "react";
-import { fireEvent, render } from "@testing-library/react";
 
+import { fireEvent, render } from "../../../..";
 import { DeviceExpandDetailsButton } from "../../../../../src/components/views/settings/devices/DeviceExpandDetailsButton";
 
 describe("<DeviceExpandDetailsButton />", () => {

test/components/views/settings/devices/LoginWithQRFlow-test.tsx

@@ -14,10 +14,10 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { cleanup, fireEvent, render, screen, waitFor } from "@testing-library/react";
 import React from "react";
 import { RendezvousFailureReason } from "matrix-js-sdk/src/rendezvous";
 
+import { cleanup, fireEvent, render, screen, waitFor } from "../../../..";
 import LoginWithQRFlow from "../../../../../src/components/views/auth/LoginWithQRFlow";
 import {
     Click,

test/components/views/settings/devices/__snapshots__/CurrentDeviceSection-test.tsx.snap

@@ -237,8 +237,8 @@ exports[`<CurrentDeviceSection /> renders device and correct security card when
           class="mx_DeviceTile_actions"
         >
           <div
-            aria-label="Show details"
             class="mx_AccessibleButton mx_DeviceExpandDetailsButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_icon"
+            data-state="closed"
             data-testid="current-session-toggle-details"
             role="button"
             tabindex="0"
@@ -380,8 +380,8 @@ exports[`<CurrentDeviceSection /> renders device and correct security card when
           class="mx_DeviceTile_actions"
         >
           <div
-            aria-label="Show details"
             class="mx_AccessibleButton mx_DeviceExpandDetailsButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_icon"
+            data-state="closed"
             data-testid="current-session-toggle-details"
             role="button"
             tabindex="0"

test/components/views/settings/devices/__snapshots__/DeviceExpandDetailsButton-test.tsx.snap

@@ -4,8 +4,8 @@ exports[`<DeviceExpandDetailsButton /> renders when expanded 1`] = `
 {
   "container": <div>
     <div
-      aria-label="Hide details"
       class="mx_AccessibleButton mx_DeviceExpandDetailsButton mx_DeviceExpandDetailsButton_expanded mx_AccessibleButton_hasKind mx_AccessibleButton_kind_icon"
+      data-state="closed"
       role="button"
       tabindex="0"
     >
@@ -21,8 +21,8 @@ exports[`<DeviceExpandDetailsButton /> renders when not expanded 1`] = `
 {
   "container": <div>
     <div
-      aria-label="Show details"
       class="mx_AccessibleButton mx_DeviceExpandDetailsButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_icon"
+      data-state="closed"
       role="button"
       tabindex="0"
     >