Convert useUserDirectory tests to RTL (#10160)

test/hooks/useUserDirectory-test.tsx

@@ -14,27 +14,16 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-// eslint-disable-next-line deprecate/import
+import { waitFor } from "@testing-library/react";
-import { mount } from "enzyme";
+import { renderHook, act } from "@testing-library/react-hooks/dom";
 import { MatrixClient } from "matrix-js-sdk/src/matrix";
-import { sleep } from "matrix-js-sdk/src/utils";
-import React from "react";
-import { act } from "react-dom/test-utils";
 
 import { useUserDirectory } from "../../src/hooks/useUserDirectory";
 import { MatrixClientPeg } from "../../src/MatrixClientPeg";
 import { stubClient } from "../test-utils";
 
-function UserDirectoryComponent({ onClick }: { onClick(hook: ReturnType<typeof useUserDirectory>): void }) {
+function render() {
-    const userDirectory = useUserDirectory();
+    return renderHook(() => useUserDirectory());
-
-    const { ready, loading, users } = userDirectory;
-
-    return (
-        <div onClick={() => onClick(userDirectory)}>
-            {users[0] ? `Name: ${users[0].name}` : `ready: ${ready}, loading: ${loading}`}
-        </div>
-    );
 }
 
 describe("useUserDirectory", () => {
@@ -60,48 +49,28 @@ describe("useUserDirectory", () => {
 
     it("search for users in the identity server", async () => {
         const query = "Bob";
+        const { result } = render();
 
-        const wrapper = mount(
+        act(() => {
-            <UserDirectoryComponent
+            result.current.search({ limit: 1, query });
-                onClick={(hook) => {
-                    hook.search({
-                        limit: 1,
-                        query,
         });
-                }}
+        await waitFor(() => expect(result.current.ready).toBe(true));
-            />,
-        );
 
-        expect(wrapper.text()).toBe("ready: true, loading: false");
+        expect(result.current.loading).toBe(false);
-
+        expect(result.current.users[0].name).toBe(query);
-        await act(async () => {
-            await sleep(1);
-            wrapper.simulate("click");
-            return act(() => sleep(1));
-        });
-
-        expect(wrapper.text()).toContain(query);
     });
 
     it("should work with empty queries", async () => {
         const query = "";
+        const { result } = render();
 
-        const wrapper = mount(
+        act(() => {
-            <UserDirectoryComponent
+            result.current.search({ limit: 1, query });
-                onClick={(hook) => {
-                    hook.search({
-                        limit: 1,
-                        query,
         });
-                }}
+        await waitFor(() => expect(result.current.ready).toBe(true));
-            />,
+
-        );
+        expect(result.current.loading).toBe(false);
-        await act(async () => {
+        expect(result.current.users).toEqual([]);
-            await sleep(1);
-            wrapper.simulate("click");
-            return act(() => sleep(1));
-        });
-        expect(wrapper.text()).toBe("ready: true, loading: false");
     });
 
     it("should recover from a server exception", async () => {
@@ -110,21 +79,14 @@ describe("useUserDirectory", () => {
         };
         const query = "Bob";
 
-        const wrapper = mount(
+        const { result } = render();
-            <UserDirectoryComponent
+
-                onClick={(hook) => {
+        act(() => {
-                    hook.search({
+            result.current.search({ limit: 1, query });
-                        limit: 1,
-                        query,
         });
-                }}
+        await waitFor(() => expect(result.current.ready).toBe(true));
-            />,
+
-        );
+        expect(result.current.loading).toBe(false);
-        await act(async () => {
+        expect(result.current.users).toEqual([]);
-            await sleep(1);
-            wrapper.simulate("click");
-            return act(() => sleep(1));
-        });
-        expect(wrapper.text()).toBe("ready: true, loading: false");
     });
 });