From 28794528d9cc0de99c2862753e25c21fff591be5 Mon Sep 17 00:00:00 2001 From: ALOK9442 Date: Wed, 3 Jan 2024 15:26:24 +0530 Subject: [PATCH] test: created tests for src/components/AddOn/core/AddOnStore/AddOnStore.tsx --- .../AddOn/core/AddOnStore/AddOnStore.test.tsx | 305 ++++++++++++++++-- 1 file changed, 284 insertions(+), 21 deletions(-) diff --git a/src/components/AddOn/core/AddOnStore/AddOnStore.test.tsx b/src/components/AddOn/core/AddOnStore/AddOnStore.test.tsx index 2fc5e61e92..c78df3903a 100644 --- a/src/components/AddOn/core/AddOnStore/AddOnStore.test.tsx +++ b/src/components/AddOn/core/AddOnStore/AddOnStore.test.tsx @@ -1,11 +1,5 @@ import React from 'react'; -import { render } from '@testing-library/react'; -// import * as reactRedux from 'react-redux'; -// import { BrowserRouter } from 'react-router-dom'; -// import userEvent from '@testing-library/user-event'; - -// import AddOnStore from './AddOnStore'; -// import { store } from 'state/store'; +import { render, screen, fireEvent, waitFor } from '@testing-library/react'; import { ApolloClient, ApolloProvider, @@ -13,8 +7,6 @@ import { ApolloLink, HttpLink, } from '@apollo/client'; - -import type { NormalizedCacheObject } from '@apollo/client'; import { BrowserRouter } from 'react-router-dom'; import AddOnStore from './AddOnStore'; import { Provider } from 'react-redux'; @@ -22,6 +14,7 @@ import { store } from 'state/store'; import { BACKEND_URL } from 'Constant/constant'; import i18nForTest from 'utils/i18nForTest'; import { I18nextProvider } from 'react-i18next'; +import userEvent from '@testing-library/user-event'; const httpLink = new HttpLink({ uri: BACKEND_URL, @@ -30,31 +23,301 @@ const httpLink = new HttpLink({ }, }); -const client: ApolloClient = new ApolloClient({ +const client = new ApolloClient({ cache: new InMemoryCache(), link: ApolloLink.from([httpLink]), }); + describe('Testing AddOnStore Component', () => { - test('Temporary test for AddOnStore', () => { - expect(true).toBe(true); - const { getByTestId } = render( + test('renders AddOnStore component with loader', () => { + render( + + + + + + + + + + ); + expect(screen.getByTestId('AddOnEntryStore')).toBeInTheDocument(); + }); + + test('filters by enabled plugins when "Enable" radio button is selected', () => { + render( + + + + + + + + + + ); + waitFor(() => { + fireEvent.click(screen.getByLabelText('enable')); + }); + }); + + test('filters by disabled plugins when "disable" radio button is selected', () => { + render( + + + + + + + + + + ); + waitFor(() => { + fireEvent.click(screen.getByLabelText('disable')); + }); + }); + + test('searches for plugins by name', async () => { + render( + + + + + + + + + + ); + waitFor(() => { + fireEvent.change(screen.getByPlaceholderText('searchName'), { + target: { value: 'examplePlugin' }, + }); + }); + }); + + test('displays a message when no search results are found', async () => { + render( + + + + + + + + + + ); + + waitFor(() => { + fireEvent.change(screen.getByPlaceholderText('searchName'), { + target: { value: 'nonexistentPlugin' }, + }); + }); + }); + + test('switches between "Available" and "Installed" tabs', async () => { + render( + + + + + + + + + + ); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + fireEvent.click(screen.getByText('Installed')); + }); + }); + + test('installs a plugin when "Install" button is clicked', async () => { + render( - {} + ); - expect(getByTestId('AddOnEntryStore')).toBeInTheDocument(); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + fireEvent.click(screen.getByText('Install')); + }); }); - // const useSelectorMock = jest.spyOn(reactRedux, 'useSelector'); - // const useDispatchMock = jest.spyOn(reactRedux, 'useDispatch'); - // beforeEach(() => { - // useSelectorMock.mockClear(); - // useDispatchMock.mockClear(); - // }); + test('modifies a plugin when "Modify" button is clicked', async () => { + render( + + + + + + + + + + ); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + fireEvent.click(screen.getByText('Modify')); + }); + }); + + test('displays the organization screen with the correct title', async () => { + render( + + + + + + + + + + ); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + expect(screen.getByTestId('organization-screen')).toBeInTheDocument(); + }); + + waitFor(() => { + expect(screen.getByText('Plugin Store')).toBeInTheDocument(); + }); + }); + + test('handles API error and displays an error message', async () => { + jest.mock('@apollo/client', () => ({ + ...jest.requireActual('@apollo/client'), + useQuery: jest.fn(() => ({ + data: undefined, + loading: false, + error: new Error('API error'), + })), + })); + + render( + + + + + + + + + + ); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + expect(screen.getByText('Error loading data')).toBeInTheDocument(); + }); + }); + + test('clicks on an AddOnEntry and dispatches the correct Redux action', async () => { + render( + + + + + + + + + + ); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + fireEvent.click(screen.getByText('Example Plugin')); + }); + }); + + test('renders AddOnEntry components with the correct information', async () => { + render( + + + + + + + + + + ); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + expect(screen.getByText('Example Plugin')).toBeInTheDocument(); + expect(screen.getByText('Created by: John Doe')).toBeInTheDocument(); + }); + }); + + test('searches for plugins and displays search results', async () => { + render( + + + + + + + + + + ); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + userEvent.type( + screen.getByPlaceholderText('Search Name'), + 'Sample Plugin' + ); + }); + + waitFor(() => { + expect( + screen.getByText('Search results for Sample Plugin') + ).toBeInTheDocument(); + expect(screen.getByText('Sample Plugin 1')).toBeInTheDocument(); + }); + }); + + test('installs a plugin when "Install" button is clicked in AddOnEntry', async () => { + render( + + + + + + + + + + ); + + await waitFor(() => screen.getByTestId('AddOnEntryStore')); + + waitFor(() => { + fireEvent.click(screen.getByText('Install')); + }); + }); });