Cleanup member-avatar test setup

aragon · Mar 12, 2024 · edfc436 · edfc436
1 parent 4423012
commit edfc436
Showing 1 changed file with 19 additions and 30 deletions.
diff --git a/src/modules/components/member/memberAvatar/memberAvatar.test.tsx b/src/modules/components/member/memberAvatar/memberAvatar.test.tsx
@@ -1,33 +1,25 @@
 import { render, screen, waitFor } from '@testing-library/react';
-import { getAddress, isAddress } from 'viem';
+import * as blockies from 'blockies-ts';
+import * as viem from 'viem';
 import { normalize } from 'viem/ens';
-import { useEnsAddress, useEnsAvatar, useEnsName } from 'wagmi';
+import * as wagmi from 'wagmi';
 import { MemberAvatar, type IMemberAvatarProps } from './memberAvatar';
 
-jest.mock('viem', () => ({
-    isAddress: jest.fn(),
-    getAddress: jest.fn(),
-}));
-
-jest.mock('viem/ens', () => ({
-    normalize: jest.fn(),
-}));
+describe('<MemberAvatar /> component', () => {
+    const originalGlobalImage = global.Image;
 
-jest.mock('wagmi', () => ({
-    useEnsAddress: jest.fn(),
-    useEnsName: jest.fn(),
-    useEnsAvatar: jest.fn(),
-}));
+    const useEnsAddressMock = jest.spyOn(wagmi, 'useEnsAddress');
+    const useEnsNameMock = jest.spyOn(wagmi, 'useEnsName');
+    const useEnsAvatarMock = jest.spyOn(wagmi, 'useEnsAvatar');
+    const getAddressMock = jest.spyOn(viem, 'getAddress');
+    const blockiesCreateMock = jest.spyOn(blockies, 'create');
 
-describe('<MemberAvatar /> component', () => {
     const createTestComponent = (props?: Partial<IMemberAvatarProps>) => {
         const completeProps: IMemberAvatarProps = { ...props };
 
         return <MemberAvatar {...completeProps} />;
     };
 
-    const originalGlobalImage = global.Image;
-
     beforeAll(() => {
         (window.Image as unknown) = class MockImage {
             onload: () => void = () => {};
@@ -45,13 +37,11 @@ describe('<MemberAvatar /> component', () => {
     });
 
     beforeEach(() => {
-        jest.clearAllMocks();
-
-        (isAddress as unknown as jest.Mock).mockImplementation(() => true);
-        (getAddress as unknown as jest.Mock).mockImplementation(() => '0x028F5Ca0b3A3A14e44AB8af660B53D1e428457e7');
-        (useEnsAddress as jest.Mock).mockReturnValue({ data: null, isLoading: false });
-        (useEnsName as jest.Mock).mockReturnValue({ data: null, isLoading: false });
-        (useEnsAvatar as jest.Mock).mockReturnValue({ data: null, isLoading: false });
+        useEnsAddressMock.mockReturnValue({ data: null, isLoading: false } as wagmi.UseEnsAddressReturnType);
+        useEnsNameMock.mockReturnValue({ data: null, isLoading: false } as wagmi.UseEnsNameReturnType);
+        useEnsAvatarMock.mockReturnValue({ data: null, isLoading: false } as wagmi.UseEnsAvatarReturnType);
+        getAddressMock.mockImplementation((value) => value as viem.Address);
+        blockiesCreateMock.mockReturnValue({ toDataURL: () => '' } as HTMLCanvasElement);
     });
 
     it('displays the avatar directly from avatarSrc prop and ensure no data fetching is attempted', async () => {
@@ -66,26 +56,25 @@ describe('<MemberAvatar /> component', () => {
         const ensName = 'vitalik.eth';
         const expectedAvatarUrl = 'ensAvatarUrl';
 
-        (useEnsAvatar as jest.Mock).mockReturnValue({ data: expectedAvatarUrl, isLoading: false });
+        useEnsAvatarMock.mockReturnValue({ data: expectedAvatarUrl, isLoading: false } as wagmi.UseEnsAvatarReturnType);
 
         render(createTestComponent({ ensName }));
 
         await waitFor(() => expect(screen.getByRole('img')).toHaveAttribute('src', expectedAvatarUrl));
 
-        expect(useEnsAvatar).toHaveBeenCalledWith(expect.objectContaining({ name: normalize(ensName) }));
+        expect(useEnsAvatarMock).toHaveBeenCalledWith(expect.objectContaining({ name: normalize(ensName) }));
     });
 
     it('displays avatar for a valid address and call related hooks with correct parameters', async () => {
         const address = '0x028F5Ca0b3A3A14e44AB8af660B53D1e428457e7';
         const expectedAvatarUrl = 'addressAvatarUrl';
 
-        (useEnsAvatar as jest.Mock).mockReturnValue({ data: expectedAvatarUrl, isLoading: false });
+        useEnsAvatarMock.mockReturnValue({ data: expectedAvatarUrl, isLoading: false } as wagmi.UseEnsAvatarReturnType);
 
         render(createTestComponent({ address }));
 
         await waitFor(() => expect(screen.getByRole('img')).toHaveAttribute('src', expectedAvatarUrl));
 
-        expect(isAddress).toHaveBeenCalledWith(address);
-        expect(useEnsName).toHaveBeenCalledWith(expect.objectContaining({ address }));
+        expect(useEnsNameMock).toHaveBeenCalledWith(expect.objectContaining({ address }));
     });
 });