From c310730fdf93d2eacb3f1a63594a38071a46a9de Mon Sep 17 00:00:00 2001 From: Pratap Rathi Date: Sat, 28 Dec 2024 20:48:51 +0530 Subject: [PATCH] Migrated src/components/EventStats/* from Jest to Vitest (#2997) * Refactor: Migrated src/components/EventStats/* from Jest to Vitest * Refactor: Removed duplicate mock implementation in EventStatsWrapper.spec.tsx --- ...ventStats.test.tsx => EventStats.spec.tsx} | 16 +++++++------ ...er.test.tsx => EventStatsWrapper.spec.tsx} | 23 ++++++++----------- ...Rating.test.tsx => AverageRating.spec.tsx} | 3 ++- .../{Feedback.test.tsx => Feedback.spec.tsx} | 16 +++++++------ .../{Review.test.tsx => Review.spec.tsx} | 5 ++-- 5 files changed, 32 insertions(+), 31 deletions(-) rename src/components/EventStats/{EventStats.test.tsx => EventStats.spec.tsx} (75%) rename src/components/EventStats/{EventStatsWrapper.test.tsx => EventStatsWrapper.spec.tsx} (73%) rename src/components/EventStats/Statistics/{AverageRating.test.tsx => AverageRating.spec.tsx} (91%) rename src/components/EventStats/Statistics/{Feedback.test.tsx => Feedback.spec.tsx} (81%) rename src/components/EventStats/Statistics/{Review.test.tsx => Review.spec.tsx} (89%) diff --git a/src/components/EventStats/EventStats.test.tsx b/src/components/EventStats/EventStats.spec.tsx similarity index 75% rename from src/components/EventStats/EventStats.test.tsx rename to src/components/EventStats/EventStats.spec.tsx index e2496fa5af..058913c6e7 100644 --- a/src/components/EventStats/EventStats.test.tsx +++ b/src/components/EventStats/EventStats.spec.tsx @@ -4,13 +4,15 @@ import { MockedProvider } from '@apollo/react-testing'; import { EventStats } from './EventStats'; import { BrowserRouter } from 'react-router-dom'; import { EVENT_FEEDBACKS } from 'GraphQl/Queries/Queries'; +import { vi, describe, expect, it } from 'vitest'; -// Mock the modules for PieChart rendering as they require a trasformer being used (which is not done by Jest) +// Mock the modules for PieChart rendering as they require a trasformer being used (which is not done by Vitest) // These modules are used by the Feedback component -jest.mock('@mui/x-charts/PieChart', () => ({ - pieArcLabelClasses: jest.fn(), - PieChart: jest.fn().mockImplementation(() => <>Test), - pieArcClasses: jest.fn(), +vi.mock('@mui/x-charts/PieChart', async () => ({ + ...(await vi.importActual('@mui/x-charts/PieChart')), + pieArcLabelClasses: vi.fn(), + PieChart: vi.fn().mockImplementation(() => <>Test), + pieArcClasses: vi.fn(), })); const mockData = [ @@ -43,10 +45,10 @@ describe('Testing Event Stats', () => { const props = { eventId: 'eventStats123', show: true, - handleClose: jest.fn(), + handleClose: vi.fn(), }; - test('The stats should be rendered properly', async () => { + it('The stats should be rendered properly', async () => { const { queryByText } = render( diff --git a/src/components/EventStats/EventStatsWrapper.test.tsx b/src/components/EventStats/EventStatsWrapper.spec.tsx similarity index 73% rename from src/components/EventStats/EventStatsWrapper.test.tsx rename to src/components/EventStats/EventStatsWrapper.spec.tsx index 0e64ac13cc..7a94aea5ef 100644 --- a/src/components/EventStats/EventStatsWrapper.test.tsx +++ b/src/components/EventStats/EventStatsWrapper.spec.tsx @@ -4,12 +4,15 @@ import { MockedProvider } from '@apollo/react-testing'; import { EventStatsWrapper } from './EventStatsWrapper'; import { BrowserRouter } from 'react-router-dom'; import { EVENT_FEEDBACKS } from 'GraphQl/Queries/Queries'; +import { vi, describe, expect, it } from 'vitest'; -// Mock the modules for PieChart rendering as they require a trasformer being used (which is not done by Jest) -jest.mock('@mui/x-charts/PieChart', () => ({ - pieArcLabelClasses: jest.fn(), - PieChart: jest.fn().mockImplementation(() => <>Test), - pieArcClasses: jest.fn(), +// Mock the modules for PieChart rendering as they require a trasformer being used (which is not done by Vitest) +// These modules are used by the Feedback component +vi.mock('@mui/x-charts/PieChart', async () => ({ + ...(await vi.importActual('@mui/x-charts/PieChart')), + pieArcLabelClasses: vi.fn(), + PieChart: vi.fn().mockImplementation(() => <>Test), + pieArcClasses: vi.fn(), })); const mockData = [ @@ -38,20 +41,12 @@ const mockData = [ }, ]; -// Mock the modules for PieChart rendering as they require a trasformer being used (which is not done by Jest) -// These modules are used by the Feedback component -jest.mock('@mui/x-charts/PieChart', () => ({ - pieArcLabelClasses: jest.fn(), - PieChart: jest.fn().mockImplementation(() => <>Test), - pieArcClasses: jest.fn(), -})); - describe('Testing Event Stats Wrapper', () => { const props = { eventId: 'eventStats123', }; - test('The button to open and close the modal should work properly', async () => { + it('The button to open and close the modal should work properly', async () => { const { queryByText, queryByRole } = render( diff --git a/src/components/EventStats/Statistics/AverageRating.test.tsx b/src/components/EventStats/Statistics/AverageRating.spec.tsx similarity index 91% rename from src/components/EventStats/Statistics/AverageRating.test.tsx rename to src/components/EventStats/Statistics/AverageRating.spec.tsx index 01cf6461e3..c5a6b91925 100644 --- a/src/components/EventStats/Statistics/AverageRating.test.tsx +++ b/src/components/EventStats/Statistics/AverageRating.spec.tsx @@ -7,6 +7,7 @@ import { store } from 'state/store'; import { I18nextProvider } from 'react-i18next'; import i18nForTest from 'utils/i18nForTest'; import { ToastContainer } from 'react-toastify'; +import { describe, expect, it } from 'vitest'; const props = { data: { @@ -35,7 +36,7 @@ const props = { }; describe('Testing Average Rating Card', () => { - test('The component should be rendered and the Score should be shown', async () => { + it('The component should be rendered and the Score should be shown', async () => { const { queryByText } = render( diff --git a/src/components/EventStats/Statistics/Feedback.test.tsx b/src/components/EventStats/Statistics/Feedback.spec.tsx similarity index 81% rename from src/components/EventStats/Statistics/Feedback.test.tsx rename to src/components/EventStats/Statistics/Feedback.spec.tsx index 9abdee4c57..4fb020a70e 100644 --- a/src/components/EventStats/Statistics/Feedback.test.tsx +++ b/src/components/EventStats/Statistics/Feedback.spec.tsx @@ -7,12 +7,14 @@ import { store } from 'state/store'; import { I18nextProvider } from 'react-i18next'; import i18nForTest from 'utils/i18nForTest'; import { ToastContainer } from 'react-toastify'; +import { vi, describe, expect, it } from 'vitest'; -// Mock the modules for PieChart rendering as they require a trasformer being used (which is not done by Jest) -jest.mock('@mui/x-charts/PieChart', () => ({ - pieArcLabelClasses: jest.fn(), - PieChart: jest.fn().mockImplementation(() => <>Test), - pieArcClasses: jest.fn(), +// Mock the modules for PieChart rendering as they require a trasformer being used (which is not done by Vitest) +vi.mock('@mui/x-charts/PieChart', async () => ({ + ...(await vi.importActual('@mui/x-charts/PieChart')), + pieArcLabelClasses: vi.fn(), + PieChart: vi.fn().mockImplementation(() => <>Test), + pieArcClasses: vi.fn(), })); const nonEmptyProps = { @@ -52,7 +54,7 @@ const emptyProps = { }; describe('Testing Feedback Statistics Card', () => { - test('The component should be rendered and the feedback should be shown if present', async () => { + it('The component should be rendered and the feedback should be shown if present', async () => { const { queryByText } = render( @@ -79,7 +81,7 @@ describe('Testing Feedback Statistics Card', () => { }); }); - test('The component should be rendered and message should be shown if no feedback is present', async () => { + it('The component should be rendered and message should be shown if no feedback is present', async () => { const { queryByText } = render( diff --git a/src/components/EventStats/Statistics/Review.test.tsx b/src/components/EventStats/Statistics/Review.spec.tsx similarity index 89% rename from src/components/EventStats/Statistics/Review.test.tsx rename to src/components/EventStats/Statistics/Review.spec.tsx index 9093444ab2..5777c32c27 100644 --- a/src/components/EventStats/Statistics/Review.test.tsx +++ b/src/components/EventStats/Statistics/Review.spec.tsx @@ -7,6 +7,7 @@ import { store } from 'state/store'; import { I18nextProvider } from 'react-i18next'; import i18nForTest from 'utils/i18nForTest'; import { ToastContainer } from 'react-toastify'; +import { describe, expect, it } from 'vitest'; const nonEmptyReviewProps = { data: { @@ -51,7 +52,7 @@ const emptyReviewProps = { }; describe('Testing Review Statistics Card', () => { - test('The component should be rendered and the reviews should be shown if present', async () => { + it('The component should be rendered and the reviews should be shown if present', async () => { const { queryByText } = render( @@ -72,7 +73,7 @@ describe('Testing Review Statistics Card', () => { await waitFor(() => expect(queryByText('review2')).toBeInTheDocument()); }); - test('The component should be rendered and message should be shown if no review is present', async () => { + it('The component should be rendered and message should be shown if no review is present', async () => { const { queryByText } = render(