Skip to content

Commit

Permalink
correct existing tests for OrganizationEvents.tsx
Browse files Browse the repository at this point in the history
  • Loading branch information
@meetulr
meetulr committed Mar 16, 2024
1 parent 8ad6974 commit 27d0951
Show file tree
Hide file tree
Showing 2 changed files with 158 additions and 35 deletions.
156 changes: 137 additions & 19 deletions src/screens/OrganizationEvents/OrganizationEvents.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,12 @@
import React from 'react';
import { MockedProvider } from '@apollo/react-testing';
import { act, render, screen, fireEvent } from '@testing-library/react';
import {
act,
render,
screen,
fireEvent,
waitFor,
} from '@testing-library/react';
import { Provider } from 'react-redux';
import { BrowserRouter } from 'react-router-dom';
import 'jest-location-mock';
Expand Down Expand Up @@ -95,13 +101,14 @@ const MOCKS = [
query: CREATE_EVENT_MUTATION,
variables: {
title: 'Dummy Org',
location: 'New Delhi',
description: 'This is a dummy organization',
isPublic: false,
recurring: true,
recurring: false,
isRegisterable: true,
organizationId: undefined,
startDate: 'Thu Mar 28 20222',
endDate: 'Fri Mar 28 20223',
startDate: '2022-03-28',
endDate: '2023-04-15',
allDay: true,
},
},
Expand All @@ -113,6 +120,32 @@ const MOCKS = [
},
},
},
{
request: {
query: CREATE_EVENT_MUTATION,
variables: {
title: 'Dummy Org',
location: 'New Delhi',
description: 'This is a dummy organization',
isPublic: true,
recurring: false,
isRegisterable: false,
organizationId: undefined,
startDate: '2024-03-16',
endDate: '2024-03-16',
allDay: false,
startTime: '09:00:00Z',
endTime: '17:00:00Z',
},
},
result: {
data: {
createEvent: {
_id: '1',
},
},
},
},
];
const link = new StaticMockLink(MOCKS, true);
const link2 = new StaticMockLink([], true);
Expand All @@ -125,6 +158,12 @@ async function wait(ms = 100): Promise<void> {
});
}

const translations = JSON.parse(
JSON.stringify(
i18nForTest.getDataByLanguage('en')?.translation.organizationEvents,
),
);

