Merge pull request #3104 from glific/fix/test-cases

Increasing test coverage
glific · Nov 8, 2024 · 5391389 · 5391389
2 parents 9632222 + 99d1572
commit 5391389
Show file tree

Hide file tree

Showing 38 changed files with 687 additions and 930 deletions.
diff --git a/.prettierrc b/.prettierrc
@@ -1,6 +1,6 @@
 {
   "semi": true,
-  "printWidth": 100,
+  "printWidth": 120,
   "singleQuote": true,
   "tabWidth": 2,
   "trailingComma": "es5",

diff --git a/src/containers/Auth/Auth.module.css b/src/containers/Auth/Auth.module.css
@@ -279,3 +279,15 @@
 .Spacing {
   margin: 15px 0px;
 }
+
+.TermsOfUse a {
+  color: #93a29b !important;
+  font-size: 14px !important;
+  font-weight: 400 !important;
+  text-decoration: underline !important;
+}
+
+.TermsOfUse {
+  text-align: center;
+  padding-bottom: 20px;
+}
diff --git a/src/containers/Auth/Auth.tsx b/src/containers/Auth/Auth.tsx
@@ -6,14 +6,14 @@ import { useTranslation } from 'react-i18next';
 import { Captcha } from 'components/UI/Form/Captcha/Captcha';
 
 import WhatsAppIcon from 'assets/images/icons/Social/Whatsapp.svg?react';
-import { termsOfUse } from 'containers/Organization/Organization';
 import { Button } from 'components/UI/Form/Button/Button';
 import GlificLogo from 'assets/images/logo/Logo.svg';
 import styles from './Auth.module.css';
 import axios from 'axios';
 import { ORGANIZATION_NAME } from 'config';
 import setLogs from 'config/logs';
 import { checkOrgStatus } from 'services/AuthService';
+import { TERMS_OF_USE_LINK } from 'common/constants';
 
 // import { Promotion } from './Promotion/Promotion';
 
@@ -253,7 +253,13 @@ export const Auth = ({
 
         <div className={boxClass.join(' ')}>
           {formElements}
-          {isRegistration && termsOfUse}
+          {isRegistration && (
+            <div className={styles.TermsOfUse}>
+              <a href={TERMS_OF_USE_LINK} target="_blank" rel="noreferrer">
+                Read the applied terms of use
+              </a>
+            </div>
+          )}
         </div>
         {alternateText ? (
           <>

diff --git a/src/containers/Auth/ConfirmOTP/ConfirmOTP.test.tsx b/src/containers/Auth/ConfirmOTP/ConfirmOTP.test.tsx
@@ -1,5 +1,5 @@
 import { render, screen, waitFor } from '@testing-library/react';
-import UserEvent from '@testing-library/user-event';
+import userEvent from '@testing-library/user-event';
 import { MemoryRouter } from 'react-router-dom';
 import { vi } from 'vitest';
 import axios from 'axios';
@@ -10,6 +10,7 @@ import { ConfirmOTP } from './ConfirmOTP';
 
 vi.mock('axios');
 const mockedAxios = axios as any;
+const user = userEvent.setup();
 
 const mockedState = {
   state: {
@@ -63,11 +64,11 @@ describe('<ConfirmOTP />', () => {
     await waitFor(() => {
       // enter the otp
       const input = screen.getByRole('textbox');
-      UserEvent.type(input, '12345');
+      user.type(input, '12345');
 
       // click on continue
       const continueButton = screen.getByText('Continue');
-      UserEvent.click(continueButton);
+      user.click(continueButton);
     });
 
     await waitFor(() => {});
@@ -82,11 +83,11 @@ describe('<ConfirmOTP />', () => {
     await waitFor(() => {
       // enter the otp
       const input = screen.getByRole('textbox');
-      UserEvent.type(input, '12345');
+      user.type(input, '12345');
 
       // click on continue
       const continueButton = screen.getByText('Continue');
-      UserEvent.click(continueButton);
+      user.click(continueButton);
     });
 
     await waitFor(() => {});
@@ -102,7 +103,7 @@ describe('<ConfirmOTP />', () => {
 
     await waitFor(() => {
       const resendButton = screen.getByTestId('resendOtp');
-      UserEvent.click(resendButton);
+      user.click(resendButton);
     });
     // click on resend button
 
@@ -119,7 +120,7 @@ describe('<ConfirmOTP />', () => {
     await waitFor(() => {
       // click on resend button
       const resendButton = screen.getByTestId('resendOtp');
-      UserEvent.click(resendButton);
+      user.click(resendButton);
     });
 
     await waitFor(() => {});

diff --git a/src/containers/Auth/ResetPassword/ResetPasswordPhone.test.tsx b/src/containers/Auth/ResetPassword/ResetPasswordPhone.test.tsx
@@ -1,5 +1,5 @@
 import { render, screen, fireEvent, waitFor } from '@testing-library/react';
-import UserEvent from '@testing-library/user-event';
+import userEvent from '@testing-library/user-event';
 import { MemoryRouter, Route, Routes } from 'react-router';
 import axios from 'axios';
 import { vi } from 'vitest';
@@ -8,6 +8,7 @@ import { ResetPasswordPhone } from './ResetPasswordPhone';
 
 vi.mock('axios');
 const mockedAxios = axios as any;
+const user = userEvent.setup();
 
 export const postRequestMock = () => {
   const responseData = { data: { data: {} } };
@@ -56,7 +57,7 @@ describe('<ResetPasswordPhone />', () => {
 
     // click on GENERATE button
     const continueButton = screen.getByText('Generate OTP to confirm');
-    UserEvent.click(continueButton);
+    user.click(continueButton);
 
     await waitFor(() => {
       expect(screen.getByTestId('AuthContainer')).toHaveTextContent(
@@ -87,7 +88,7 @@ describe('<ResetPasswordPhone />', () => {
       expect(screen.getByText('Generate OTP to confirm')).toBeInTheDocument();
     });
     const continueButton = screen.getByText('Generate OTP to confirm');
-    await UserEvent.click(continueButton);
+    await user.click(continueButton);
 
     await waitFor(() => {
       expect(screen.getByText('Confirm OTP')).toBeInTheDocument();

diff --git a/src/containers/Chat/ChatMessages/ChatInput/ChatInput.tsx b/src/containers/Chat/ChatMessages/ChatInput/ChatInput.tsx
@@ -496,6 +496,7 @@ export const ChatInput = ({
           {selectedTemplate || Object.keys(interactiveMessageContent).length > 0 ? (
             <Tooltip title={t('Remove message')} placement="top">
               <IconButton
+                data-testid="removeMessage"
                 className={updatedEditorState ? styles.CrossIcon : styles.CrossIconWithVariable}
                 onClick={handleCancel}
               >

diff --git a/src/containers/Chat/ChatMessages/ChatMessage/ChatMessage.test.tsx b/src/containers/Chat/ChatMessages/ChatMessage/ChatMessage.test.tsx
@@ -24,7 +24,7 @@ vi.mock('react-player', () => {
 HTMLAnchorElement.prototype.click = vi.fn();
 
 const insertedAt = '2020-06-19T18:44:02Z';
-const getProps: any = (type: any) => {
+const getProps: any = (additionalProps: any) => {
   return {
     id: 1,
     body: '*Hello there!* visit https://www.google.com',
@@ -39,7 +39,6 @@ const getProps: any = (type: any) => {
     popup: 1,
     open: true,
     insertedAt,
-    type,
     media: { url: 'http://glific.com' },
     errors: '{}',
     contextMessage: {
@@ -63,6 +62,7 @@ const getProps: any = (type: any) => {
     focus: true,
     interactiveContent: '{}',
     sendBy: 'test',
+    ...additionalProps,
   };
 };
 
@@ -71,7 +71,7 @@ window.HTMLElement.prototype.scrollIntoView = vi.fn();
 describe('<ChatMessage />', () => {
   const chatMessage = (type: any) => (
     <MockedProvider mocks={[]} addTypename={false}>
-      <ChatMessage {...getProps(type)} />
+      <ChatMessage {...getProps({ type })} />
     </MockedProvider>
   );
 
@@ -187,7 +187,7 @@ describe('<ChatMessage />', () => {
     });
   });
 
-  const props = getProps('TEXT');
+  const props = getProps({ type: 'TEXT' });
   test('it should render error with payload', async () => {
     props.errors = '{"payload": {"payload": {"reason": "Something went wrong"}}} ';
     render(
@@ -200,7 +200,7 @@ describe('<ChatMessage />', () => {
     expect(errors).toBeInTheDocument();
   });
 
-  const imageProps = getProps('DOCUMENT');
+  const imageProps = getProps({ type: 'DOCUMENT' });
   test('it should render error with message', () => {
     imageProps.media = {
       url: 'https://file-examples-com.github.io/uploads/2017/10/file-sample_150kB.pdf',
@@ -350,4 +350,24 @@ describe('<ChatMessage />', () => {
       </MockedProvider>
     );
   });
+
+  test('should render location request template', async () => {
+    render(
+      <MockedProvider addTypename={false}>
+        <ChatMessage
+          {...getProps({
+            type: 'LOCATION_REQUEST_MESSAGE',
+            interactiveContent:
+              '{"type":"location_request_message","body":{"type":"text","text":"please share your location"},"action":{"name":"send_location"}}',
+            body: 'please share your location',
+            entityId: '2',
+          })}
+        />
+      </MockedProvider>
+    );
+
+    await waitFor(() => {
+      expect(screen.getByTestId('locationTemplate')).toBeInTheDocument();
+    });
+  });
 });
diff --git a/...tainers/Chat/ChatMessages/ChatMessage/LocationRequestTemplate/LocationRequestTemplate.tsx b/...tainers/Chat/ChatMessages/ChatMessage/LocationRequestTemplate/LocationRequestTemplate.tsx
@@ -22,7 +22,7 @@ export const LocationRequestTemplate = ({
   const body = content.body.text;
   const locationPayload = SAMPLE_MEDIA_FOR_SIMULATOR[5].payload;
   return (
-    <div>
+    <div data-testid="locationTemplate">
       <div className={styles.MessageContent}>
         <ChatMessageType type="TEXT" body={body} isSimulatedMessage={isSimulator} />
       </div>