Fix jest - 1

Author: MidhunSureshR

src/components/views/elements/AccessibleButton.tsx

@@ -212,7 +212,7 @@ const AccessibleButton = forwardRef(function <T extends keyof JSX.IntrinsicEleme
     if (title) {
         return (
             <Tooltip
-                label={title}
+                description={title}
                 caption={caption}
                 isTriggerInteractive={true}
                 placement={placement}

test/components/views/dialogs/RoomSettingsDialog-test.tsx

@@ -17,6 +17,7 @@ import {
     RoomStateEvent,
     Visibility,
 } from "matrix-js-sdk/src/matrix";
+import { TooltipProvider } from "@vector-im/compound-web";
 
 import { getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../test-utils";
 import RoomSettingsDialog from "../../../../src/components/views/dialogs/RoomSettingsDialog";
@@ -65,7 +66,9 @@ describe("<RoomSettingsDialog />", () => {
     const getComponent = (onFinished = jest.fn(), propRoomId = roomId) =>
         render(<RoomSettingsDialog roomId={propRoomId} onFinished={onFinished} />, {
             wrapper: ({ children }) => (
-                <MatrixClientContext.Provider value={mockClient}>{children}</MatrixClientContext.Provider>
+                <MatrixClientContext.Provider value={mockClient}>
+                    <TooltipProvider>{children}</TooltipProvider>
+                </MatrixClientContext.Provider>
             ),
         });
 

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

@@ -312,7 +312,7 @@ describe("<UserInfo />", () => {
         it("renders close button correctly when encryption panel with a pending verification request", async () => {
             renderComponent({ phase: RightPanelPhases.EncryptionPanel, verificationRequest });
             screen.getByTestId("base-card-close-button").focus();
-            await expect(screen.findByRole("tooltip", { name: "Cancel" })).resolves.toBeInTheDocument();
+            expect(screen.getByText("Cancel")).toBeInTheDocument();
         });
     });
 
@@ -343,9 +343,12 @@ describe("<UserInfo />", () => {
 
         it("renders the message button", () => {
             render(
-                <MatrixClientContext.Provider value={mockClient}>
-                    <UserInfo {...defaultProps} />
-                </MatrixClientContext.Provider>,
+                <TooltipProvider>
+                    <MatrixClientContext.Provider value={mockClient}>
+                        <UserInfo {...defaultProps} />
+                    </MatrixClientContext.Provider>
+                    ,
+                </TooltipProvider>,
             );
 
             screen.getByRole("button", { name: "Send message" });
@@ -358,9 +361,11 @@ describe("<UserInfo />", () => {
                 },
                 () => {
                     render(
-                        <MatrixClientContext.Provider value={mockClient}>
-                            <UserInfo {...defaultProps} />
-                        </MatrixClientContext.Provider>,
+                        <TooltipProvider>
+                            <MatrixClientContext.Provider value={mockClient}>
+                                <UserInfo {...defaultProps} />
+                            </MatrixClientContext.Provider>
+                        </TooltipProvider>,
                     );
 
                     expect(screen.queryByRole("button", { name: "Message" })).toBeNull();
@@ -706,7 +711,11 @@ describe("<UserInfoHeader />", () => {
 
     const renderComponent = (props = {}) => {
         const Wrapper = (wrapperProps = {}) => {
-            return <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />;
+            return (
+                <TooltipProvider>
+                    <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />
+                </TooltipProvider>
+            );
         };
 
         return render(<UserInfoHeader {...defaultProps} {...props} />, {
@@ -748,9 +757,14 @@ describe("<DeviceItem />", () => {
             return <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />;
         };
 
-        return render(<DeviceItem {...defaultProps} {...props} />, {
-            wrapper: Wrapper,
-        });
+        return render(
+            <TooltipProvider>
+                <DeviceItem {...defaultProps} {...props} />
+            </TooltipProvider>,
+            {
+                wrapper: Wrapper,
+            },
+        );
     };
 
     const setMockDeviceTrust = (isVerified = false, isCrossSigningVerified = false) => {
@@ -888,7 +902,11 @@ describe("<UserOptionsSection />", () => {
 
     const renderComponent = (props = {}) => {
         const Wrapper = (wrapperProps = {}) => {
-            return <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />;
+            return (
+                <TooltipProvider>
+                    <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />
+                </TooltipProvider>
+            );
         };
 
         return render(<UserOptionsSection {...defaultProps} {...props} />, {
@@ -1177,7 +1195,11 @@ describe("<RoomKickButton />", () => {
 
     const renderComponent = (props = {}) => {
         const Wrapper = (wrapperProps = {}) => {
-            return <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />;
+            return (
+                <TooltipProvider>
+                    <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />
+                </TooltipProvider>
+            );
         };
 
         return render(<RoomKickButton {...defaultProps} {...props} />, {
@@ -1284,7 +1306,11 @@ describe("<BanToggleButton />", () => {
 
     const renderComponent = (props = {}) => {
         const Wrapper = (wrapperProps = {}) => {
-            return <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />;
+            return (
+                <TooltipProvider>
+                    <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />
+                </TooltipProvider>
+            );
         };
 
         return render(<BanToggleButton {...defaultProps} {...props} />, {
@@ -1416,7 +1442,11 @@ describe("<RoomAdminToolsContainer />", () => {
 
     const renderComponent = (props = {}) => {
         const Wrapper = (wrapperProps = {}) => {
-            return <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />;
+            return (
+                <TooltipProvider>
+                    <MatrixClientContext.Provider value={mockClient} {...wrapperProps} />
+                </TooltipProvider>
+            );
         };
 
         return render(<RoomAdminToolsContainer {...defaultProps} {...props} />, {