test(frontend): Fix tests

maikbasel · May 21, 2024 · 4fc6568 · 4fc6568
1 parent 99cfa81
commit 4fc6568
Show file tree

Hide file tree

Showing 4 changed files with 62 additions and 70 deletions.
diff --git a/src/app/page.test.tsx b/src/app/page.test.tsx
@@ -1,7 +1,5 @@
 import { render, screen, waitFor } from '@testing-library/react';
 import Profiles from './page';
-import { mockIPC } from '@tauri-apps/api/mocks';
-import { SWRConfig } from 'swr';
 import React from 'react';
 import { ProfileSet } from '@/modules/profiles/core/domain';
 import { getProfiles } from '@/modules/profiles/application/get-profiles';
@@ -19,7 +17,7 @@ const profileSet: ProfileSet = {
   profiles: [],
 };
 
-describe('Profiles', () => {
+describe('<Profiles />', () => {
   beforeEach(() => {
     mockGetProfiles.mockResolvedValue(Ok(profileSet));
   });
@@ -28,34 +26,28 @@ describe('Profiles', () => {
     jest.resetAllMocks();
   });
 
-  test('should render loading state', () => {
+  test('should render loading state', async () => {
     render(
-      <SWRConfig value={{ provider: () => new Map() }}>
-        <DIContextProvider>
-          <Profiles />
-        </DIContextProvider>
-      </SWRConfig>
+      <DIContextProvider>
+        <Profiles />
+      </DIContextProvider>
     );
 
-    const loadingElement = screen.getByText(/loading/i);
-    expect(loadingElement).toBeInTheDocument();
+    await waitFor(() => {
+      const loadingElement = screen.getByText(/loading/i);
+      expect(loadingElement).toBeInTheDocument();
+    });
   });
 
   test('should render error state', async () => {
     const profileSet: ProfileSet = {
       profiles: [],
     };
-    mockIPC((cmd) => {
-      if (cmd === 'get_profiles') {
-        return profileSet;
-      }
-    });
+    mockGetProfiles.mockResolvedValue(Ok(profileSet));
     render(
-      <SWRConfig value={{ provider: () => new Map() }}>
-        <DIContextProvider>
-          <Profiles />
-        </DIContextProvider>
-      </SWRConfig>
+      <DIContextProvider>
+        <Profiles />
+      </DIContextProvider>
     );
     await waitFor(() => {
       expect(screen.queryByText('Loading...')).not.toBeInTheDocument();

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -24,7 +24,7 @@ const ProfilesPage = () => {
   return <ProfileDataTable data={profileSet!} />;
 };
 
-export default function App() {
+export default function Profiles() {
   return (
     <div className='flex h-full flex-col space-y-4 p-4 pt-6'>
       <Breadcrumb>

diff --git a/src/sections/dashboard/components/header/header.test.tsx b/src/sections/dashboard/components/header/header.test.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, screen } from '@testing-library/react';
+import { render, screen, waitFor } from '@testing-library/react';
 import Header from '@/sections/dashboard/components/header/header';
 import { SWRConfig } from 'swr';
 import { getProfiles } from '@/modules/profiles/application/get-profiles';
@@ -43,25 +43,25 @@ describe('<Header />', () => {
 
   it('should render the Header component without crashing', () => {
     render(
-      <SWRConfig value={{ provider: () => new Map() }}>
-        <DIContextProvider>
-          <Header />
-        </DIContextProvider>
-      </SWRConfig>
+      <DIContextProvider>
+        <Header />
+      </DIContextProvider>
     );
 
-    expect(screen.getByTestId('app-header-label')).toBeInTheDocument();
+    waitFor(() =>
+      expect(screen.getByTestId('app-header-label')).toBeInTheDocument()
+    );
   });
 
   it('should render the MobileSidebar component within the Header component', () => {
     render(
-      <SWRConfig value={{ provider: () => new Map() }}>
-        <DIContextProvider>
-          <Header />
-        </DIContextProvider>
-      </SWRConfig>
+      <DIContextProvider>
+        <Header />
+      </DIContextProvider>
     );
 
-    expect(screen.getByTestId('mobile-app-header-label')).toBeInTheDocument();
+    waitFor(() =>
+      expect(screen.getByTestId('mobile-app-header-label')).toBeInTheDocument()
+    );
   });
 });
diff --git a/src/sections/dashboard/components/header/profile-nav.test.tsx b/src/sections/dashboard/components/header/profile-nav.test.tsx
@@ -3,7 +3,6 @@ import { render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { randomFillSync } from 'crypto';
 import { ProfileNav } from '@/sections/dashboard/components/header/profile-nav';
-import { clearMocks, mockIPC } from '@tauri-apps/api/mocks';
 import { SWRConfig } from 'swr';
 import { ProfileSet } from '@/modules/profiles/core/domain';
 import { DIContextProvider } from '@/context/di-context';
@@ -74,7 +73,10 @@ describe('<ProfileNav />', () => {
         </DIContextProvider>
       </SWRConfig>
     );
-    expect(screen.getByText('Loading...')).toBeInTheDocument();
+
+    await waitFor(() =>
+      expect(screen.getByText('Loading...')).toBeInTheDocument()
+    );
   });
 
   it('should expand profile nav when dropdown is clicked', async () => {
@@ -140,42 +142,40 @@ describe('<ProfileNav />', () => {
   });
 
   it('should not render chevron icon when no additional profiles are available', async () => {
-    const singleProfile: ProfileSet = {
-      profiles: [
-        {
-          name: 'prof1',
-          credentials: {
-            access_key_id: 'key1',
-            secret_access_key: 'secret1',
+    jest.isolateModules(async () => {
+      const singleProfile: ProfileSet = {
+        profiles: [
+          {
+            name: 'prof1',
+            credentials: {
+              access_key_id: 'key1',
+              secret_access_key: 'secret1',
+            },
+            config: {
+              region: 'region1',
+              output_format: 'format1',
+            },
           },
-          config: {
-            region: 'region1',
-            output_format: 'format1',
-          },
-        },
-      ],
-    };
-    mockIPC((cmd) => {
-      if (cmd === 'get_profiles') {
-        return singleProfile;
-      }
-    });
-    render(
-      <SWRConfig value={{ provider: () => new Map() }}>
-        <DIContextProvider>
-          <ProfileNav />
-        </DIContextProvider>
-      </SWRConfig>
-    );
-    // await waitForElementToBeRemoved(() => screen.queryByText('Loading...')); see https://github.com/testing-library/react-testing-library/issues/865
-    await waitFor(() => {
-      expect(screen.queryByText('Loading...')).not.toBeInTheDocument();
-    });
+        ],
+      };
+      mockGetProfiles.mockResolvedValue(Ok(singleProfile));
+      render(
+        <SWRConfig value={{ provider: () => new Map() }}>
+          <DIContextProvider>
+            <ProfileNav />
+          </DIContextProvider>
+        </SWRConfig>
+      );
+      // await waitForElementToBeRemoved(() => screen.queryByText('Loading...')); see https://github.com/testing-library/react-testing-library/issues/865
+      await waitFor(() => {
+        expect(screen.queryByText('Loading...')).not.toBeInTheDocument();
+      });
 
-    const triggerButton = screen.getByTestId('profile-nav-trigger');
-    const chevronSvg = triggerButton.querySelector('svg .lucide-chevron-up');
+      const triggerButton = screen.getByTestId('profile-nav-trigger');
+      const chevronSvg = triggerButton.querySelector('svg .lucide-chevron-up');
 
-    expect(chevronSvg).not.toBeInTheDocument();
+      expect(chevronSvg).not.toBeInTheDocument();
+    });
   });
 
   it('should render placeholder values for region and format label in profile nav trigger when these optional values are not set', async () => {