@argusoft/medplat-app-shell 1.0.6 → 1.0.7

package/src/_tests_/views/components/ForgotPassword/ForgotPassword.test.jsx

@@ -0,0 +1,314 @@
+import React from 'react';
+import { act, cleanup, fireEvent, render, screen, waitFor, within } from '@testing-library/react';
+import ForgotPassword from '@/views/feature-components/ForgotPassword/ForgotPassword';
+import { showToast } from '@/common/toaster/toaster';
+import { forgotPasswordGenerateOTP, forgotPasswordVerifyOTP } from '@/common/services/ForgotPassword';
+
+jest.useFakeTimers();
+jest.mock('../../../../assets/img/medplat-highres.png', () => 'test-image-path');
+
+jest.mock('../../../../common/toaster/toaster', () => ({
+  showToast: jest.fn(),
+}));
+
+jest.mock('../../../../common/services/ForgotPassword.js', () => ({
+  forgotPasswordGenerateOTP: jest.fn(),
+  forgotPasswordVerifyOTP: jest.fn(),
+}));
+
+describe('ForgotPassword Component', () => {
+  let unmountComponent;
+  const renderComponent = async () => {
+    await act(async () => {
+      const renderResult = render(<ForgotPassword />);
+      unmountComponent = renderResult.unmount;
+    });
+  };
+
+  beforeEach(async () => {
+    await renderComponent();
+    jest.clearAllMocks();
+    forgotPasswordGenerateOTP.mockImplementation(() => Promise.resolve({ status: 200, data: '******2209' }));
+    forgotPasswordVerifyOTP.mockImplementation(() => Promise.resolve({ status: 200 }));
+  });
+
+  afterEach(() => {
+    cleanup();
+  });
+
+  it('should render the ForgotPassword form', () => {
+    const otpButton = screen.getByTestId('forgot-password-get-otp-button');
+    expect(otpButton).toBeInTheDocument();
+    expect(otpButton).toHaveTextContent('Get OTP');
+
+    const usernameTextField = screen.getByTestId('forgot-password-username-textfield');
+    expect(usernameTextField).toBeInTheDocument();
+
+    const usernameInput = within(usernameTextField).getByRole('textbox');
+    expect(usernameInput).toHaveAttribute('name', 'username');
+
+    const heading = screen.getByText(/Forgot Password/i);
+    expect(heading).toBeInTheDocument();
+
+    expect(screen.getByTestId('forgot-pssword-form')).toBeInTheDocument();
+    expect(screen.getByTestId('login-logo')).toBeInTheDocument();
+  });
+
+  it('should call invalid username toast and render username required', async () => {
+    forgotPasswordGenerateOTP.mockRejectedValue({
+      response: {
+        data: {
+          message: 'Invalid Username',
+        },
+      },
+    });
+    const otpButton = screen.getByTestId('forgot-password-get-otp-button');
+    fireEvent.click(otpButton);
+
+    await waitFor(() => {
+      expect(screen.getByText('Username is required')).toBeInTheDocument();
+    });
+
+    const usernameTextField = screen.getByTestId('forgot-password-username-textfield');
+    expect(usernameTextField).toBeInTheDocument();
+
+    const usernameInput = within(usernameTextField).getByRole('textbox');
+    fireEvent.change(usernameInput, { target: { value: 'test123' } });
+
+    await act(async () => {
+      fireEvent.click(otpButton);
+    });
+
+    await waitFor(() => {
+      expect(showToast).toHaveBeenCalledWith({
+        message: 'Invalid Username',
+        type: 'error',
+      });
+    });
+  });
+
+  it('should call generateOTP function', async () => {
+    const otpButton = screen.getByTestId('forgot-password-get-otp-button');
+    const usernameTextField = screen.getByTestId('forgot-password-username-textfield');
+    const usernameInput = within(usernameTextField).getByRole('textbox');
+
+    await act(async () => {
+      fireEvent.change(usernameInput, { target: { value: 'ajvasava2' } });
+    });
+
+    await act(async () => {
+      fireEvent.click(otpButton);
+    });
+
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    await waitFor(() => {
+      expect(forgotPasswordGenerateOTP).toHaveBeenCalledWith({
+        username: 'ajvasava2',
+      });
+    });
+  });
+
+  it('should toast retry after 30 sec for second time', async () => {
+    const otpButton = screen.getByTestId('forgot-password-get-otp-button');
+    const usernameTextField = screen.getByTestId('forgot-password-username-textfield');
+    const usernameInput = within(usernameTextField).getByRole('textbox');
+
+    await act(async () => {
+      fireEvent.change(usernameInput, { target: { value: 'ajvasava2' } });
+    });
+
+    await act(async () => {
+      fireEvent.click(otpButton);
+    });
+
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    await waitFor(() => {
+      expect(forgotPasswordGenerateOTP).toHaveBeenCalledWith({
+        username: 'ajvasava2',
+      });
+    });
+
+    unmountComponent();
+    render(<ForgotPassword />);
+
+    forgotPasswordGenerateOTP.mockRejectedValue({
+      response: {
+        data: {
+          message: 'Try after 30 Seconds',
+        },
+      },
+    });
+
+    const otpButton1 = screen.getByTestId('forgot-password-get-otp-button');
+    const usernameInput1 = within(screen.getByTestId('forgot-password-username-textfield')).getByRole('textbox');
+
+    await act(async () => {
+      fireEvent.change(usernameInput1, { target: { value: 'ajvasava2' } });
+    });
+
+    await act(async () => {
+      fireEvent.click(otpButton1);
+    });
+
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    await waitFor(() => {
+      expect(forgotPasswordGenerateOTP).toHaveBeenCalledWith({
+        username: 'ajvasava2',
+      });
+      expect(showToast).toHaveBeenCalledWith({
+        message: 'Try after 30 Seconds',
+        type: 'error',
+      });
+    });
+  });
+
+  it('should call generateOTP function and change button text to Submit', async () => {
+    const otpButton = screen.getByTestId('forgot-password-get-otp-button');
+    expect(otpButton).toBeInTheDocument();
+
+    const usernameTextField = screen.getByTestId('forgot-password-username-textfield');
+    expect(usernameTextField).toBeInTheDocument();
+
+    const usernameInput = within(usernameTextField).getByRole('textbox');
+    await act(async () => {
+      fireEvent.change(usernameInput, { target: { value: 'ajvasava2' } });
+    });
+
+    await act(async () => {
+      fireEvent.click(otpButton);
+    });
+
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    await waitFor(() => {
+      expect(forgotPasswordGenerateOTP).toHaveBeenCalledWith({
+        username: 'ajvasava2',
+      });
+    });
+
+    const getSumbitButton = screen.getByTestId('forgot-password-verify-otp-button');
+    expect(screen.getByText(/Please enter OTP received on Mobile Number/)).toBeInTheDocument();
+
+    const userEle = within(screen.getByTestId('forgot-password-username-textfield')).getByRole('textbox');
+    expect(userEle).toHaveValue('ajvasava2');
+
+    const otpEle = within(screen.getByTestId('forgot-password-otp-textfield')).getByRole('textbox');
+    expect(otpEle).toHaveAttribute('placeholder', 'Enter OTP');
+
+    expect(screen.getByText(/Resend OTP in \d+ seconds/)).toBeInTheDocument();
+    expect(getSumbitButton).toHaveTextContent('Submit');
+
+    await act(async () => {
+      fireEvent.click(getSumbitButton);
+    });
+    //Checking for the wrong otp
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    let errorEle = screen.getByTestId('custom-error-message');
+    expect(errorEle).toHaveTextContent('OTP is required');
+
+    for (let i = 1; i <= 3; i++) {
+      await act(async () => {
+        fireEvent.change(otpEle, { target: { value: '1'.repeat(i) } });
+      });
+      await waitFor(() => {
+        errorEle = screen.getByTestId('custom-error-message');
+        expect(errorEle).toHaveTextContent('OTP should be of 4 digits');
+      });
+    }
+
+    await act(async () => {
+      fireEvent.change(otpEle, { target: { value: '1234' } });
+    });
+
+    await waitFor(() => {
+      expect(screen.queryByTestId('custom-error-message')).not.toBeInTheDocument();
+    });
+
+    await act(async () => {
+      fireEvent.click(screen.getByTestId('forgot-password-verify-otp-button'));
+    });
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    await waitFor(async () => {
+      expect(forgotPasswordGenerateOTP).toHaveBeenCalledTimes(1);
+      expect(forgotPasswordVerifyOTP).toHaveBeenCalledTimes(2);
+    });
+  });
+
+  it('should render error and also call verify otp', async () => {
+    const otpButton = screen.getByTestId('forgot-password-get-otp-button');
+    const usernameTextField = screen.getByTestId('forgot-password-username-textfield');
+    const usernameInput = within(usernameTextField).getByRole('textbox');
+
+    await act(async () => {
+      fireEvent.change(usernameInput, { target: { value: 'ajvasava2' } });
+      fireEvent.click(otpButton);
+    });
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    await waitFor(() => {
+      expect(forgotPasswordGenerateOTP).toHaveBeenCalledWith({ username: 'ajvasava2' });
+    });
+
+    const otpField = within(screen.getByTestId('forgot-password-otp-textfield')).getByRole('textbox');
+    const submitButton = screen.getByTestId('forgot-password-verify-otp-button');
+
+    await act(async () => {
+      fireEvent.click(submitButton);
+    });
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    let errorEle = screen.getByTestId('custom-error-message');
+    expect(errorEle).toHaveTextContent('OTP is required');
+
+    for (let i = 1; i <= 3; i++) {
+      await act(async () => {
+        fireEvent.change(otpField, { target: { value: '1'.repeat(i) } });
+      });
+      await waitFor(() => {
+        errorEle = screen.getByTestId('custom-error-message');
+        expect(errorEle).toHaveTextContent('OTP should be of 4 digits');
+      });
+    }
+
+    await act(async () => {
+      fireEvent.change(otpField, { target: { value: '1234' } });
+    });
+
+    await waitFor(() => {
+      expect(screen.queryByTestId('custom-error-message')).not.toBeInTheDocument();
+    });
+
+    await act(async () => {
+      fireEvent.click(screen.getByTestId('forgot-password-verify-otp-button'));
+    });
+    await act(async () => {
+      fireEvent.submit(screen.getByTestId('forgot-pssword-form'));
+    });
+
+    await waitFor(async () => {
+      expect(forgotPasswordGenerateOTP).toHaveBeenCalledTimes(1);
+      expect(forgotPasswordVerifyOTP).toHaveBeenCalledTimes(2);
+    });
+  });
+});

