diff --git a/src/screens/OrganizationEvents/OrganizationEvents.test.tsx b/src/screens/OrganizationEvents/OrganizationEvents.test.tsx index 4c08db90d5..9f79991274 100644 --- a/src/screens/OrganizationEvents/OrganizationEvents.test.tsx +++ b/src/screens/OrganizationEvents/OrganizationEvents.test.tsx @@ -13,6 +13,7 @@ import { CREATE_EVENT_MUTATION } from 'GraphQl/Mutations/mutations'; import i18nForTest from 'utils/i18nForTest'; import userEvent from '@testing-library/user-event'; import { StaticMockLink } from 'utils/StaticMockLink'; +import { toast } from 'react-toastify'; const MOCKS = [ { @@ -112,6 +113,14 @@ async function wait(ms = 100): Promise { }); } +jest.mock('react-toastify', () => ({ + toast: { + success: jest.fn(), + warning: jest.fn(), + error: jest.fn(), + }, +})); + describe('Organisation Events Page', () => { const formData = { title: 'Dummy Org', @@ -297,6 +306,91 @@ describe('Organisation Events Page', () => { userEvent.click(screen.getByTestId('createEventBtn')); }, 15000); + test('Testing Create event with invalid inputs', async () => { + const formData = { + title: ' ', + description: ' ', + location: ' ', + startDate: '03/28/2022', + endDate: '04/15/2023', + startTime: '02:00', + endTime: '06:00', + allDay: false, + recurring: false, + isPublic: true, + isRegisterable: true, + }; + render( + + + + + + + + + + ); + + await wait(); + + userEvent.click(screen.getByTestId('createEventModalBtn')); + + userEvent.type(screen.getByPlaceholderText(/Enter Title/i), formData.title); + userEvent.type( + screen.getByPlaceholderText(/Enter Description/i), + formData.description + ); + userEvent.type( + screen.getByPlaceholderText(/Enter Location/i), + formData.location + ); + userEvent.type( + screen.getByPlaceholderText(/Enter Location/i), + formData.location + ); + + const endDateDatePicker = screen.getByPlaceholderText(/End Date/i); + const startDateDatePicker = screen.getByPlaceholderText(/Start Date/i); + + fireEvent.click(endDateDatePicker); + fireEvent.click(startDateDatePicker); + + await act(async () => { + fireEvent.change(endDateDatePicker, { + target: { + value: formData.endDate, + }, + }); + fireEvent.change(startDateDatePicker, { + target: { + value: formData.startDate, + }, + }); + }); + userEvent.click(screen.getByTestId('alldayCheck')); + userEvent.click(screen.getByTestId('recurringCheck')); + userEvent.click(screen.getByTestId('ispublicCheck')); + userEvent.click(screen.getByTestId('registrableCheck')); + + await wait(); + + expect(screen.getByPlaceholderText(/Enter Title/i)).toHaveValue(' '); + expect(screen.getByPlaceholderText(/Enter Description/i)).toHaveValue(' '); + + expect(endDateDatePicker).toHaveValue(formData.endDate); + expect(startDateDatePicker).toHaveValue(formData.startDate); + expect(screen.getByTestId('alldayCheck')).not.toBeChecked(); + expect(screen.getByTestId('recurringCheck')).toBeChecked(); + expect(screen.getByTestId('ispublicCheck')).not.toBeChecked(); + expect(screen.getByTestId('registrableCheck')).toBeChecked(); + + userEvent.click(screen.getByTestId('createEventBtn')); + expect(toast.warning).toBeCalledWith('Title can not be blank!'); + expect(toast.warning).toBeCalledWith('Description can not be blank!'); + expect(toast.warning).toBeCalledWith('Location can not be blank!'); + }, 15000); + test('Testing if the event is not for all day', async () => { render( diff --git a/src/screens/OrganizationEvents/OrganizationEvents.tsx b/src/screens/OrganizationEvents/OrganizationEvents.tsx index fe25bcdb6d..36852389eb 100644 --- a/src/screens/OrganizationEvents/OrganizationEvents.tsx +++ b/src/screens/OrganizationEvents/OrganizationEvents.tsx @@ -83,41 +83,56 @@ function organizationEvents(): JSX.Element { e: ChangeEvent ): Promise => { e.preventDefault(); - try { - const { data: createEventData } = await create({ - variables: { - title: formState.title, - description: formState.eventdescrip, - isPublic: publicchecked, - recurring: recurringchecked, - isRegisterable: registrablechecked, - organizationId: currentUrl, - startDate: dayjs(startDate).format('YYYY-MM-DD'), - endDate: dayjs(endDate).format('YYYY-MM-DD'), - allDay: alldaychecked, - location: formState.location, - startTime: !alldaychecked ? formState.startTime + 'Z' : null, - endTime: !alldaychecked ? formState.endTime + 'Z' : null, - }, - }); - - /* istanbul ignore next */ - if (createEventData) { - toast.success(t('eventCreated')); - refetch(); - hideInviteModal(); - setFormState({ - title: '', - eventdescrip: '', - date: '', - location: '', - startTime: '08:00:00', - endTime: '18:00:00', + if ( + formState.title.trim().length > 0 && + formState.eventdescrip.trim().length > 0 && + formState.location.trim().length > 0 + ) { + try { + const { data: createEventData } = await create({ + variables: { + title: formState.title, + description: formState.eventdescrip, + isPublic: publicchecked, + recurring: recurringchecked, + isRegisterable: registrablechecked, + organizationId: currentUrl, + startDate: dayjs(startDate).format('YYYY-MM-DD'), + endDate: dayjs(endDate).format('YYYY-MM-DD'), + allDay: alldaychecked, + location: formState.location, + startTime: !alldaychecked ? formState.startTime + 'Z' : null, + endTime: !alldaychecked ? formState.endTime + 'Z' : null, + }, }); + + /* istanbul ignore next */ + if (createEventData) { + toast.success(t('eventCreated')); + refetch(); + hideInviteModal(); + setFormState({ + title: '', + eventdescrip: '', + date: '', + location: '', + startTime: '08:00:00', + endTime: '18:00:00', + }); + } + } catch (error: any) { + /* istanbul ignore next */ + errorHandler(t, error); } - } catch (error: any) { - /* istanbul ignore next */ - errorHandler(t, error); + } + if (formState.title.trim().length === 0) { + toast.warning('Title can not be blank!'); + } + if (formState.eventdescrip.trim().length === 0) { + toast.warning('Description can not be blank!'); + } + if (formState.location.trim().length === 0) { + toast.warning('Location can not be blank!'); } };