jest.mock('@mui/x-date-pickers/DateTimePicker', () => {
return {
DateTimePicker: jest.requireActual(
Expand All @@ -148,8 +187,8 @@ describe('Organisation Events Page', () => {
startDate: '03/28/2022',
endDate: '04/15/2023',
location: 'New Delhi',
startTime: '02:00',
endTime: '06:00',
startTime: '09:00 AM',
endTime: '05:00 PM',
};

global.alert = jest.fn();
Expand Down Expand Up @@ -237,6 +276,10 @@ describe('Organisation Events Page', () => {
);

await wait();

await waitFor(() => {
expect(screen.getByTestId('createEventModalBtn')).toBeInTheDocument();
});
});

test('Testing toggling of Create event modal', async () => {
Expand All @@ -258,9 +301,25 @@ describe('Organisation Events Page', () => {

await wait();

await waitFor(() => {
expect(screen.getByTestId('createEventModalBtn')).toBeInTheDocument();
});

userEvent.click(screen.getByTestId('createEventModalBtn'));

await waitFor(() => {
expect(
screen.getByTestId('createEventModalCloseBtn'),
).toBeInTheDocument();
});

userEvent.click(screen.getByTestId('createEventModalCloseBtn'));

await waitFor(() => {
expect(
screen.queryByTestId('createEventModalCloseBtn'),
).not.toBeInTheDocument();
});
});

test('Testing Create event modal', async () => {
Expand All @@ -282,9 +341,18 @@ describe('Organisation Events Page', () => {

await wait();

await waitFor(() => {
expect(screen.getByTestId('createEventModalBtn')).toBeInTheDocument();
});

userEvent.click(screen.getByTestId('createEventModalBtn'));

await waitFor(() => {
expect(screen.getByPlaceholderText(/Enter Title/i)).toBeInTheDocument();
});

userEvent.type(screen.getByPlaceholderText(/Enter Title/i), formData.title);

userEvent.type(
screen.getByPlaceholderText(/Enter Description/i),
formData.description,
Expand All @@ -293,10 +361,6 @@ describe('Organisation Events Page', () => {
screen.getByPlaceholderText(/Enter Location/i),
formData.location,
);
userEvent.type(
screen.getByPlaceholderText(/Enter Location/i),
formData.location,
);

const endDateDatePicker = screen.getByLabelText('End Date');
const startDateDatePicker = screen.getByLabelText('Start Date');
Expand All @@ -308,8 +372,6 @@ describe('Organisation Events Page', () => {
target: { value: formData.startDate },
});

userEvent.click(screen.getByTestId('alldayCheck'));
userEvent.click(screen.getByTestId('recurringCheck'));
userEvent.click(screen.getByTestId('ispublicCheck'));
userEvent.click(screen.getByTestId('registrableCheck'));

Expand All @@ -324,13 +386,21 @@ describe('Organisation Events Page', () => {

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'));
}, 15000);

await waitFor(() => {
expect(toast.success).toBeCalledWith(translations.eventCreated);
});

await waitFor(() => {
expect(
screen.queryByTestId('createEventModalCloseBtn'),
).not.toBeInTheDocument();
});
});

test('Testing Create event with invalid inputs', async () => {
const formData = {
Expand Down Expand Up @@ -364,8 +434,16 @@ describe('Organisation Events Page', () => {

await wait();

await waitFor(() => {
expect(screen.getByTestId('createEventModalBtn')).toBeInTheDocument();
});

userEvent.click(screen.getByTestId('createEventModalBtn'));

await waitFor(() => {
expect(screen.getByPlaceholderText(/Enter Title/i)).toBeInTheDocument();
});

userEvent.type(screen.getByPlaceholderText(/Enter Title/i), formData.title);
userEvent.type(
screen.getByPlaceholderText(/Enter Description/i),
Expand Down Expand Up @@ -411,7 +489,15 @@ describe('Organisation Events Page', () => {
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);

userEvent.click(screen.getByTestId('createEventModalCloseBtn'));

await waitFor(() => {
expect(
screen.queryByTestId('createEventModalCloseBtn'),
).not.toBeInTheDocument();
});
});

test('Testing if the event is not for all day', async () => {
render(
Expand All @@ -432,22 +518,54 @@ describe('Organisation Events Page', () => {

await wait();

await waitFor(() => {
expect(screen.getByTestId('createEventModalBtn')).toBeInTheDocument();
});

userEvent.click(screen.getByTestId('createEventModalBtn'));

await waitFor(() => {
expect(screen.getByPlaceholderText(/Enter Title/i)).toBeInTheDocument();
});

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.click(screen.getByTestId('alldayCheck'));
await wait();

userEvent.type(screen.getByLabelText('Start Time'), formData.startTime);
userEvent.type(screen.getByLabelText('End Time'), formData.endTime);
await waitFor(() => {
expect(screen.getByLabelText(translations.startTime)).toBeInTheDocument();
});

const startTimePicker = screen.getByLabelText(translations.startTime);
const endTimePicker = screen.getByLabelText(translations.endTime);

fireEvent.change(startTimePicker, {
target: { value: formData.startTime },
});

fireEvent.change(endTimePicker, {
target: { value: formData.endTime },
});

userEvent.click(screen.getByTestId('createEventBtn'));

await waitFor(() => {
expect(toast.success).toBeCalledWith(translations.eventCreated);
});

await waitFor(() => {
expect(
screen.queryByTestId('createEventModalCloseBtn'),
).not.toBeInTheDocument();
});
});
});
37 changes: 21 additions & 16 deletions src/screens/OrganizationEvents/OrganizationEvents.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,17 +82,19 @@ function organizationEvents(): JSX.Element {
setCustomRecurrenceModalIsOpen(false);
};

const { data, loading, error, refetch } = useQuery(
ORGANIZATION_EVENT_CONNECTION_LIST,
{
variables: {
organization_id: currentUrl,
title_contains: '',
description_contains: '',
location_contains: '',
},
const {
data,
loading,
error: eventDataError,
refetch,
} = useQuery(ORGANIZATION_EVENT_CONNECTION_LIST, {
variables: {
organization_id: currentUrl,
title_contains: '',
description_contains: '',
location_contains: '',
},
);
});

const { data: orgData } = useQuery(ORGANIZATIONS_LIST, {
variables: { id: currentUrl },
Expand Down Expand Up @@ -132,10 +134,13 @@ function organizationEvents(): JSX.Element {
endDate: endDate ? dayjs(endDate).format('YYYY-MM-DD') : undefined,
allDay: alldaychecked,
location: formState.location,
startTime: !alldaychecked ? formState.startTime + 'Z' : null,
endTime: !alldaychecked ? formState.endTime + 'Z' : null,
frequency,
weekDays: frequency === Frequency.WEEKLY ? weekDays : undefined,
startTime: !alldaychecked ? formState.startTime + 'Z' : undefined,
endTime: !alldaychecked ? formState.endTime + 'Z' : undefined,
frequency: recurringchecked ? frequency : undefined,
weekDays:
recurringchecked && frequency === Frequency.WEEKLY
? weekDays
: undefined,
count,
},
});
Expand Down Expand Up @@ -178,10 +183,10 @@ function organizationEvents(): JSX.Element {
};

useEffect(() => {
if (error) {
if (eventDataError) {
navigate('/orglist');
}
}, [error]);
}, [eventDataError]);

if (loading || loading2) {
return <Loader />;
Expand Down

0 comments on commit 27d0951

Please sign in to comment.