Skip to content

Commit

Permalink
test: created tests for src/components/AddOn/core/AddOnStore/AddOnSto…
Browse files Browse the repository at this point in the history 
…re.tsx
  • Loading branch information
@ALOK9442
ALOK9442 committed Jan 3, 2024
1 parent 9ff2924 commit 2879452
Showing 1 changed file with 284 additions and 21 deletions.
305 changes: 284 additions & 21 deletions src/components/AddOn/core/AddOnStore/AddOnStore.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,27 +1,20 @@
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,
InMemoryCache,
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';
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,
Expand All @@ -30,31 +23,301 @@ const httpLink = new HttpLink({
},
});

const client: ApolloClient<NormalizedCacheObject> = 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(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);
expect(screen.getByTestId('AddOnEntryStore')).toBeInTheDocument();
});

test('filters by enabled plugins when "Enable" radio button is selected', () => {
render(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);
waitFor(() => {
fireEvent.click(screen.getByLabelText('enable'));
});
});

test('filters by disabled plugins when "disable" radio button is selected', () => {
render(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);
waitFor(() => {
fireEvent.click(screen.getByLabelText('disable'));
});
});

test('searches for plugins by name', async () => {
render(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);
waitFor(() => {
fireEvent.change(screen.getByPlaceholderText('searchName'), {
target: { value: 'examplePlugin' },
});
});
});

test('displays a message when no search results are found', async () => {
render(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

waitFor(() => {
fireEvent.change(screen.getByPlaceholderText('searchName'), {
target: { value: 'nonexistentPlugin' },
});
});
});

test('switches between "Available" and "Installed" tabs', async () => {
render(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

await waitFor(() => screen.getByTestId('AddOnEntryStore'));

waitFor(() => {
fireEvent.click(screen.getByText('Installed'));
});
});

test('installs a plugin when "Install" button is clicked', async () => {
render(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
{<AddOnStore />}
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);
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(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

await waitFor(() => screen.getByTestId('AddOnEntryStore'));

waitFor(() => {
fireEvent.click(screen.getByText('Modify'));
});
});

test('displays the organization screen with the correct title', async () => {
render(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

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(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

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(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

await waitFor(() => screen.getByTestId('AddOnEntryStore'));

waitFor(() => {
fireEvent.click(screen.getByText('Example Plugin'));
});
});

test('renders AddOnEntry components with the correct information', async () => {
render(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

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(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

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(
<ApolloProvider client={client}>
<Provider store={store}>
<BrowserRouter>
<I18nextProvider i18n={i18nForTest}>
<AddOnStore />
</I18nextProvider>
</BrowserRouter>
</Provider>
</ApolloProvider>
);

await waitFor(() => screen.getByTestId('AddOnEntryStore'));

waitFor(() => {
fireEvent.click(screen.getByText('Install'));
});
});
});

0 comments on commit 2879452

Please sign in to comment.