package/src/_tests_/views/components/LocationDirective/LocationDirective.test.jsx.disable

@@ -0,0 +1,229 @@
+import React from 'react';
+import { act, cleanup, render, screen, fireEvent } from '@testing-library/react';
+import LocationDirective from '@/views/feature-components/LocationDirective/LocationDirective';
+import { retriveLocationType } from '@/common/services/LocationType';
+import { getParent, retrieveNextLevel } from '@/common/services/LocationService';
+import { useSelector } from 'react-redux';
+import { authenticatedUser, mockLocations, mockLocationTypes } from './mockLocationDirective';
+
+jest.mock('@/common/languageTranslator/TranslationContext', () => ({
+  useTranslateProvider: () => ({
+    translate: (key) => key,
+  }),
+}));
+
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn(),
+}));
+
+jest.mock('@/common/services/LocationType', () => ({
+  retriveLocationType: jest.fn(),
+}));
+
+jest.mock('@/common/services/LocationService', () => ({
+  retrieveNextLevel: jest.fn(),
+  getParent: jest.fn(),
+}));
+
+describe('LocationDirective Component', () => {
+  const mockSelectedLocationRef = { current: {} };
+  const mockSelectedIdRef = { current: null };
+  const mockSetSelectedLocation = jest.fn();
+  const mockSetSelectedId = jest.fn();
+
+  beforeEach(async () => {
+    cleanup();
+
+    retriveLocationType.mockResolvedValue({ data: mockLocationTypes });
+
+    retrieveNextLevel.mockImplementation((locationIds, level) => {
+      // Initial state level
+      if (!locationIds || locationIds.length === 0) {
+        return Promise.resolve([
+          {
+            level: 1,
+            locationLabel: 'State',
+            locationDetails: mockLocations.level1,
+          },
+        ]);
+      }
+
+      if (locationIds.includes(2) && level === 2) {
+        return Promise.resolve([
+          {
+            level: 2,
+            locationLabel: 'Region',
+            locationDetails: mockLocations.level2,
+          },
+        ]);
+      }
+
+      if (level === 3) {
+        return Promise.resolve([
+          {
+            level: 3,
+            locationLabel: 'District/Corporation',
+            locationDetails: mockLocations.level3,
+          },
+        ]);
+      }
+
+      if (level === 4) {
+        return Promise.resolve([
+          {
+            level: 4,
+            locationLabel: 'Block',
+            locationDetails: mockLocations.level4,
+          },
+        ]);
+      }
+
+      if (level === 5) {
+        return Promise.resolve([
+          {
+            level: 5,
+            locationLabel: 'PHC/UPHC',
+            locationDetails: mockLocations.level5,
+          },
+        ]);
+      }
+
+      if (level === 6) {
+        return Promise.resolve([
+          {
+            level: 6,
+            locationLabel: 'ANM Area',
+            locationDetails: mockLocations.level6,
+          },
+        ]);
+      }
+      if (level === 7) {
+        return Promise.resolve([
+          {
+            level: 7,
+            locationLabel: 'Anganwadi Area',
+            locationDetails: mockLocations.level7,
+          },
+        ]);
+      }
+      if (level === 8) {
+        return Promise.resolve([
+          {
+            level: 8,
+            locationLabel: 'Asha Area',
+            locationDetails: mockLocations.level8,
+          },
+        ]);
+      }
+
+      return Promise.resolve([]);
+    });
+
+    useSelector.mockImplementation((selector) => selector(authenticatedUser));
+    await act(async () => {
+      render(
+        <LocationDirective
+          selectedLocationRef={mockSelectedLocationRef}
+          selectedIdRef={mockSelectedIdRef}
+          setSelectedLocation={mockSetSelectedLocation}
+          setSelectedId={mockSetSelectedId}
+          templateType="inline"
+        />
+      );
+    });
+  });
+
+  it('should render correctly', async () => {
+    const stateLabel = screen.getByTestId('locationdirective-inline-location-label-0');
+    expect(stateLabel).toHaveTextContent('State');
+    const stateInput = screen.getByTestId('locationdirective-inline-dropdown-1').querySelector('input');
+    expect(stateInput).toBeInTheDocument();
+    expect(stateInput).toHaveValue('Gujarat');
+
+    const regionLabel = screen.getByTestId('locationdirective-inline-location-label-1');
+    expect(regionLabel).toHaveTextContent('Region');
+    const regionInput = screen.getByTestId('locationdirective-inline-dropdown-2').querySelector('input');
+    expect(regionInput).toBeInTheDocument();
+    fireEvent.mouseDown(regionInput);
+    const regionOption = screen.getByTestId('locationdirective-inline-dropdown-2-option-550513');
+    await act(async () => {
+      fireEvent.click(regionOption);
+    });
+    expect(regionInput).toHaveValue('ગાંધીનગર ઝોન');
+
+    getParent.mockResolvedValue({
+      data: {
+        id: 550513,
+        name: 'ગાંધીનગર ઝોન',
+        type: 'R',
+        locType: 'Region',
+      },
+    });
+
+    const districtLabel = screen.getByTestId('locationdirective-inline-location-label-2');
+    expect(districtLabel).toHaveTextContent('District/Corporation');
+    const districtInput = screen.getByTestId('locationdirective-inline-dropdown-3').querySelector('input');
+    expect(districtInput).toBeInTheDocument();
+    fireEvent.mouseDown(districtInput);
+    const districtOption = screen.getByTestId('locationdirective-inline-dropdown-3-option-161926');
+    await act(async () => {
+      fireEvent.click(districtOption);
+    });
+    expect(districtInput).toHaveValue('બનાસકાંઠા');
+
+    const blockLabel = screen.getByTestId('locationdirective-inline-location-label-3');
+    expect(blockLabel).toHaveTextContent('Block');
+    const blockInput = screen.getByTestId('locationdirective-inline-dropdown-4').querySelector('input');
+    expect(blockInput).toBeInTheDocument();
+    fireEvent.mouseDown(blockInput);
+    const blockOption = screen.getByTestId('locationdirective-inline-dropdown-4-option-163434');
+    await act(async () => {
+      fireEvent.click(blockOption);
+    });
+    expect(blockInput).toHaveValue('પાલનપુર');
+
+    const uphcLabel = screen.getByTestId('locationdirective-inline-location-label-4');
+    expect(uphcLabel).toHaveTextContent('PHC/UPHC');
+    const uphcInput = screen.getByTestId('locationdirective-inline-dropdown-5').querySelector('input');
+    expect(uphcInput).toBeInTheDocument();
+    fireEvent.mouseDown(uphcInput);
+    const uphcOption = screen.getByTestId('locationdirective-inline-dropdown-5-option-453439');
+    await act(async () => {
+      fireEvent.click(uphcOption);
+    });
+    expect(uphcInput).toHaveValue('યુપીએચસી પાલનપુર-૧');
+
+    const anmAreaLabel = screen.getByTestId('locationdirective-inline-location-label-5');
+    expect(anmAreaLabel).toHaveTextContent('ANM Area');
+    const anmAreaInput = screen.getByTestId('locationdirective-inline-dropdown-6').querySelector('input');
+    expect(anmAreaInput).toBeInTheDocument();
+    fireEvent.mouseDown(anmAreaInput);
+    const anmAreaOption = screen.getByTestId('locationdirective-inline-dropdown-6-option-453860');
+    await act(async () => {
+      fireEvent.click(anmAreaOption);
+    });
+    expect(anmAreaInput).toHaveValue('આકેશણ હાઇવે');
+
+    const anganwadiAreaLabel = screen.getByTestId('locationdirective-inline-location-label-6');
+    expect(anganwadiAreaLabel).toHaveTextContent('Anganwadi Area');
+    const anganwadiAreaInput = screen.getByTestId('locationdirective-inline-dropdown-7').querySelector('input');
+    expect(anganwadiAreaInput).toBeInTheDocument();
+    fireEvent.mouseDown(anganwadiAreaInput);
+    const anganwadiAreaOption = screen.getByTestId('locationdirective-inline-dropdown-7-option-453869');
+    await act(async () => {
+      fireEvent.click(anganwadiAreaOption);
+    });
+    expect(anganwadiAreaInput).toHaveValue('૩૦-સ્રધ્ધા સોસાયટી');
+
+    const ashaAreaLabel = screen.getByTestId('locationdirective-inline-location-label-7');
+    expect(ashaAreaLabel).toHaveTextContent('Asha Area');
+    const ashaAreaInput = screen.getByTestId('locationdirective-inline-dropdown-8').querySelector('input');
+    expect(ashaAreaInput).toBeInTheDocument();
+    fireEvent.mouseDown(ashaAreaInput);
+    const ashaAreaOption = screen.getByTestId('locationdirective-inline-dropdown-8-option-453870');
+    await act(async () => {
+      fireEvent.click(ashaAreaOption);
+    });
+    expect(ashaAreaInput).toHaveValue('સ્રધ્ધા સોસાયટી');
+  });
+});