@argusoft/medplat-app-shell 1.0.6 → 1.0.8

package/src/_tests_/views/components/Profile/updateprofilemodal.test.jsx

@@ -0,0 +1,282 @@
+import React, { act } from 'react';
+import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
+import UpdateUserModal from '@/layout/mainLayout/Profile/UpdateProfileModal';
+import {
+  // checkBankAccountNumberExist,
+  getBankNamesForPBI,
+  getPreferredLanguage,
+  getUserDetails,
+  updateUser,
+} from '@/common/services/Users';
+import { getAssignedFeatures } from '@/utils/feature';
+import {
+  DemoActiveLanguage,
+  DemoBankData,
+  DemoUserData,
+  mockedLoggedInUserDetails,
+  mockedMenuItems,
+  mockedToken,
+} from '@/_tests_/views/components/Profile/UpdateProfileModalData';
+import { Provider, useSelector } from 'react-redux';
+import configureStore from 'redux-mock-store';
+import MockTranslationProvider from '@/_tests_/__mocks__/MockTranslationProvider';
+
+jest.mock('../../../../assets/img/medplat-highres.png', () => 'test-image-path');
+
+jest.mock('react-redux', () => ({
+  ...jest.requireActual('react-redux'),
+  useSelector: jest.fn(),
+}));
+
+jest.mock('../../../../common/services/Users', () => ({
+  checkBankAccountNumberExist: jest.fn(),
+  getBankNamesForPBI: jest.fn(),
+  getPreferredLanguage: jest.fn(),
+  getUserDetails: jest.fn(),
+  updateUser: jest.fn(),
+}));
+
+jest.mock('../../../../utils/feature', () => ({
+  getAssignedFeatures: jest.fn(),
+}));
+
+jest.mock('react-i18next', () => ({
+  useTranslation: () => ({
+    t: (key) => key,
+    i18n: { changeLanguage: () => new Promise(() => {}) },
+  }),
+}));
+
+const mockStore = configureStore([]);
+
+useSelector.mockImplementation((callback) => {
+  return callback({
+    Authenticate: {
+      token: mockedToken,
+      user: mockedLoggedInUserDetails, // This is the user data you're mocking
+    },
+  });
+});
+
+// Mocking the store that is passed from the parent component
+let store;
+store = mockStore({
+  Authenticate: {
+    token: mockedToken,
+    user: mockedLoggedInUserDetails,
+  },
+});
+
+describe('Update Profile Modal', () => {
+  beforeEach(async () => {
+    getUserDetails.mockResolvedValue(DemoUserData);
+    getPreferredLanguage.mockResolvedValue(DemoActiveLanguage);
+    getBankNamesForPBI.mockResolvedValue(DemoBankData);
+    getAssignedFeatures.mockResolvedValue({
+      data: JSON.stringify(mockedMenuItems), // Mocking a valid JSON string response
+    });
+  });
+
+  beforeEach(async () => {
+    // Mocking useSelector to return the local state
+    await act(async () => {
+      render(
+        <MockTranslationProvider>
+          <Provider store={store}>
+            <UpdateUserModal open={true} onClose={jest.fn()} />
+          </Provider>
+        </MockTranslationProvider>
+      );
+    });
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+    cleanup();
+  });
+
+  it('should render the Update Profile Modal', async () => {
+    const modal = await screen.findByTestId('updateprofilemodal-modal', {}, { timeout: 3000 });
+    expect(modal).toBeInTheDocument();
+
+    const grid = await screen.findByTestId('updateprofilemodal-grid', {}, { timeout: 3000 });
+    expect(grid).toBeInTheDocument();
+  });
+
+  it('should render the Update Profile Modal with the correct user data', async () => {
+    // const title = await screen.findByText(/Update User/, {}, { timeout: 3000 });
+    // expect(title).toBeInTheDocument();
+
+    const role = await screen.findByText(/Argus Admin/, {}, { timeout: 3000 });
+    expect(role).toBeInTheDocument();
+
+    const fullName = await screen.findByText(/Mikita Talati/, {}, { timeout: 3000 });
+    expect(fullName).toBeInTheDocument();
+
+    const userName = await screen.findByText(/mtalati/, {}, { timeout: 3000 });
+    expect(userName).toBeInTheDocument();
+
+    const gender = await screen.findByText(/male/, {}, { timeout: 3000 });
+    expect(gender).toBeInTheDocument();
+
+    // const preferredlanguage = await screen.findByTestId(
+    //   'updateprofilemodal-customdropdown-prefferedLanguage',
+    //   {},
+    //   { timeout: 3000 }
+    // );
+    // expect(preferredlanguage).toBeInTheDocument();
+
+    // const reportpreferredlanguage = await screen.findByTestId(
+    //   'updateprofilemodal-customdropdown-reportpreferredlanguage',
+    //   {},
+    //   { timeout: 3000 }
+    // );
+    // expect(reportpreferredlanguage).toBeInTheDocument();
+  });
+
+  it.skip('Button should working for preferred language', async () => {
+    const updateButton = await screen.findByTestId('updateprofilemodal-button-update', {}, { timeout: 3000 });
+    expect(updateButton).toBeInTheDocument();
+    const cancelButton = await screen.findByTestId('updateprofilemodal-button-cancel', {}, { timeout: 3000 });
+    expect(cancelButton).toBeInTheDocument();
+
+    const preferredLanguageSelect = await screen.findByTestId(
+      'updateprofilemodal-customdropdown-preferredlanguage',
+      {},
+      { timeout: 3000 }
+    );
+    fireEvent.click(preferredLanguageSelect);
+
+    const PreferredLanguage = screen.getAllByRole('combobox', { placeholder: /Select an options/i })[0];
+    fireEvent.mouseDown(PreferredLanguage);
+
+    const list = screen.getByRole('listbox');
+    expect(list).toBeInTheDocument();
+
+    const options = screen.getAllByRole('option');
+    expect(options).toHaveLength(DemoActiveLanguage.data.length);
+    const gujaratiOption = options.find(
+      (option) => option.getAttribute('data-testid') === 'updateprofilemodal-customdropdown-preferredlanguage-option-gu'
+    );
+    await act(async () => {
+      gujaratiOption.click();
+    });
+    await waitFor(() => {
+      const preferredLanguageInputValue = preferredLanguageSelect.querySelector('input').value;
+      expect(preferredLanguageInputValue).toBe('Gujarati');
+    });
+
+    fireEvent.click(updateButton);
+    await waitFor(() => {
+      expect(updateUser).toHaveBeenCalledWith({
+        id: 74724,
+        fullName: 'Mikita Talati',
+        userName: 'mtalati',
+        contactNumber: '1234567890',
+        firstName: 'Mikita',
+        middleName: '',
+        lastName: 'Talati',
+        gender: 'M',
+        prefferedLanguage: 'gu',
+        state: 'ACTIVE',
+        roleId: 96,
+        createdBy: 66522,
+        createdOn: 1570183317081,
+        roleName: 'Argus Admin',
+        addedLocations: [
+          {
+            id: 294441,
+            userId: 74724,
+            locationId: 2,
+            type: 'S',
+            name: 'Gujarat',
+            level: 1,
+            state: 'ACTIVE',
+            createdBy: 66522,
+            createdOn: 1570183317950,
+            locationFullName: 'Gujarat',
+          },
+        ],
+        title: 'Mr',
+        noOfAttempts: 0,
+        infrastructureIds: [],
+      });
+    });
+  });
+
+  it.skip('Button should working for Report preferred language', async () => {
+    const updateButton = await screen.findByTestId('updateprofilemodal-button-update', {}, { timeout: 3000 });
+    expect(updateButton).toBeInTheDocument();
+    const cancelButton = await screen.findByTestId('updateprofilemodal-button-cancel', {}, { timeout: 3000 });
+    expect(cancelButton).toBeInTheDocument();
+
+    const ReportPreferredLanguageSelect = await screen.findByTestId(
+      'updateprofilemodal-customdropdown-reportpreferredlanguage',
+      {},
+      { timeout: 3000 }
+    );
+    expect(ReportPreferredLanguageSelect).toBeInTheDocument();
+    fireEvent.click(ReportPreferredLanguageSelect);
+
+    const ReportPreferredLanguage = screen.getAllByRole('combobox', { placeholder: /Select an options/i })[1];
+    fireEvent.mouseDown(ReportPreferredLanguage);
+
+    const list = screen.getByRole('listbox');
+    expect(list).toBeInTheDocument();
+
+    const options = screen.getAllByRole('option');
+    const gujaratiOption = options.find(
+      (option) =>
+        option.getAttribute('data-testid') === 'updateprofilemodal-customdropdown-reportpreferredlanguage-option-gu'
+    );
+
+    await act(async () => {
+      gujaratiOption.click();
+    });
+
+    await waitFor(() => {
+      // You can check if the input's value matches the selected option now
+      const inputValue = ReportPreferredLanguage.value;
+
+      expect(inputValue).toBe('Gujarati'); // Ensure the input reflects the selection
+    });
+
+    fireEvent.click(updateButton);
+    await waitFor(() => {
+      expect(updateUser).toHaveBeenCalledWith({
+        id: 74724,
+        fullName: 'Mikita Talati',
+        userName: 'mtalati',
+        contactNumber: '1234567890',
+        firstName: 'Mikita',
+        middleName: '',
+        lastName: 'Talati',
+        gender: 'M',
+        prefferedLanguage: 'EN',
+        state: 'ACTIVE',
+        roleId: 96,
+        createdBy: 66522,
+        createdOn: 1570183317081,
+        roleName: 'Argus Admin',
+        addedLocations: [
+          {
+            id: 294441,
+            userId: 74724,
+            locationId: 2,
+            type: 'S',
+            name: 'Gujarat',
+            level: 1,
+            state: 'ACTIVE',
+            createdBy: 66522,
+            createdOn: 1570183317950,
+            locationFullName: 'Gujarat',
+          },
+        ],
+        title: 'Mr',
+        noOfAttempts: 0,
+        infrastructureIds: [],
+        reportPrefferedLanguage: 'gu',
+      });
+    });
+  });
+});