From 80940d0f32589a51a63c6285eed294e9163ae2b6 Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Mon, 23 Sep 2024 22:48:45 +0530 Subject: [PATCH] Add back everywhere --- src/Modal.tsx | 46 +++++++------ src/components/structures/ContextMenu.tsx | 21 +++--- src/components/structures/MatrixChat.tsx | 6 +- .../views/elements/PersistedElement.tsx | 9 ++- src/components/views/messages/TextualBody.tsx | 7 +- src/toasts/IncomingCallToast.tsx | 66 ++++++++++--------- src/utils/exportUtils/HtmlExport.tsx | 41 ++++++------ src/utils/pillify.tsx | 19 ++++-- src/utils/tooltipify.tsx | 9 ++- .../structures/MessagePanel-test.tsx | 5 +- .../components/structures/RightPanel-test.tsx | 2 + test/components/structures/RoomView-test.tsx | 3 + .../structures/SpaceHierarchy-test.tsx | 5 +- .../structures/ThreadPanel-test.tsx | 13 +++- .../structures/TimelinePanel-test.tsx | 38 +++++++---- .../structures/auth/ForgotPassword-test.tsx | 2 + .../avatars/DecoratedRoomAvatar-test.tsx | 3 +- .../views/beacon/BeaconListItem-test.tsx | 2 + .../views/beacon/BeaconViewDialog-test.tsx | 4 +- .../views/beacon/DialogSidebar-test.tsx | 5 +- .../views/beacon/ShareLatestLocation-test.tsx | 4 +- .../views/dialogs/ServerPickerDialog-test.tsx | 3 +- .../views/dialogs/ShareDialog-test.tsx | 7 +- .../views/elements/FacePile-test.tsx | 2 + .../views/elements/InfoTooltip-test.tsx | 5 +- test/components/views/elements/Pill-test.tsx | 2 + .../views/elements/RoomFacePile-test.tsx | 5 +- .../views/messages/CallEvent-test.tsx | 3 +- .../views/messages/MStickerBody-test.tsx | 3 +- .../views/messages/MessageTimestamp-test.tsx | 6 +- .../polls/pollHistory/PollHistory-test.tsx | 5 +- .../polls/pollHistory/PollListItem-test.tsx | 4 +- .../pollHistory/PollListItemEnded-test.tsx | 3 +- .../right_panel/RoomSummaryCard-test.tsx | 5 +- .../views/right_panel/UserInfo-test.tsx | 13 +++- .../components/views/rooms/EventTile-test.tsx | 13 ++-- .../views/rooms/LegacyRoomHeader-test.tsx | 3 + .../views/rooms/MemberList-test.tsx | 3 + .../views/rooms/MemberTile-test.tsx | 7 +- .../views/rooms/MessageComposer-test.tsx | 3 +- .../views/rooms/RoomHeader-test.tsx | 7 +- .../RoomHeader/CallGuestLinkButton-test.tsx | 13 +++- .../RoomHeader/VideoRoomChatButton-test.tsx | 7 +- test/components/views/rooms/RoomList-test.tsx | 23 ++++--- .../devices/FilteredDeviceList-test.tsx | 7 +- .../devices/FilteredDeviceListHeader-test.tsx | 7 +- .../tabs/user/SessionManagerTab-test.tsx | 13 ++-- .../spaces/ThreadsActivityCentre-test.tsx | 3 + test/components/views/voip/CallView-test.tsx | 5 +- 49 files changed, 328 insertions(+), 162 deletions(-) diff --git a/src/Modal.tsx b/src/Modal.tsx index 22e8a56923..53a1935294 100644 --- a/src/Modal.tsx +++ b/src/Modal.tsx @@ -12,7 +12,7 @@ import ReactDOM from "react-dom"; import classNames from "classnames"; import { IDeferred, defer, sleep } from "matrix-js-sdk/src/utils"; import { TypedEventEmitter } from "matrix-js-sdk/src/matrix"; -import { Glass } from "@vector-im/compound-web"; +import { Glass, TooltipProvider } from "@vector-im/compound-web"; import dis, { defaultDispatcher } from "./dispatcher/dispatcher"; import AsyncWrapper from "./AsyncWrapper"; @@ -416,16 +416,18 @@ export class ModalManager extends TypedEventEmitter - -
{this.staticModal.elem}
-
-
-
+ +
+ +
{this.staticModal.elem}
+
+
+
+ ); ReactDOM.render(staticDialog, ModalManager.getOrCreateStaticContainer()); @@ -441,16 +443,18 @@ export class ModalManager extends TypedEventEmitter - -
{modal.elem}
-
-
-
+ +
+ +
{modal.elem}
+
+
+
+ ); setTimeout(() => ReactDOM.render(dialog, ModalManager.getOrCreateContainer()), 0); diff --git a/src/components/structures/ContextMenu.tsx b/src/components/structures/ContextMenu.tsx index 9085898297..d589376610 100644 --- a/src/components/structures/ContextMenu.tsx +++ b/src/components/structures/ContextMenu.tsx @@ -12,6 +12,7 @@ import React, { CSSProperties, RefObject, SyntheticEvent, useRef, useState } fro import ReactDOM from "react-dom"; import classNames from "classnames"; import FocusLock from "react-focus-lock"; +import { TooltipProvider } from "@vector-im/compound-web"; import { Writeable } from "../../@types/common"; import UIStore from "../../stores/UIStore"; @@ -621,15 +622,17 @@ export function createMenu( }; const menu = ( - - - + + + + + ); ReactDOM.render(menu, getOrCreateContainer()); diff --git a/src/components/structures/MatrixChat.tsx b/src/components/structures/MatrixChat.tsx index 1542267bf8..a505d6aedf 100644 --- a/src/components/structures/MatrixChat.tsx +++ b/src/components/structures/MatrixChat.tsx @@ -2149,9 +2149,9 @@ export default class MatrixChat extends React.PureComponent { return ( - - {view} - + + {view} + ); } diff --git a/src/components/views/elements/PersistedElement.tsx b/src/components/views/elements/PersistedElement.tsx index a380723fb2..1b7b6543e9 100644 --- a/src/components/views/elements/PersistedElement.tsx +++ b/src/components/views/elements/PersistedElement.tsx @@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details. import React, { MutableRefObject, ReactNode } from "react"; import ReactDOM from "react-dom"; import { isNullOrUndefined } from "matrix-js-sdk/src/utils"; +import { TooltipProvider } from "@vector-im/compound-web"; import dis from "../../../dispatcher/dispatcher"; import MatrixClientContext from "../../../contexts/MatrixClientContext"; @@ -167,9 +168,11 @@ export default class PersistedElement extends React.Component { private renderApp(): void { const content = ( -
- {this.props.children} -
+ +
+ {this.props.children} +
+
); diff --git a/src/components/views/messages/TextualBody.tsx b/src/components/views/messages/TextualBody.tsx index 8b7bfb9a5a..77561ff2ee 100644 --- a/src/components/views/messages/TextualBody.tsx +++ b/src/components/views/messages/TextualBody.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import React, { createRef, SyntheticEvent, MouseEvent } from "react"; import ReactDOM from "react-dom"; import { MsgType } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import * as HtmlUtils from "../../../HtmlUtils"; import { formatDate } from "../../../DateUtils"; @@ -335,7 +336,11 @@ export default class TextualBody extends React.Component { const reason = node.getAttribute("data-mx-spoiler") ?? undefined; node.removeAttribute("data-mx-spoiler"); // we don't want to recurse - const spoiler = ; + const spoiler = ( + + + + ); ReactDOM.render(spoiler, spoilerContainer); node.parentNode?.replaceChild(spoilerContainer, node); diff --git a/src/toasts/IncomingCallToast.tsx b/src/toasts/IncomingCallToast.tsx index 03b8f0c222..447ef490c6 100644 --- a/src/toasts/IncomingCallToast.tsx +++ b/src/toasts/IncomingCallToast.tsx @@ -8,7 +8,7 @@ Please see LICENSE files in the repository root for full details. import React, { useCallback, useEffect, useState } from "react"; import { MatrixEvent, RoomMember } from "matrix-js-sdk/src/matrix"; -import { Button, Tooltip } from "@vector-im/compound-web"; +import { Button, Tooltip, TooltipProvider } from "@vector-im/compound-web"; import { Icon as VideoCallIcon } from "@vector-im/compound-design-tokens/icons/video-call-solid.svg"; import { _t } from "../languageHandler"; @@ -163,38 +163,40 @@ export function IncomingCallToast({ notifyEvent }: Props): JSX.Element { useEventEmitter(call ?? undefined, CallEvent.Participants, onParticipantChange); return ( - <> -
- -
-
-
- - {room ? room.name : _t("voip|call_toast_unknown_room")} - -
{_t("voip|video_call_started")}
- {call ? ( - - ) : ( - - )} + + <> +
+
- +
+ + {room ? room.name : _t("voip|call_toast_unknown_room")} + +
{_t("voip|video_call_started")}
+ {call ? ( + + ) : ( + + )} +
+ +
+ -
- - + + ); } diff --git a/src/utils/exportUtils/HtmlExport.tsx b/src/utils/exportUtils/HtmlExport.tsx index 3f3dffbfca..1ad102b0bc 100644 --- a/src/utils/exportUtils/HtmlExport.tsx +++ b/src/utils/exportUtils/HtmlExport.tsx @@ -12,6 +12,7 @@ import { Room, MatrixEvent, EventType, MsgType } from "matrix-js-sdk/src/matrix" import { renderToStaticMarkup } from "react-dom/server"; import { logger } from "matrix-js-sdk/src/logger"; import escapeHtml from "escape-html"; +import { TooltipProvider } from "@vector-im/compound-web"; import Exporter from "./Exporter"; import { mediaFromMxc } from "../../customisations/Media"; @@ -271,25 +272,27 @@ export default class HTMLExporter extends Exporter { return (
- false} - isTwelveHour={false} - last={false} - lastInSection={false} - permalinkCreator={this.permalinkCreator} - lastSuccessful={false} - isSelectedEvent={false} - showReactions={false} - layout={Layout.Group} - showReadReceipts={false} - /> + + false} + isTwelveHour={false} + last={false} + lastInSection={false} + permalinkCreator={this.permalinkCreator} + lastSuccessful={false} + isSelectedEvent={false} + showReactions={false} + layout={Layout.Group} + showReadReceipts={false} + /> +
); diff --git a/src/utils/pillify.tsx b/src/utils/pillify.tsx index c1aa09c247..2c19f11491 100644 --- a/src/utils/pillify.tsx +++ b/src/utils/pillify.tsx @@ -10,6 +10,7 @@ import React from "react"; import ReactDOM from "react-dom"; import { PushProcessor } from "matrix-js-sdk/src/pushprocessor"; import { MatrixClient, MatrixEvent, RuleId } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import SettingsStore from "../settings/SettingsStore"; import { Pill, pillRoomNotifLen, pillRoomNotifPos, PillType } from "../components/views/elements/Pill"; @@ -75,7 +76,9 @@ export function pillifyLinks( const pillContainer = document.createElement("span"); const pill = ( - + + + ); ReactDOM.render(pill, pillContainer); @@ -130,12 +133,14 @@ export function pillifyLinks( const pillContainer = document.createElement("span"); const pill = ( - + + + ); ReactDOM.render(pill, pillContainer); diff --git a/src/utils/tooltipify.tsx b/src/utils/tooltipify.tsx index 92dff5279b..10172f4e3a 100644 --- a/src/utils/tooltipify.tsx +++ b/src/utils/tooltipify.tsx @@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import ReactDOM from "react-dom"; +import { TooltipProvider } from "@vector-im/compound-web"; import PlatformPeg from "../PlatformPeg"; import LinkWithTooltip from "../components/views/elements/LinkWithTooltip"; @@ -52,9 +53,11 @@ export function tooltipifyLinks(rootNodes: ArrayLike, ignoredNodes: Ele // wrapping the link with the LinkWithTooltip component, keeping the same children. Ideally we'd do this // without the superfluous span but this is not something React trivially supports at this time. const tooltip = ( - - - + + + + + ); ReactDOM.render(tooltip, node); diff --git a/test/components/structures/MessagePanel-test.tsx b/test/components/structures/MessagePanel-test.tsx index eddf63a17e..5dd7b053cd 100644 --- a/test/components/structures/MessagePanel-test.tsx +++ b/test/components/structures/MessagePanel-test.tsx @@ -12,6 +12,7 @@ import { EventEmitter } from "events"; import { MatrixEvent, Room, RoomMember, Thread, ReceiptType } from "matrix-js-sdk/src/matrix"; import { KnownMembership } from "matrix-js-sdk/src/types"; import { render } from "@testing-library/react"; +import { TooltipProvider } from "@vector-im/compound-web"; import MessagePanel, { shouldFormContinuation } from "../../../src/components/structures/MessagePanel"; import SettingsStore from "../../../src/settings/SettingsStore"; @@ -90,7 +91,9 @@ describe("MessagePanel", function () { const getComponent = (props = {}, roomContext: Partial = {}) => ( - + + + ); diff --git a/test/components/structures/RightPanel-test.tsx b/test/components/structures/RightPanel-test.tsx index 2aa1825133..fff5ee7a79 100644 --- a/test/components/structures/RightPanel-test.tsx +++ b/test/components/structures/RightPanel-test.tsx @@ -11,6 +11,7 @@ import { render, screen, waitFor } from "@testing-library/react"; import { jest } from "@jest/globals"; import { mocked, MockedObject } from "jest-mock"; import { MatrixClient } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import _RightPanel from "../../../src/components/structures/RightPanel"; import { MatrixClientPeg } from "../../../src/MatrixClientPeg"; @@ -114,6 +115,7 @@ describe("RightPanel", () => { resizeNotifier={resizeNotifier} permalinkCreator={new RoomPermalinkCreator(r1, r1.roomId)} />, + { wrapper: TooltipProvider }, ); // Wait for RPS room 1 updates to fire const rpsUpdated = waitForRpsUpdate(); diff --git a/test/components/structures/RoomView-test.tsx b/test/components/structures/RoomView-test.tsx index e1dad1cb9d..ec6236306f 100644 --- a/test/components/structures/RoomView-test.tsx +++ b/test/components/structures/RoomView-test.tsx @@ -24,6 +24,7 @@ import { import { KnownMembership } from "matrix-js-sdk/src/types"; import { fireEvent, render, screen, RenderResult, waitForElementToBeRemoved, waitFor } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; +import { TooltipProvider } from "@vector-im/compound-web"; import { stubClient, @@ -136,6 +137,7 @@ describe("RoomView", () => { wrappedRef={ref as any} /> , + { wrapper: TooltipProvider }, ); await flushPromises(); return roomView; @@ -173,6 +175,7 @@ describe("RoomView", () => { onRegistered={jest.fn()} /> , + { wrapper: TooltipProvider }, ); await flushPromises(); return roomView; diff --git a/test/components/structures/SpaceHierarchy-test.tsx b/test/components/structures/SpaceHierarchy-test.tsx index da0f83f43a..e8e7688787 100644 --- a/test/components/structures/SpaceHierarchy-test.tsx +++ b/test/components/structures/SpaceHierarchy-test.tsx @@ -12,6 +12,7 @@ import { fireEvent, render, screen, waitFor, waitForElementToBeRemoved } from "@ import { HierarchyRoom, JoinRule, MatrixClient, Room } from "matrix-js-sdk/src/matrix"; import { KnownMembership } from "matrix-js-sdk/src/types"; import { RoomHierarchy } from "matrix-js-sdk/src/room-hierarchy"; +import { TooltipProvider } from "@vector-im/compound-web"; import { MatrixClientPeg } from "../../../src/MatrixClientPeg"; import { mkStubRoom, stubClient } from "../../test-utils"; @@ -278,7 +279,9 @@ describe("SpaceHierarchy", () => { }; const getComponent = (props = {}): React.ReactElement => ( - + + + ); diff --git a/test/components/structures/ThreadPanel-test.tsx b/test/components/structures/ThreadPanel-test.tsx index 1885ae913d..dbf7020e2e 100644 --- a/test/components/structures/ThreadPanel-test.tsx +++ b/test/components/structures/ThreadPanel-test.tsx @@ -17,6 +17,7 @@ import { FeatureSupport, Thread, } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import ThreadPanel, { ThreadFilterType, ThreadPanelHeader } from "../../../src/components/structures/ThreadPanel"; import MatrixClientContext from "../../../src/contexts/MatrixClientContext"; @@ -36,6 +37,7 @@ describe("ThreadPanel", () => { it("expect that All filter for ThreadPanelHeader properly renders Show: All threads", () => { const { asFragment } = render( undefined} />, + { wrapper: TooltipProvider }, ); expect(asFragment()).toMatchSnapshot(); }); @@ -43,6 +45,7 @@ describe("ThreadPanel", () => { it("expect that My filter for ThreadPanelHeader properly renders Show: My threads", () => { const { asFragment } = render( undefined} />, + { wrapper: TooltipProvider }, ); expect(asFragment()).toMatchSnapshot(); }); @@ -50,6 +53,7 @@ describe("ThreadPanel", () => { it("expect that ThreadPanelHeader properly opens a context menu when clicked on the button", () => { const { container } = render( undefined} />, + { wrapper: TooltipProvider }, ); const found = container.querySelector(".mx_ThreadPanel_dropdown"); expect(found).toBeTruthy(); @@ -61,6 +65,7 @@ describe("ThreadPanel", () => { it("expect that ThreadPanelHeader has the correct option selected in the context menu", () => { const { container } = render( undefined} />, + { wrapper: TooltipProvider }, ); fireEvent.click(container.querySelector(".mx_ThreadPanel_dropdown")!); const found = screen.queryAllByRole("menuitemradio"); @@ -83,7 +88,9 @@ describe("ThreadPanel", () => { const { container } = render( - undefined} /> + + undefined} /> + , ); @@ -97,7 +104,9 @@ describe("ThreadPanel", () => { const mockClient = createTestClient(); const { container } = render( - undefined} /> + + undefined} /> + , ); fireEvent.click(getByRole(container, "button", { name: "Mark all as read" })); diff --git a/test/components/structures/TimelinePanel-test.tsx b/test/components/structures/TimelinePanel-test.tsx index f3e0d85016..336bfd6142 100644 --- a/test/components/structures/TimelinePanel-test.tsx +++ b/test/components/structures/TimelinePanel-test.tsx @@ -31,6 +31,7 @@ import { KnownMembership } from "matrix-js-sdk/src/types"; import React, { createRef } from "react"; import { Mocked, mocked } from "jest-mock"; import { forEachRight } from "lodash"; +import { TooltipProvider } from "@vector-im/compound-web"; import TimelinePanel from "../../../src/components/structures/TimelinePanel"; import MatrixClientContext from "../../../src/contexts/MatrixClientContext"; @@ -203,6 +204,7 @@ describe("TimelinePanel", () => { manageReadReceipts={true} ref={ref} />, + { wrapper: TooltipProvider }, ); await flushPromises(); timelinePanel = ref.current!; @@ -382,7 +384,7 @@ describe("TimelinePanel", () => { onEventScrolledIntoView: jest.fn(), }; - const { rerender } = render(); + const { rerender } = render(, { wrapper: TooltipProvider }); expect(props.onEventScrolledIntoView).toHaveBeenCalledWith(undefined); props.eventId = events[1].getId(); rerender(); @@ -399,7 +401,9 @@ describe("TimelinePanel", () => { setupPagination(client, timeline, eventsPage1, null); await withScrollPanelMountSpy(async (mountSpy) => { - const { container } = render(, {}); + const { container } = render(, { + wrapper: TooltipProvider, + }); await waitFor(() => expectEvents(container, [events[1]])); @@ -416,7 +420,7 @@ describe("TimelinePanel", () => { const [, room, events] = setupTestData(); await withScrollPanelMountSpy(async (mountSpy) => { - const { container } = render(); + const { container } = render(, { wrapper: TooltipProvider }); await waitFor(() => expectEvents(container, [events[0], events[1]])); @@ -443,7 +447,7 @@ describe("TimelinePanel", () => { const paginateSpy = jest.spyOn(TimelineWindow.prototype, "paginate").mockClear(); - render(); + render(, { wrapper: TooltipProvider }); const event = new MatrixEvent({ type: RoomEvent.Timeline, origin_server_ts: 0 }); const data = { timeline: otherTimeline, liveEvent: true }; @@ -459,7 +463,7 @@ describe("TimelinePanel", () => { const paginateSpy = jest.spyOn(TimelineWindow.prototype, "paginate").mockClear(); - render(); + render(, { wrapper: TooltipProvider }); const event = new MatrixEvent({ type: RoomEvent.Timeline, origin_server_ts: 0 }); const data = { timeline: props.timelineSet.getLiveTimeline(), liveEvent: false }; @@ -475,7 +479,7 @@ describe("TimelinePanel", () => { const paginateSpy = jest.spyOn(TimelineWindow.prototype, "paginate").mockClear(); - render(); + render(, { wrapper: TooltipProvider }); const event = new MatrixEvent({ type: RoomEvent.Timeline, origin_server_ts: 0 }); const data = { timeline: props.timelineSet.getLiveTimeline(), liveEvent: false }; @@ -492,7 +496,7 @@ describe("TimelinePanel", () => { const paginateSpy = jest.spyOn(TimelineWindow.prototype, "paginate").mockClear(); - render(); + render(, { wrapper: TooltipProvider }); const event = new MatrixEvent({ type: RoomEvent.Timeline, origin_server_ts: 0 }); const data = { timeline: props.timelineSet.getLiveTimeline(), liveEvent: true }; @@ -515,7 +519,7 @@ describe("TimelinePanel", () => { const paginateSpy = jest.spyOn(TimelineWindow.prototype, "paginate").mockClear(); - render(); + render(, { wrapper: TooltipProvider }); await flushPromises(); @@ -556,6 +560,7 @@ describe("TimelinePanel", () => { overlayTimelineSet={overlayTimelineSet} overlayTimelineSetFilter={isCallEvent} />, + { wrapper: TooltipProvider }, ); await waitFor(() => expectEvents(container, [ @@ -595,6 +600,7 @@ describe("TimelinePanel", () => { const { container } = render( , + { wrapper: TooltipProvider }, ); await waitFor(() => @@ -626,6 +632,7 @@ describe("TimelinePanel", () => { const { container } = render( , + { wrapper: TooltipProvider }, ); await waitFor(() => @@ -657,6 +664,7 @@ describe("TimelinePanel", () => { const { container } = render( , + { wrapper: TooltipProvider }, ); await waitFor(() => @@ -691,6 +699,7 @@ describe("TimelinePanel", () => { timelineSet={timelineSet} overlayTimelineSet={overlayTimelineSet} />, + { wrapper: TooltipProvider }, ); await waitFor(() => expectEvents(container, [overlayEvents[0], events[0]])); @@ -764,6 +773,7 @@ describe("TimelinePanel", () => { await withScrollPanelMountSpy(async (mountSpy) => { const { container } = render( , + { wrapper: TooltipProvider }, ); await waitFor(() => @@ -874,7 +884,9 @@ describe("TimelinePanel", () => { const dom = render( - + + + , ); await dom.findByText("RootEvent"); @@ -927,7 +939,9 @@ describe("TimelinePanel", () => { const dom = render( - + + + , ); await dom.findByText("RootEvent"); @@ -995,7 +1009,9 @@ describe("TimelinePanel", () => { const { container } = render( - + + + , ); diff --git a/test/components/structures/auth/ForgotPassword-test.tsx b/test/components/structures/auth/ForgotPassword-test.tsx index d864bd74ca..75352dbbbb 100644 --- a/test/components/structures/auth/ForgotPassword-test.tsx +++ b/test/components/structures/auth/ForgotPassword-test.tsx @@ -11,6 +11,7 @@ import { mocked } from "jest-mock"; import { act, render, RenderResult, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { MatrixClient, createClient } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import ForgotPassword from "../../../../src/components/structures/auth/ForgotPassword"; import { ValidatedServerConfig } from "../../../../src/utils/ValidatedServerConfig"; @@ -94,6 +95,7 @@ describe("", () => { beforeEach(() => { renderResult = render( , + { wrapper: TooltipProvider }, ); }); diff --git a/test/components/views/avatars/DecoratedRoomAvatar-test.tsx b/test/components/views/avatars/DecoratedRoomAvatar-test.tsx index 75cd19890e..d37c27ae4f 100644 --- a/test/components/views/avatars/DecoratedRoomAvatar-test.tsx +++ b/test/components/views/avatars/DecoratedRoomAvatar-test.tsx @@ -11,6 +11,7 @@ import { mocked } from "jest-mock"; import { JoinRule, MatrixClient, PendingEventOrdering, Room } from "matrix-js-sdk/src/matrix"; import React from "react"; import userEvent from "@testing-library/user-event"; +import { TooltipProvider } from "@vector-im/compound-web"; import { MatrixClientPeg } from "../../../../src/MatrixClientPeg"; import { stubClient } from "../../../test-utils"; @@ -30,7 +31,7 @@ describe("DecoratedRoomAvatar", () => { let room: Room; function renderComponent() { - return render(); + return render(, { wrapper: TooltipProvider }); } beforeEach(() => { diff --git a/test/components/views/beacon/BeaconListItem-test.tsx b/test/components/views/beacon/BeaconListItem-test.tsx index de0aeb6c92..6c33be770c 100644 --- a/test/components/views/beacon/BeaconListItem-test.tsx +++ b/test/components/views/beacon/BeaconListItem-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import { act, fireEvent, render } from "@testing-library/react"; import { Beacon, RoomMember, MatrixEvent, LocationAssetType } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import BeaconListItem from "../../../../src/components/views/beacon/BeaconListItem"; import MatrixClientContext from "../../../../src/contexts/MatrixClientContext"; @@ -67,6 +68,7 @@ describe("", () => { , + { wrapper: TooltipProvider }, ); const setupRoomWithBeacons = (beaconInfoEvents: MatrixEvent[], locationEvents?: MatrixEvent[]): Beacon[] => { diff --git a/test/components/views/beacon/BeaconViewDialog-test.tsx b/test/components/views/beacon/BeaconViewDialog-test.tsx index 44b5ee488d..1603243b02 100644 --- a/test/components/views/beacon/BeaconViewDialog-test.tsx +++ b/test/components/views/beacon/BeaconViewDialog-test.tsx @@ -11,6 +11,7 @@ import { act, fireEvent, render, RenderResult, waitFor } from "@testing-library/ import { MatrixClient, MatrixEvent, Room, RoomMember, getBeaconInfoIdentifier } from "matrix-js-sdk/src/matrix"; import * as maplibregl from "maplibre-gl"; import { mocked } from "jest-mock"; +import { TooltipProvider } from "@vector-im/compound-web"; import BeaconViewDialog from "../../../../src/components/views/beacon/BeaconViewDialog"; import { @@ -71,7 +72,8 @@ describe("", () => { matrixClient: mockClient as MatrixClient, }; - const getComponent = (props = {}): RenderResult => render(); + const getComponent = (props = {}): RenderResult => + render(, { wrapper: TooltipProvider }); const openSidebar = (getByTestId: RenderResult["getByTestId"]) => { fireEvent.click(getByTestId("beacon-view-dialog-open-sidebar")); diff --git a/test/components/views/beacon/DialogSidebar-test.tsx b/test/components/views/beacon/DialogSidebar-test.tsx index fd5ff4ae94..634c8eb822 100644 --- a/test/components/views/beacon/DialogSidebar-test.tsx +++ b/test/components/views/beacon/DialogSidebar-test.tsx @@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details. import React, { ComponentProps } from "react"; import { act, fireEvent, render } from "@testing-library/react"; +import { TooltipProvider } from "@vector-im/compound-web"; import DialogSidebar from "../../../../src/components/views/beacon/DialogSidebar"; import MatrixClientContext from "../../../../src/contexts/MatrixClientContext"; @@ -44,7 +45,9 @@ describe("", () => { const getComponent = (props = {}) => ( - + + + ); diff --git a/test/components/views/beacon/ShareLatestLocation-test.tsx b/test/components/views/beacon/ShareLatestLocation-test.tsx index 7742de49d3..bdb994107d 100644 --- a/test/components/views/beacon/ShareLatestLocation-test.tsx +++ b/test/components/views/beacon/ShareLatestLocation-test.tsx @@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import { fireEvent, render } from "@testing-library/react"; +import { TooltipProvider } from "@vector-im/compound-web"; import ShareLatestLocation from "../../../../src/components/views/beacon/ShareLatestLocation"; import { copyPlaintext } from "../../../../src/utils/strings"; @@ -24,7 +25,8 @@ describe("", () => { timestamp: 123, }, }; - const getComponent = (props = {}) => render(); + const getComponent = (props = {}) => + render(, { wrapper: TooltipProvider }); beforeEach(() => { jest.clearAllMocks(); diff --git a/test/components/views/dialogs/ServerPickerDialog-test.tsx b/test/components/views/dialogs/ServerPickerDialog-test.tsx index a344fdb40e..190e349a7c 100644 --- a/test/components/views/dialogs/ServerPickerDialog-test.tsx +++ b/test/components/views/dialogs/ServerPickerDialog-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import { fireEvent, render, screen } from "@testing-library/react"; import fetchMock from "fetch-mock-jest"; +import { TooltipProvider } from "@vector-im/compound-web"; import ServerPickerDialog from "../../../../src/components/views/dialogs/ServerPickerDialog"; import SdkConfig from "../../../../src/SdkConfig"; @@ -47,7 +48,7 @@ describe("", () => { onFinished: any; serverConfig: ValidatedServerConfig; }> = {}, - ) => render(); + ) => render(, { wrapper: TooltipProvider }); beforeEach(() => { SdkConfig.add({ diff --git a/test/components/views/dialogs/ShareDialog-test.tsx b/test/components/views/dialogs/ShareDialog-test.tsx index ff29ca21be..3c6226abde 100644 --- a/test/components/views/dialogs/ShareDialog-test.tsx +++ b/test/components/views/dialogs/ShareDialog-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import { EventTimeline, MatrixEvent, Room, RoomMember } from "matrix-js-sdk/src/matrix"; import { render, RenderOptions } from "@testing-library/react"; +import { TooltipProvider } from "@vector-im/compound-web"; import { MatrixClientPeg } from "../../../../src/MatrixClientPeg"; import SettingsStore from "../../../../src/settings/SettingsStore"; @@ -22,7 +23,11 @@ jest.mock("../../../../src/utils/ShieldUtils"); function getWrapper(): RenderOptions { return { wrapper: ({ children }) => ( - {children} + + + {children} + + ), }; } diff --git a/test/components/views/elements/FacePile-test.tsx b/test/components/views/elements/FacePile-test.tsx index 4cb8bbf007..ce0aad6d42 100644 --- a/test/components/views/elements/FacePile-test.tsx +++ b/test/components/views/elements/FacePile-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import { render } from "@testing-library/react"; import React from "react"; import { KnownMembership } from "matrix-js-sdk/src/types"; +import { TooltipProvider } from "@vector-im/compound-web"; import FacePile from "../../../../src/components/views/elements/FacePile"; import { mkRoomMember } from "../../../test-utils"; @@ -19,6 +20,7 @@ describe("", () => { const { asFragment } = render( , + { wrapper: TooltipProvider }, ); expect(asFragment()).toMatchSnapshot(); diff --git a/test/components/views/elements/InfoTooltip-test.tsx b/test/components/views/elements/InfoTooltip-test.tsx index a34db4e423..9f2adad91e 100644 --- a/test/components/views/elements/InfoTooltip-test.tsx +++ b/test/components/views/elements/InfoTooltip-test.tsx @@ -9,12 +9,15 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import userEvent from "@testing-library/user-event"; import { render, waitFor } from "@testing-library/react"; +import { TooltipProvider } from "@vector-im/compound-web"; import InfoTooltip from "../../../../src/components/views/elements/InfoTooltip"; describe("InfoTooltip", () => { it("should show tooltip on hover", async () => { - const { getByText, asFragment } = render(Trigger text); + const { getByText, asFragment } = render(Trigger text, { + wrapper: TooltipProvider, + }); const trigger = getByText("Trigger text"); expect(trigger).toBeVisible(); diff --git a/test/components/views/elements/Pill-test.tsx b/test/components/views/elements/Pill-test.tsx index 055848f126..fadf4af891 100644 --- a/test/components/views/elements/Pill-test.tsx +++ b/test/components/views/elements/Pill-test.tsx @@ -11,6 +11,7 @@ import { act, render, RenderResult, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { mocked, Mocked } from "jest-mock"; import { MatrixClient, MatrixEvent, Room } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import dis from "../../../../src/dispatcher/dispatcher"; import { Pill, PillProps, PillType } from "../../../../src/components/views/elements/Pill"; @@ -56,6 +57,7 @@ describe("", () => {
, + { wrapper: TooltipProvider }, ); }; diff --git a/test/components/views/elements/RoomFacePile-test.tsx b/test/components/views/elements/RoomFacePile-test.tsx index 6d92b25ceb..4dea91c5a8 100644 --- a/test/components/views/elements/RoomFacePile-test.tsx +++ b/test/components/views/elements/RoomFacePile-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import { render } from "@testing-library/react"; import React from "react"; import { KnownMembership } from "matrix-js-sdk/src/types"; +import { TooltipProvider } from "@vector-im/compound-web"; import { mkRoom, mkRoomMember, stubClient, withClientContextRenderOptions } from "../../../test-utils"; import RoomFacePile from "../../../../src/components/views/elements/RoomFacePile"; @@ -26,7 +27,9 @@ describe("", () => { ]); const { asFragment } = render( - , + + + , withClientContextRenderOptions(MatrixClientPeg.get()!), ); diff --git a/test/components/views/messages/CallEvent-test.tsx b/test/components/views/messages/CallEvent-test.tsx index 2eff5e0112..eb9aff655f 100644 --- a/test/components/views/messages/CallEvent-test.tsx +++ b/test/components/views/messages/CallEvent-test.tsx @@ -11,6 +11,7 @@ import { render, screen, act, cleanup, fireEvent, waitFor } from "@testing-libra import { mocked, Mocked } from "jest-mock"; import { Room, RoomStateEvent, MatrixClient, PendingEventOrdering } from "matrix-js-sdk/src/matrix"; import { ClientWidgetApi, Widget } from "matrix-widget-api"; +import { TooltipProvider } from "@vector-im/compound-web"; import type { RoomMember } from "matrix-js-sdk/src/matrix"; import { @@ -94,7 +95,7 @@ describe("CallEvent", () => { }); const renderEvent = () => { - render(); + render(, { wrapper: TooltipProvider }); }; it("shows a message and duration if the call was ended", () => { diff --git a/test/components/views/messages/MStickerBody-test.tsx b/test/components/views/messages/MStickerBody-test.tsx index 71ef8f84b7..bb7bffd70a 100644 --- a/test/components/views/messages/MStickerBody-test.tsx +++ b/test/components/views/messages/MStickerBody-test.tsx @@ -11,6 +11,7 @@ import { render, screen } from "@testing-library/react"; import { EventType, getHttpUriForMxc, MatrixEvent, Room } from "matrix-js-sdk/src/matrix"; import fetchMock from "fetch-mock-jest"; import userEvent from "@testing-library/user-event"; +import { TooltipProvider } from "@vector-im/compound-web"; import { RoomPermalinkCreator } from "../../../../src/utils/permalinks/Permalinks"; import { @@ -77,7 +78,7 @@ describe("", () => { it("should show a tooltip on hover", async () => { fetchMock.getOnce(url, { status: 200 }); - render(); + render(, { wrapper: TooltipProvider }); expect(screen.queryByRole("tooltip")).toBeNull(); await userEvent.hover(screen.getByRole("img")); diff --git a/test/components/views/messages/MessageTimestamp-test.tsx b/test/components/views/messages/MessageTimestamp-test.tsx index 0a203a3f27..245a01cbbd 100644 --- a/test/components/views/messages/MessageTimestamp-test.tsx +++ b/test/components/views/messages/MessageTimestamp-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import { render, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; +import { TooltipProvider } from "@vector-im/compound-web"; import MessageTimestamp from "../../../../src/components/views/messages/MessageTimestamp"; @@ -22,7 +23,7 @@ describe("MessageTimestamp", () => { const DAY_MS = HOUR_MS * 24; it("should render HH:MM", () => { - const { asFragment } = render(); + const { asFragment } = render(, { wrapper: TooltipProvider }); expect(asFragment()).toMatchInlineSnapshot(` { }); it("should show full date & time on hover", async () => { - const { container } = render(); + const { container } = render(, { wrapper: TooltipProvider }); await userEvent.hover(container.querySelector(".mx_MessageTimestamp")!); expect((await screen.findByRole("tooltip")).textContent).toMatchInlineSnapshot(`"Fri, Dec 17, 2021, 08:09:00"`); }); @@ -45,6 +46,7 @@ describe("MessageTimestamp", () => { it("should show sent & received time on hover if passed", async () => { const { container } = render( , + { wrapper: TooltipProvider }, ); await userEvent.hover(container.querySelector(".mx_MessageTimestamp")!); expect((await screen.findByRole("tooltip")).textContent).toMatchInlineSnapshot( diff --git a/test/components/views/polls/pollHistory/PollHistory-test.tsx b/test/components/views/polls/pollHistory/PollHistory-test.tsx index bcf7164198..fcba92f218 100644 --- a/test/components/views/polls/pollHistory/PollHistory-test.tsx +++ b/test/components/views/polls/pollHistory/PollHistory-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import { act, fireEvent, render } from "@testing-library/react"; import { Filter, EventTimeline, Room, MatrixEvent, M_POLL_START } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import { PollHistory } from "../../../../../src/components/views/polls/pollHistory/PollHistory"; import { @@ -60,7 +61,9 @@ describe("", () => { const getComponent = () => render(, { wrapper: ({ children }) => ( - {children} + + {children} + ), }); diff --git a/test/components/views/polls/pollHistory/PollListItem-test.tsx b/test/components/views/polls/pollHistory/PollListItem-test.tsx index 2ccd78b08c..923cddb565 100644 --- a/test/components/views/polls/pollHistory/PollListItem-test.tsx +++ b/test/components/views/polls/pollHistory/PollListItem-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import { fireEvent, render } from "@testing-library/react"; import { MatrixEvent } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import { PollListItem } from "../../../../../src/components/views/polls/pollHistory/PollListItem"; import { makePollStartEvent, mockIntlDateTimeFormat, unmockIntlDateTimeFormat } from "../../../../test-utils"; @@ -17,7 +18,8 @@ describe("", () => { const event = makePollStartEvent("Question?", "@me:domain.org"); event.getContent().origin; const defaultProps = { event, onClick: jest.fn() }; - const getComponent = (props = {}) => render(); + const getComponent = (props = {}) => + render(, { wrapper: TooltipProvider }); beforeAll(() => { // mock default locale to en-GB and set timezone diff --git a/test/components/views/polls/pollHistory/PollListItemEnded-test.tsx b/test/components/views/polls/pollHistory/PollListItemEnded-test.tsx index 6d35b48615..5abb94e278 100644 --- a/test/components/views/polls/pollHistory/PollListItemEnded-test.tsx +++ b/test/components/views/polls/pollHistory/PollListItemEnded-test.tsx @@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import { render } from "@testing-library/react"; import { MatrixEvent, Poll, Room, M_TEXT } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import { PollListItemEnded } from "../../../../../src/components/views/polls/pollHistory/PollListItemEnded"; import { @@ -52,7 +53,7 @@ describe("", () => { const pollEndEvent = makePollEndEvent(pollId, roomId, userId, timestamp + 60000); const getComponent = (props: { event: MatrixEvent; poll: Poll }) => - render(); + render(, { wrapper: TooltipProvider }); beforeAll(() => { // mock default locale to en-GB and set timezone diff --git a/test/components/views/right_panel/RoomSummaryCard-test.tsx b/test/components/views/right_panel/RoomSummaryCard-test.tsx index 2e230c6352..6200c5b515 100644 --- a/test/components/views/right_panel/RoomSummaryCard-test.tsx +++ b/test/components/views/right_panel/RoomSummaryCard-test.tsx @@ -12,6 +12,7 @@ import { EventType, MatrixEvent, Room, MatrixClient, JoinRule } from "matrix-js- import { KnownMembership } from "matrix-js-sdk/src/types"; import { mocked, MockedObject } from "jest-mock"; import userEvent from "@testing-library/user-event"; +import { TooltipProvider } from "@vector-im/compound-web"; import DMRoomMap from "../../../../src/utils/DMRoomMap"; import RoomSummaryCard from "../../../../src/components/views/right_panel/RoomSummaryCard"; @@ -50,7 +51,9 @@ describe("", () => { return render(, { wrapper: ({ children }) => ( - {children} + + {children} + ), }); }; diff --git a/test/components/views/right_panel/UserInfo-test.tsx b/test/components/views/right_panel/UserInfo-test.tsx index 8c21246fa5..cec1ba96c3 100644 --- a/test/components/views/right_panel/UserInfo-test.tsx +++ b/test/components/views/right_panel/UserInfo-test.tsx @@ -22,6 +22,7 @@ import { CryptoApi, DeviceVerificationStatus, } from "matrix-js-sdk/src/crypto-api"; +import { TooltipProvider } from "@vector-im/compound-web"; import UserInfo, { BanToggleButton, @@ -196,7 +197,11 @@ describe("", () => { const renderComponent = (props = {}) => { const Wrapper = (wrapperProps = {}) => { - return ; + return ( + + + + ); }; return render(, { @@ -1109,7 +1114,11 @@ describe("", () => { const renderComponent = (props = {}) => { const Wrapper = (wrapperProps = {}) => { - return ; + return ( + + + + ); }; return render(, { diff --git a/test/components/views/rooms/EventTile-test.tsx b/test/components/views/rooms/EventTile-test.tsx index ee87e3250a..d966c091d0 100644 --- a/test/components/views/rooms/EventTile-test.tsx +++ b/test/components/views/rooms/EventTile-test.tsx @@ -21,6 +21,7 @@ import { } from "matrix-js-sdk/src/matrix"; import { CryptoApi, EventEncryptionInfo, EventShieldColour, EventShieldReason } from "matrix-js-sdk/src/crypto-api"; import { mkEncryptedMatrixEvent } from "matrix-js-sdk/src/testing"; +import { TooltipProvider } from "@vector-im/compound-web"; import EventTile, { EventTileProps } from "../../../../src/components/views/rooms/EventTile"; import MatrixClientContext from "../../../../src/contexts/MatrixClientContext"; @@ -49,11 +50,13 @@ describe("EventTile", () => { return ( - + + + ); diff --git a/test/components/views/rooms/LegacyRoomHeader-test.tsx b/test/components/views/rooms/LegacyRoomHeader-test.tsx index 16dbefbab0..94b4a01a93 100644 --- a/test/components/views/rooms/LegacyRoomHeader-test.tsx +++ b/test/components/views/rooms/LegacyRoomHeader-test.tsx @@ -25,6 +25,7 @@ import EventEmitter from "events"; import { setupJestCanvasMock } from "jest-canvas-mock"; import { ViewRoomOpts } from "@matrix-org/react-sdk-module-api/lib/lifecycles/RoomViewLifecycle"; import { MatrixRTCSession, MatrixRTCSessionManagerEvents } from "matrix-js-sdk/src/matrixrtc"; +import { TooltipProvider } from "@vector-im/compound-web"; import type { MatrixClient, MatrixEvent, RoomMember } from "matrix-js-sdk/src/matrix"; import type { MatrixCall } from "matrix-js-sdk/src/webrtc/call"; @@ -214,6 +215,7 @@ describe("LegacyRoomHeader", () => { {...props} /> , + { wrapper: TooltipProvider }, ); }; @@ -857,6 +859,7 @@ function mountHeader(room: Room, propsOverride = {}, roomContext?: Partial , + { wrapper: TooltipProvider }, ); } diff --git a/test/components/views/rooms/MemberList-test.tsx b/test/components/views/rooms/MemberList-test.tsx index 42357d9997..a0ba36dcbf 100644 --- a/test/components/views/rooms/MemberList-test.tsx +++ b/test/components/views/rooms/MemberList-test.tsx @@ -20,6 +20,7 @@ import { import { Room, MatrixClient, RoomState, RoomMember, User, MatrixEvent } from "matrix-js-sdk/src/matrix"; import { KnownMembership } from "matrix-js-sdk/src/types"; import { mocked, MockedObject } from "jest-mock"; +import { TooltipProvider } from "@vector-im/compound-web"; import { MatrixClientPeg } from "../../../../src/MatrixClientPeg"; import * as TestUtils from "../../../test-utils"; @@ -231,6 +232,7 @@ describe("MemberList", () => { ref={gatherWrappedRef} /> , + { wrapper: TooltipProvider }, ); } @@ -383,6 +385,7 @@ describe("MemberList", () => { roomId={room.roomId} /> , + { wrapper: TooltipProvider }, ); }; diff --git a/test/components/views/rooms/MemberTile-test.tsx b/test/components/views/rooms/MemberTile-test.tsx index 5e3e66048a..bb9e23aad1 100644 --- a/test/components/views/rooms/MemberTile-test.tsx +++ b/test/components/views/rooms/MemberTile-test.tsx @@ -12,6 +12,7 @@ import { MatrixClient, RoomMember, Device } from "matrix-js-sdk/src/matrix"; import { UserVerificationStatus, DeviceVerificationStatus } from "matrix-js-sdk/src/crypto-api"; import { mocked } from "jest-mock"; import userEvent from "@testing-library/user-event"; +import { TooltipProvider } from "@vector-im/compound-web"; import * as TestUtils from "../../../test-utils"; import MemberTile from "../../../../src/components/views/rooms/MemberTile"; @@ -27,7 +28,7 @@ describe("MemberTile", () => { }); it("should not display an E2EIcon when the e2E status = normal", () => { - const { container } = render(); + const { container } = render(, { wrapper: TooltipProvider }); expect(container).toMatchSnapshot(); }); @@ -38,7 +39,7 @@ describe("MemberTile", () => { wasCrossSigningVerified: jest.fn().mockReturnValue(true), } as unknown as UserVerificationStatus); - const { container } = render(); + const { container } = render(, { wrapper: TooltipProvider }); expect(container).toMatchSnapshot(); await waitFor(async () => { @@ -62,7 +63,7 @@ describe("MemberTile", () => { crossSigningVerified: true, } as DeviceVerificationStatus); - const { container } = render(); + const { container } = render(, { wrapper: TooltipProvider }); expect(container).toMatchSnapshot(); await waitFor(async () => { diff --git a/test/components/views/rooms/MessageComposer-test.tsx b/test/components/views/rooms/MessageComposer-test.tsx index 385f04adae..1ad45cb86e 100644 --- a/test/components/views/rooms/MessageComposer-test.tsx +++ b/test/components/views/rooms/MessageComposer-test.tsx @@ -10,6 +10,7 @@ import * as React from "react"; import { EventType, MatrixEvent, Room, RoomMember, THREAD_RELATION_TYPE } from "matrix-js-sdk/src/matrix"; import { act, fireEvent, render, screen, waitFor } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; +import { TooltipProvider } from "@vector-im/compound-web"; import { clearAllModals, @@ -529,7 +530,7 @@ function wrapAndRender( ); return { rawComponent: getRawComponent(props, roomContext, mockClient), - renderResult: render(getRawComponent(props, roomContext, mockClient)), + renderResult: render(getRawComponent(props, roomContext, mockClient), { wrapper: TooltipProvider }), roomContext, }; } diff --git a/test/components/views/rooms/RoomHeader-test.tsx b/test/components/views/rooms/RoomHeader-test.tsx index cbd7cf00b8..b973f5b2b3 100644 --- a/test/components/views/rooms/RoomHeader-test.tsx +++ b/test/components/views/rooms/RoomHeader-test.tsx @@ -33,6 +33,7 @@ import { } from "@testing-library/react"; import { ViewRoomOpts } from "@matrix-org/react-sdk-module-api/lib/lifecycles/RoomViewLifecycle"; import { mocked } from "jest-mock"; +import { TooltipProvider } from "@vector-im/compound-web"; import { filterConsole, stubClient } from "../../../test-utils"; import RoomHeader from "../../../../src/components/views/rooms/RoomHeader"; @@ -60,7 +61,11 @@ jest.mock("../../../../src/utils/ShieldUtils"); function getWrapper(): RenderOptions { return { wrapper: ({ children }) => ( - {children} + + + {children} + + ), }; } diff --git a/test/components/views/rooms/RoomHeader/CallGuestLinkButton-test.tsx b/test/components/views/rooms/RoomHeader/CallGuestLinkButton-test.tsx index 9930755629..4566c50e14 100644 --- a/test/components/views/rooms/RoomHeader/CallGuestLinkButton-test.tsx +++ b/test/components/views/rooms/RoomHeader/CallGuestLinkButton-test.tsx @@ -10,6 +10,7 @@ import React from "react"; import { fireEvent, getByLabelText, getByText, render, screen, waitFor } from "@testing-library/react"; import { EventTimeline, JoinRule, Room } from "matrix-js-sdk/src/matrix"; import { KnownMembership } from "matrix-js-sdk/src/types"; +import { TooltipProvider } from "@vector-im/compound-web"; import { SDKContext, SdkContextClass } from "../../../../../src/contexts/SDKContext"; import { getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../../test-utils"; @@ -66,7 +67,11 @@ describe("", () => { const getComponent = (room: Room) => render(, { - wrapper: ({ children }) => {children}, + wrapper: ({ children }) => ( + + {children} + + ), }); const oldGet = SdkConfig.get; @@ -212,7 +217,11 @@ describe("", () => { const getComponent = (room: Room, canInvite: boolean = true) => render(, { - wrapper: ({ children }) => {children}, + wrapper: ({ children }) => ( + + {children} + + ), }); beforeEach(() => { diff --git a/test/components/views/rooms/RoomHeader/VideoRoomChatButton-test.tsx b/test/components/views/rooms/RoomHeader/VideoRoomChatButton-test.tsx index 7da81eea46..d785db3fa5 100644 --- a/test/components/views/rooms/RoomHeader/VideoRoomChatButton-test.tsx +++ b/test/components/views/rooms/RoomHeader/VideoRoomChatButton-test.tsx @@ -10,6 +10,7 @@ import React from "react"; import { MockedObject } from "jest-mock"; import { Room } from "matrix-js-sdk/src/matrix"; import { fireEvent, render, screen, waitFor } from "@testing-library/react"; +import { TooltipProvider } from "@vector-im/compound-web"; import { VideoRoomChatButton } from "../../../../../src/components/views/rooms/RoomHeader/VideoRoomChatButton"; import { SDKContext, SdkContextClass } from "../../../../../src/contexts/SDKContext"; @@ -48,7 +49,11 @@ describe("", () => { const getComponent = (room: Room) => render(, { - wrapper: ({ children }) => {children}, + wrapper: ({ children }) => ( + + {children} + + ), }); beforeEach(() => { diff --git a/test/components/views/rooms/RoomList-test.tsx b/test/components/views/rooms/RoomList-test.tsx index a9b78f6c1b..41d58deaed 100644 --- a/test/components/views/rooms/RoomList-test.tsx +++ b/test/components/views/rooms/RoomList-test.tsx @@ -12,6 +12,7 @@ import { cleanup, queryByRole, render, screen, within } from "@testing-library/r import userEvent from "@testing-library/user-event"; import { mocked } from "jest-mock"; import { Room } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import RoomList from "../../../../src/components/views/rooms/RoomList"; import ResizeNotifier from "../../../../src/utils/ResizeNotifier"; @@ -47,16 +48,18 @@ describe("RoomList", () => { function getComponent(props: Partial = {}): JSX.Element { return ( - + + + ); } diff --git a/test/components/views/settings/devices/FilteredDeviceList-test.tsx b/test/components/views/settings/devices/FilteredDeviceList-test.tsx index 4aad77d9dd..06a8131b44 100644 --- a/test/components/views/settings/devices/FilteredDeviceList-test.tsx +++ b/test/components/views/settings/devices/FilteredDeviceList-test.tsx @@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details. import React, { ComponentProps } from "react"; import { act, fireEvent, render } from "@testing-library/react"; +import { TooltipProvider } from "@vector-im/compound-web"; import { FilteredDeviceList } from "../../../../../src/components/views/settings/devices/FilteredDeviceList"; import { DeviceSecurityVariation } from "../../../../../src/components/views/settings/devices/types"; @@ -73,7 +74,11 @@ describe("", () => { supportsMSC3881: true, }; - const getComponent = (props = {}) => ; + const getComponent = (props = {}) => ( + + + + ); afterAll(() => { jest.spyOn(global.Date, "now").mockRestore(); diff --git a/test/components/views/settings/devices/FilteredDeviceListHeader-test.tsx b/test/components/views/settings/devices/FilteredDeviceListHeader-test.tsx index a327048ebf..267b09e239 100644 --- a/test/components/views/settings/devices/FilteredDeviceListHeader-test.tsx +++ b/test/components/views/settings/devices/FilteredDeviceListHeader-test.tsx @@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details. import { fireEvent, render } from "@testing-library/react"; import React from "react"; +import { TooltipProvider } from "@vector-im/compound-web"; import FilteredDeviceListHeader from "../../../../../src/components/views/settings/devices/FilteredDeviceListHeader"; @@ -19,7 +20,11 @@ describe("", () => { children:
test
, ["data-testid"]: "test123", }; - const getComponent = (props = {}) => ; + const getComponent = (props = {}) => ( + + + + ); it("renders correctly when no devices are selected", () => { const { container } = render(getComponent()); diff --git a/test/components/views/settings/tabs/user/SessionManagerTab-test.tsx b/test/components/views/settings/tabs/user/SessionManagerTab-test.tsx index 616c3b1d1f..d9314d0096 100644 --- a/test/components/views/settings/tabs/user/SessionManagerTab-test.tsx +++ b/test/components/views/settings/tabs/user/SessionManagerTab-test.tsx @@ -36,6 +36,7 @@ import { } from "matrix-js-sdk/src/matrix"; import { mocked, MockedObject } from "jest-mock"; import fetchMock from "fetch-mock-jest"; +import { TooltipProvider } from "@vector-im/compound-web"; import { clearAllModals, @@ -132,11 +133,13 @@ describe("", () => { const defaultProps = {}; const getComponent = (props = {}): React.ReactElement => ( - - - - - + + + + + + + ); const toggleDeviceDetails = ( diff --git a/test/components/views/spaces/ThreadsActivityCentre-test.tsx b/test/components/views/spaces/ThreadsActivityCentre-test.tsx index 5a728d9b9d..547565e402 100644 --- a/test/components/views/spaces/ThreadsActivityCentre-test.tsx +++ b/test/components/views/spaces/ThreadsActivityCentre-test.tsx @@ -10,6 +10,7 @@ import React, { ComponentProps } from "react"; import { getByText, render, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { NotificationCountType, PendingEventOrdering, Room } from "matrix-js-sdk/src/matrix"; +import { TooltipProvider } from "@vector-im/compound-web"; import { ThreadsActivityCentre } from "../../../../src/components/views/spaces/threads-activity-centre"; import { MatrixClientPeg } from "../../../../src/MatrixClientPeg"; @@ -38,6 +39,7 @@ describe("ThreadsActivityCentre", () => { , + { wrapper: TooltipProvider }, ); }; @@ -260,6 +262,7 @@ describe("ThreadsActivityCentre", () => {
, + { wrapper: TooltipProvider }, ); await userEvent.click(getTACButton()); diff --git a/test/components/views/voip/CallView-test.tsx b/test/components/views/voip/CallView-test.tsx index d12e4c0f6e..c569271acd 100644 --- a/test/components/views/voip/CallView-test.tsx +++ b/test/components/views/voip/CallView-test.tsx @@ -12,6 +12,7 @@ import { render, screen, act, fireEvent, waitFor, cleanup } from "@testing-libra import { mocked, Mocked } from "jest-mock"; import { MatrixClient, PendingEventOrdering, Room, RoomStateEvent } from "matrix-js-sdk/src/matrix"; import { Widget } from "matrix-widget-api"; +import { TooltipProvider } from "@vector-im/compound-web"; import type { RoomMember } from "matrix-js-sdk/src/matrix"; import type { ClientWidgetApi } from "matrix-widget-api"; @@ -65,7 +66,9 @@ describe("CallView", () => { }); const renderView = async (skipLobby = false): Promise => { - render(); + render(, { + wrapper: TooltipProvider, + }); await act(() => Promise.resolve()); // Let effects settle };