Merge pull request #2854 from glific/test-cases

Adding more test cases

src/containers/BlockContact/BlockContactList/BlockContact.test.helper.ts

@@ -71,6 +71,10 @@ const contactSearchQueryBlocked = {
             },
           ],
           status: 'BLOCKED',
+          optinTime: '2021-08-19T09:28:01Z',
+          optoutTime: null,
+          optinMethod: 'BSP',
+          optoutMethod: null,
         },
       ],
     },

src/containers/Chat/ChatSubscription/ChatSubscription.test.tsx

@@ -113,6 +113,7 @@ cache.writeQuery({
   data: {
     search: [
       {
+        id: 'group_2',
         group: {
           id: '2',
           label: 'Default Group',

src/containers/ErrorHandler/ErrorHandler.test.tsx

@@ -17,6 +17,14 @@ const resolvers = {
   },
 };
 
+const resolversWithNullError = {
+  Query: {
+    errorMessage: () => {
+      return '';
+    },
+  },
+};
+
 describe('<ErrorHandler />', () => {
   afterEach(cleanup);
 
@@ -79,3 +87,42 @@ test('it should render <ErrorHandler /> component with custom message', async ()
   //need to assert something here
   await waitFor(() => {});
 });
+
+test('it should render <ErrorHandler /> component with custom title', async () => {
+  const resolvers = {
+    Query: {
+      errorMessage: () => {
+        return {
+          title: 'Error Title',
+          message: [{ message: 'An error has occurred!' }],
+          type: 'Error',
+          networkError: 'Unable to fetch',
+          graphqlError: null,
+        };
+      },
+    },
+  };
+  render(
+    <MockedProvider resolvers={resolvers} addTypename={false}>
+      <ErrorHandler />
+    </MockedProvider>
+  );
+
+  await waitFor(() => {
+    expect(screen.queryByRole('dialog')).toBeInTheDocument();
+  });
+
+  expect(screen.getByTestId('dialogTitle')).toHaveTextContent('Error Title');
+});
+
+test('it should render <ErrorHandler /> component with no error message', async () => {
+  render(
+    <MockedProvider resolvers={resolversWithNullError} addTypename={false}>
+      <ErrorHandler />
+    </MockedProvider>
+  );
+
+  await waitFor(() => {
+    expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+  });
+});

src/containers/Form/FormLayout.tsx

@@ -491,6 +491,7 @@ export const FormLayout = ({
       <Button
         variant="contained"
         color="warning"
+        data-testid="remove-icon"
         className={styles.DeleteButton}
         onClick={() => setShowDialog(true)}
       >

src/containers/SettingList/SettingList.test.helper.ts

@@ -108,7 +108,7 @@ const updateOrganizationMock = {
           activeLanguages: [
             {
               id: '1',
-              label: 'English',
+              label: 'Engrlish',
             },
             {
               id: '2',

src/containers/SheetIntegration/SheetIntegrationList/SheetIntegrationList.test.tsx

@@ -1,15 +1,17 @@
-import { render, waitFor, fireEvent } from '@testing-library/react';
+import { render, waitFor, fireEvent, screen, cleanup } from '@testing-library/react';
 import { MockedProvider } from '@apollo/client/testing';
 import { MemoryRouter } from 'react-router';
 import { setUserSession } from 'services/AuthService';
 import { SheetIntegrationList } from './SheetIntegrationList';
+import * as Notification from 'common/notification';
 import {
   getSearchSheetQuery,
   getSheetQuery,
   deleteSheetQuery,
   createSheetQuery,
   getSheetCountQuery,
   syncSheetMutation,
+  syncSheetMutationWithWarnings,
 } from 'mocks/Sheet';
 
 const mocks = [
@@ -19,23 +21,30 @@ const mocks = [
   deleteSheetQuery,
   createSheetQuery,
   getSheetCountQuery,
-  syncSheetMutation,
+  getSheetCountQuery,
 ];
 
-const wrapper = (
-  <MemoryRouter>
-    <MockedProvider mocks={mocks} addTypename={false}>
-      <SheetIntegrationList />
-    </MockedProvider>
-  </MemoryRouter>
-);
+const wrapper = (mockQuery?: any) => {
+  if (mockQuery) {
+    mocks.push(mockQuery);
+  }
+
+  return (
+    <MemoryRouter>
+      <MockedProvider mocks={mocks} addTypename={false}>
+        <SheetIntegrationList />
+      </MockedProvider>
+    </MemoryRouter>
+  );
+};
 
 window.open = vi.fn();
+afterEach(() => cleanup());
 
 setUserSession(JSON.stringify({ roles: ['Admin'] }));
 describe('<SheetIntegrationList />', () => {
   test('Should render SheetIntegrationList', async () => {
-    const { getByText, getByTestId } = render(wrapper);
+    const { getByText, getByTestId } = render(wrapper());
 
     // loading is show initially
     expect(getByTestId('loading')).toBeInTheDocument();
@@ -45,7 +54,7 @@ describe('<SheetIntegrationList />', () => {
   });
 
   test('should search sheet and check if sheet keywords are present below the name', async () => {
-    const { getByTestId, queryByPlaceholderText, getByText } = render(wrapper);
+    const { getByTestId, queryByPlaceholderText, getByText } = render(wrapper());
     await waitFor(() => {
       expect(getByTestId('searchInput')).toBeInTheDocument();
       const searchInput = queryByPlaceholderText('Search') as HTMLInputElement;
@@ -55,7 +64,8 @@ describe('<SheetIntegrationList />', () => {
   });
 
   test('Link and Sync Button testing', async () => {
-    const { getAllByTestId, getByTestId } = render(wrapper);
+    const { getAllByTestId, getByTestId } = render(wrapper(syncSheetMutation));
+    const notificationSpy = vi.spyOn(Notification, 'setNotification');
 
     // loading is show initially
     expect(getByTestId('loading')).toBeInTheDocument();
@@ -70,12 +80,36 @@ describe('<SheetIntegrationList />', () => {
     });
 
     await waitFor(() => {
-      fireEvent.click(getAllByTestId('additionalButton')[1]);
-      expect(window.open).toBeCalled();
+      fireEvent.click(getAllByTestId('additionalButton')[0]);
+    });
+
+    await waitFor(() => {
+      expect(notificationSpy).toHaveBeenCalled();
+    });
+
+    fireEvent.click(getAllByTestId('additionalButton')[1]);
+
+    await waitFor(() => {
+      expect(window.open).toHaveBeenCalled();
+    });
+  });
+
+  test('Should render warnings', async () => {
+    const { getByText, getByTestId, getAllByTestId } = render(
+      wrapper(syncSheetMutationWithWarnings)
+    );
+
+    // loading is show initially
+    expect(getByTestId('loading')).toBeInTheDocument();
+
+    await waitFor(() => {
+      expect(getByText('Google sheets')).toBeInTheDocument();
     });
 
+    fireEvent.click(getAllByTestId('additionalButton')[2]);
+
     await waitFor(() => {
-      fireEvent.click(getAllByTestId('additionalButton')[1]);
+      expect(screen.getByText('Please check the warnings')).toBeInTheDocument();
     });
   });
 });

src/containers/Template/Form/HSM/HSM.test.tsx

@@ -72,7 +72,7 @@ describe('Add mode', () => {
     });
   });
 
-  test('Check for message and sample message validations while creating a template', async () => {
+  test('it should create a template message', async () => {
     const notificationSpy = vi.spyOn(Notification, 'setNotification');
     render(template);
 
@@ -82,6 +82,58 @@ describe('Add mode', () => {
       );
     });
 
+    const title = screen.getAllByTestId('input')[0].querySelector('input') as HTMLInputElement;
+    const elementName = document.querySelector('input[name="shortcode"]') as HTMLInputElement;
+    const attachmentUrl = document.querySelector('input[name="attachmentURL"]') as HTMLInputElement;
+    const message = screen.getByTestId('editor-body') as HTMLElement;
+    const sampleMessage = screen.getByTestId('editor-example') as HTMLElement;
+
+    await user.type(title, 'Hello');
+
+    await user.type(elementName, 'welcome');
+
+    // add message
+    await user.click(message);
+    await user.tab();
+    fireEvent.input(message, { data: 'Hi {{1}}, How are you' });
+
+    // add Sample message
+    await user.click(sampleMessage);
+    await user.tab();
+    fireEvent.input(sampleMessage, { data: 'Hi [Glific], How are you' });
+
+    const [_language, category, attachmentType] = screen.getAllByTestId('autocomplete-element');
+    category.focus();
+    fireEvent.keyDown(category, { key: 'ArrowDown' });
+    fireEvent.keyDown(category, { key: 'ArrowDown' });
+    fireEvent.keyDown(category, { key: 'Enter' });
+
+    attachmentType.focus();
+    fireEvent.keyDown(attachmentType, { key: 'ArrowDown' });
+    fireEvent.keyDown(attachmentType, { key: 'ArrowDown' });
+    fireEvent.keyDown(attachmentType, { key: 'Enter' });
+
+    await user.type(
+      attachmentUrl,
+      'https://www.buildquickbots.com/whatsapp/media/sample/jpg/sample02.jpg'
+    );
+
+    fireEvent.click(screen.getByTestId('submitActionButton'));
+
+    await waitFor(() => {
+      expect(notificationSpy).toHaveBeenCalled();
+    });
+  }, 10000);
+
+  test('it should check sample and body', async () => {
+    render(template);
+
+    await waitFor(() => {
+      expect(screen.getAllByTestId('AutocompleteInput')[0].querySelector('input')).toHaveValue(
+        'English'
+      );
+    });
+
     const title = screen.getAllByTestId('input')[0].querySelector('input') as HTMLInputElement;
     const elementName = document.querySelector('input[name="shortcode"]') as HTMLInputElement;
     const message = screen.getByTestId('editor-body') as HTMLElement;
@@ -112,23 +164,7 @@ describe('Add mode', () => {
         )
       ).toBeInTheDocument();
     });
-
-    // fix Sample message
-    const backspaceKey = '{backspace}';
-    await user.type(sampleMessage, backspaceKey.repeat(19) + '[[Glific], How are you');
-
-    const [_language, category] = screen.getAllByTestId('autocomplete-element');
-    category.focus();
-    fireEvent.keyDown(category, { key: 'ArrowDown' });
-    fireEvent.keyDown(category, { key: 'ArrowDown' });
-    fireEvent.keyDown(category, { key: 'Enter' });
-
-    fireEvent.click(screen.getByTestId('submitActionButton'));
-
-    await waitFor(() => {
-      expect(notificationSpy).toHaveBeenCalled();
-    });
-  }, 10000);
+  });
 
   test('add quick reply buttons when adding a template', async () => {
     const notificationSpy = vi.spyOn(Notification, 'setNotification');
@@ -155,7 +191,7 @@ describe('Add mode', () => {
     // add Sample message
     await user.click(sampleMessage);
     await user.tab();
-    fireEvent.input(sampleMessage, { data: 'Hi [[Glific], How are you' });
+    fireEvent.input(sampleMessage, { data: 'Hi [Glific], How are you' });
 
     await user.click(screen.getAllByTestId('checkboxLabel')[1]);
     await user.click(screen.getByText('Quick replies'));

src/containers/Template/Form/Template.test.helper.ts

@@ -0,0 +1,69 @@
+import { getOrganizationLanguagesQueryByOrder } from 'mocks/Organization';
+import { getFilterTagQuery } from 'mocks/Tag';
+import { templateEditMock } from 'mocks/Template';
+
+export const templateFormHSMFormFields = [
+  {
+    name: 'example',
+    label: 'Sample message*',
+    rows: 5,
+    convertToWhatsApp: true,
+    textArea: true,
+    disabled: true,
+    helperText:
+      'Replace variables eg. {{1}} with actual values enclosed in [ ] eg. [12345] to show a complete message with meaningful word/statement/numbers/ special characters.',
+    isEditing: true,
+    editorState: '',
+  },
+  {
+    name: 'category',
+    options: [
+      {
+        label: 'UTILITY',
+        id: 0,
+      },
+      {
+        label: 'MARKETING',
+        id: 1,
+      },
+    ],
+    optionLabel: 'label',
+    multiple: false,
+    label: 'Category*',
+    placeholder: 'Category*',
+    disabled: true,
+    helperText: 'Select the most relevant category',
+  },
+  {
+    name: 'shortcode',
+    placeholder: 'Element name*',
+    label: 'Element name*',
+    disabled: true,
+    inputProp: {},
+  },
+];
+
+export const HSM_TEMPLATE_MOCKS = [
+  templateEditMock('1', {
+    buttonType: 'QUICK_REPLY',
+    buttons:
+      '[{"type":"QUICK_REPLY","text":"View Account Balance"},{"type":"QUICK_REPLY","text":"View Mini Statement"}]',
+  }),
+  getFilterTagQuery,
+  getOrganizationLanguagesQueryByOrder,
+  templateEditMock('1', {
+    buttonType: 'QUICK_REPLY',
+    buttons:
+      '[{"type":"QUICK_REPLY","text":"View Account Balance"},{"type":"QUICK_REPLY","text":"View Mini Statement"}]',
+  }),
+  templateEditMock('2', {
+    buttonType: 'CALL_TO_ACTION',
+    buttons:
+      '[{"type":"CALL_TO_ACTION","text":"View Account Balance"},{"type":"QUICK_REPLY","text":"View Mini Statement"}]',
+  }),
+  templateEditMock('2', {
+    buttonType: 'CALL_TO_ACTION',
+    buttons:
+      '[{"type":"CALL_TO_ACTION","text":"View Account Balance"},{"type":"QUICK_REPLY","text":"View Mini Statement"}]',
+  }),
+];