Fix Unit Tests after upgrade to React Query v5

backend/src/Designer/RepositoryClient/Model/User.cs

@@ -79,7 +79,7 @@ public User()
         /// <summary>
         /// Sets
         /// </summary>
-        [DataMember(Name = "UserType", EmitDefaultValue = false)]
+        [DataMember(Name = "userType", EmitDefaultValue = false)]
         public UserType UserType { get; set; }
 
         /// <summary>

frontend/app-development/features/appPublish/components/deploy/DeployDropdown.test.tsx

@@ -16,13 +16,17 @@ describe('DeployDropdown', () => {
     it('should open the confirmation dialog when clicking the delete button', async () => {
       await render();
 
-      const deleteButton = screen.getByRole('button', { name: textMock('app_deploy_messages.btn_deploy_new_version') });
+      const deleteButton = screen.getByRole('button', {
+        name: textMock('app_deploy_messages.btn_deploy_new_version'),
+      });
       await act(() => user.click(deleteButton));
 
       const dialog = screen.getByRole('dialog');
       expect(dialog).toBeInTheDocument();
 
-      const text = await screen.findByText(textMock('app_deploy_messages.deploy_confirmation_short', { selectedImageTag: '' }));
+      const text = await screen.findByText(
+        textMock('app_deploy_messages.deploy_confirmation_short', { selectedImageTag: '' }),
+      );
       expect(text).toBeInTheDocument();
 
       const confirmButton = screen.getByRole('button', { name: textMock('general.yes') });
@@ -35,38 +39,44 @@ describe('DeployDropdown', () => {
     it('should confirm and close the dialog when clicking the confirm button', async () => {
       await render();
 
-      const deleteButton = screen.getByRole('button', { name: textMock('app_deploy_messages.btn_deploy_new_version') });
+      const deleteButton = screen.getByRole('button', {
+        name: textMock('app_deploy_messages.btn_deploy_new_version'),
+      });
       await act(() => user.click(deleteButton));
 
       const confirmButton = screen.getByRole('button', { name: textMock('general.yes') });
       await act(() => user.click(confirmButton));
 
-      expect(startDeployMock).toBeCalledTimes(1);
+      expect(startDeployMock).toHaveBeenCalledTimes(1);
       await waitFor(() => expect(screen.queryByRole('dialog')).not.toBeInTheDocument());
     });
 
     it('should close the confirmation dialog when clicking the cancel button', async () => {
       await render();
 
-      const deleteButton = screen.getByRole('button', { name: textMock('app_deploy_messages.btn_deploy_new_version') });
+      const deleteButton = screen.getByRole('button', {
+        name: textMock('app_deploy_messages.btn_deploy_new_version'),
+      });
       await act(() => user.click(deleteButton));
 
       const cancelButton = screen.getByRole('button', { name: textMock('general.cancel') });
       await act(() => user.click(cancelButton));
 
-      expect(startDeployMock).toBeCalledTimes(0);
+      expect(startDeployMock).toHaveBeenCalledTimes(0);
       await waitFor(() => expect(screen.queryByRole('dialog')).not.toBeInTheDocument());
     });
 
     it('should close when clicking outside the popover', async () => {
       await render();
 
-      const deleteButton = screen.getByRole('button', { name: textMock('app_deploy_messages.btn_deploy_new_version') });
+      const deleteButton = screen.getByRole('button', {
+        name: textMock('app_deploy_messages.btn_deploy_new_version'),
+      });
       await act(() => user.click(deleteButton));
 
       await act(() => user.click(document.body));
 
-      expect(startDeployMock).toBeCalledTimes(0);
+      expect(startDeployMock).toHaveBeenCalledTimes(0);
       await waitFor(() => expect(screen.queryByRole('dialog')).not.toBeInTheDocument());
     });
   });
@@ -83,7 +93,7 @@ const render = async (props: Partial<DeployDropdownProps> = {}) => {
     setSelectedImageTag: jest.fn(),
     selectedImageTag: '',
     startDeploy: startDeployMock,
-    ...props
+    ...props,
   };
 
   return rtlRender(<DeployDropdown {...allProps} />);

frontend/app-development/features/dataModelling/DataModelling.test.tsx

@@ -35,22 +35,12 @@ const org = 'org';
 const app = 'app';
 const user = userEvent.setup();
 
-// Mocks:
-const getDatamodel = jest.fn().mockImplementation(() => Promise.resolve({}));
-const getDatamodelsJson = jest.fn().mockImplementation(() => Promise.resolve([]));
-const getDatamodelsXsd = jest.fn().mockImplementation(() => Promise.resolve([]));
-const generateModels = jest.fn().mockImplementation(() => Promise.resolve());
-
 const render = (
   queries: Partial<ServicesContextProps> = {},
   queryClient: QueryClient = createQueryClientMock(),
 ) => {
   const allQueries: ServicesContextProps = {
     ...queriesMock,
-    getDatamodel,
-    getDatamodelsJson,
-    getDatamodelsXsd,
-    generateModels,
     ...queries,
   };
 
@@ -66,8 +56,8 @@ describe('DataModelling', () => {
 
   it('fetches models on mount', () => {
     render();
-    expect(getDatamodelsJson).toHaveBeenCalledTimes(1);
-    expect(getDatamodelsXsd).toHaveBeenCalledTimes(1);
+    expect(queriesMock.getDatamodelsJson).toHaveBeenCalledTimes(1);
+    expect(queriesMock.getDatamodelsXsd).toHaveBeenCalledTimes(1);
   });
 
   it('shows start dialog when no models are present and intro page is closed', () => {
@@ -90,8 +80,10 @@ describe('DataModelling', () => {
   });
 
   it('does not show start dialog when there are models present', async () => {
-    getDatamodelsJson.mockImplementation(() => Promise.resolve([jsonMetadata1Mock]));
-    render();
+    const getDatamodelsJson = jest
+      .fn()
+      .mockImplementation(() => Promise.resolve([jsonMetadata1Mock]));
+    render({ getDatamodelsJson });
     await waitForElementToBeRemoved(() => screen.queryByTitle(textMock('general.loading')));
     expect(
       screen.queryByRole('heading', { name: textMock('app_data_modelling.landing_dialog_header') }),
@@ -100,14 +92,19 @@ describe('DataModelling', () => {
 
   it('shows schema errors panel first when "generate model" button is clicked and returns errors', async () => {
     const queryClient = createQueryClientMock();
-    generateModels.mockImplementation(() =>
-      Promise.reject(
-        createApiErrorMock(400, 'DM_01', ['custom error message', 'another custom error message']),
-      ),
-    );
+    const generateModels = jest
+      .fn()
+      .mockImplementation(() =>
+        Promise.reject(
+          createApiErrorMock(400, 'DM_01', [
+            'custom error message',
+            'another custom error message',
+          ]),
+        ),
+      );
     queryClient.setQueryData([QueryKey.DatamodelsJson, org, app], [jsonMetadata1Mock]);
     queryClient.setQueryData([QueryKey.DatamodelsXsd, org, app], []);
-    render({}, queryClient);
+    render({ generateModels }, queryClient);
     const errorsPanel = screen.queryByText(textMock('api_errors.DM_01'));
     expect(errorsPanel).not.toBeInTheDocument();
 
@@ -121,14 +118,19 @@ describe('DataModelling', () => {
 
   it('closes schemaErrorsPanel when "close" button is clicked', async () => {
     const queryClient = createQueryClientMock();
-    generateModels.mockImplementation(() =>
-      Promise.reject(
-        createApiErrorMock(400, 'DM_01', ['custom error message', 'another custom error message']),
-      ),
-    );
+    const generateModels = jest
+      .fn()
+      .mockImplementation(() =>
+        Promise.reject(
+          createApiErrorMock(400, 'DM_01', [
+            'custom error message',
+            'another custom error message',
+          ]),
+        ),
+      );
     queryClient.setQueryData([QueryKey.DatamodelsJson, org, app], [jsonMetadata1Mock]);
     queryClient.setQueryData([QueryKey.DatamodelsXsd, org, app], []);
-    render({}, queryClient);
+    render({ generateModels }, queryClient);
 
     const generateModelButton = screen.getByRole('button', {
       name: textMock('schema_editor.generate_model_files'),

frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/LandingPagePanel.test.tsx

@@ -17,20 +17,30 @@ describe('LandingPagePanel', () => {
   it('renders component', async () => {
     render();
 
-    expect(screen.getByRole('heading', { name: textMock('app_data_modelling.landing_dialog_header') })).toBeInTheDocument();
-    expect(screen.getByText(textMock('app_data_modelling.landing_dialog_paragraph'))).toBeInTheDocument();
+    expect(
+      screen.getByRole('heading', { name: textMock('app_data_modelling.landing_dialog_header') }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(textMock('app_data_modelling.landing_dialog_paragraph')),
+    ).toBeInTheDocument();
     expect(screen.getByTestId(testids.fileSelectorInput)).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: textMock('app_data_modelling.landing_dialog_upload') })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: textMock('app_data_modelling.landing_dialog_create') })).toBeInTheDocument();
+    expect(
+      screen.getByRole('button', { name: textMock('app_data_modelling.landing_dialog_upload') }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole('button', { name: textMock('app_data_modelling.landing_dialog_create') }),
+    ).toBeInTheDocument();
   });
 
   it('opens create dialog when clicking create button', async () => {
     render();
 
-    const button = screen.getByRole('button', { name: textMock('app_data_modelling.landing_dialog_create') });
+    const button = screen.getByRole('button', {
+      name: textMock('app_data_modelling.landing_dialog_create'),
+    });
     await act(() => user.click(button));
 
-    expect(landingPagePropsMock.openCreateNew).toBeCalledTimes(1);
+    expect(landingPagePropsMock.openCreateNew).toHaveBeenCalledTimes(1);
   });
 });
 

frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/SelectedSchemaEditor.test.tsx

@@ -36,8 +36,7 @@ jest.useFakeTimers({ advanceTimers: true });
 
 describe('SelectedSchemaEditor', () => {
   it('Displays loading spinner while loading', () => {
-    const getDatamodel = jest.fn().mockImplementation(() => Promise.resolve({}));
-    render({ getDatamodel });
+    render();
     expect(screen.getByTitle(textMock('general.loading'))).toBeInTheDocument();
   });
 
@@ -50,8 +49,7 @@ describe('SelectedSchemaEditor', () => {
   });
 
   it('Renders SchemaEditorApp when finished loading', async () => {
-    const getDatamodel = jest.fn().mockImplementation(() => Promise.resolve({}));
-    render({ getDatamodel });
+    render();
     await waitForElementToBeRemoved(() => screen.queryByTitle(textMock('general.loading')));
     expect(screen.getByTestId(schemaEditorTestId)).toBeInTheDocument();
   });

frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/TopToolbar.test.tsx

@@ -12,6 +12,7 @@ import { convertMetadataToOption } from '../../../../utils/metadataUtils';
 import { buildJsonSchema } from '@altinn/schema-model';
 import { renderWithMockStore } from '../../../../test/mocks';
 import { useQueryClient } from '@tanstack/react-query';
+import { queriesMock } from 'app-shared/mocks/queriesMock';
 
 const user = userEvent.setup();
 
@@ -44,7 +45,6 @@ const defaultProps: TopToolbarProps = {
 };
 const org = 'org';
 const app = 'app';
-const generateModels = jest.fn().mockImplementation(() => Promise.resolve());
 const modelPath = jsonMetadata1Mock.repositoryRelativeUrl;
 
 const renderToolbar = (
@@ -60,10 +60,7 @@ const renderToolbar = (
     return <TopToolbar {...defaultProps} {...props} />;
   };
 
-  return renderWithMockStore(
-    {},
-    { generateModels, ...servicesContextProps },
-  )(<TopToolbarWithInitData />);
+  return renderWithMockStore({}, { ...servicesContextProps })(<TopToolbarWithInitData />);
 };
 
 // Mocks:
@@ -93,7 +90,7 @@ describe('TopToolbar', () => {
     const generateButton = screen.getByRole('button', { name: generateText });
     expect(generateButton).toBeDefined();
     await act(() => user.click(generateButton));
-    expect(generateModels).toHaveBeenCalledTimes(1);
+    expect(queriesMock.generateModels).toHaveBeenCalledTimes(1);
   });
 
   it('Does not show any error by default', () => {

frontend/app-development/features/overview/components/AppEnvironments.test.tsx

@@ -3,8 +3,8 @@ import { screen, waitForElementToBeRemoved } from '@testing-library/react';
 import { AppEnvironments } from './AppEnvironments';
 import { APP_DEVELOPMENT_BASENAME } from 'app-shared/constants';
 import { renderWithProviders } from '../../../test/testUtils';
-import { queriesMock } from 'app-development/test/mocks';
 import { textMock } from '../../../../testing/mocks/i18nMock';
+import { appDeployment, deployEnvironment } from 'app-shared/mocks/mocks';
 
 // Test data
 const org = 'org';
@@ -13,19 +13,13 @@ const app = 'app';
 const render = (queries = {}) => {
   return renderWithProviders(<AppEnvironments />, {
     startUrl: `${APP_DEVELOPMENT_BASENAME}/${org}/${app}`,
-    queries: {
-      ...queriesMock,
-      ...queries,
-    },
+    queries,
   });
 };
 
 describe('AppEnvironments', () => {
   it('shows loading spinner when loading required data', () => {
-    render({
-      getEnvironments: jest.fn().mockImplementation(() => Promise.resolve([])),
-      getOrgList: jest.fn().mockImplementation(() => Promise.resolve([])),
-    });
+    render();
 
     expect(screen.getByText(textMock('general.loading'))).toBeInTheDocument();
   });
@@ -42,10 +36,7 @@ describe('AppEnvironments', () => {
   });
 
   it('shows no environments message when organization has no environment', async () => {
-    render({
-      getEnvironments: jest.fn().mockImplementation(() => Promise.resolve([])),
-      getOrgList: jest.fn().mockImplementation(() => Promise.resolve({ orgs: [] })),
-    });
+    render();
 
     await waitForElementToBeRemoved(() => screen.queryByTitle(textMock('general.loading')));
 
@@ -58,26 +49,17 @@ describe('AppEnvironments', () => {
 
   it('shows statuses when organization has environments', async () => {
     const envName = 'tt02';
-    const envType = 'test';
     render({
       getDeployments: jest.fn().mockImplementation(() =>
         Promise.resolve({
           results: [
             {
-              tagName: '1',
+              ...appDeployment,
               envName,
-              deployedInEnv: false,
               build: {
-                id: '14381045',
-                status: 'completed',
-                result: 'succeeded',
-                started: '2023-10-03T09:57:31.238Z',
+                ...appDeployment.build,
                 finished: '2023-10-03T09:57:41.29Z',
               },
-              created: '2023-10-03T11:57:31.072013+02:00',
-              createdBy: 'test',
-              app,
-              org,
             },
           ],
         }),
@@ -86,13 +68,8 @@ describe('AppEnvironments', () => {
       getEnvironments: jest.fn().mockImplementation(() =>
         Promise.resolve([
           {
-            appsUrl: 'http://host.docker.internal:6161',
-            platformUrl: 'http://host.docker.internal:6161',
-            hostname: 'host.docker.internal:6161',
-            appPrefix: 'apps',
-            platformPrefix: 'platform',
+            ...deployEnvironment,
             name: envName,
-            type: envType,
           },
         ]),
       ),