-
Notifications
You must be signed in to change notification settings - Fork 1.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
chore: added trace views test (#5519)
* feat: added trace filter test cases * feat: added trace filter test cases - initial render * feat: added test cases - query sync, filter section behaviour etc * feat: deleted mock-data files * feat: added test cases of undefined filters and items * feat: deleted tsconfig * feat: added clear and rest btn test cases for traces filters * feat: added collapse and uncollapse test for traces filters * fix: added test cases for trace - saved view * chore: code refactor' * chore: added trace for search and navigation * chore: used ROUTES enum * chore: fixed test cases after merge conflict
- Loading branch information
1 parent
fb92ddc
commit 2f0d98a
Showing
4 changed files
with
193 additions
and
14 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,172 @@ | ||
| /* eslint-disable @typescript-eslint/explicit-function-return-type */ | ||
| /* eslint-disable sonarjs/no-duplicate-string */ | ||
| import ROUTES from 'constants/routes'; | ||
| import { explorerView } from 'mocks-server/__mockdata__/explorer_views'; | ||
| import { server } from 'mocks-server/server'; | ||
| import { rest } from 'msw'; | ||
| import { MemoryRouter, Route } from 'react-router-dom'; | ||
| import { fireEvent, render, screen, waitFor, within } from 'tests/test-utils'; | ||
|
|
||
| import SaveView from '..'; | ||
|
|
||
| const handleExplorerTabChangeTest = jest.fn(); | ||
| jest.mock('hooks/useHandleExplorerTabChange', () => ({ | ||
| useHandleExplorerTabChange: () => ({ | ||
| handleExplorerTabChange: handleExplorerTabChangeTest, | ||
| }), | ||
| })); | ||
|
|
||
| jest.mock('react-router-dom', () => ({ | ||
| ...jest.requireActual('react-router-dom'), | ||
| useLocation: jest.fn().mockReturnValue({ | ||
| pathname: `${ROUTES.TRACES_SAVE_VIEWS}`, | ||
| }), | ||
| })); | ||
|
|
||
| describe('SaveView', () => { | ||
| it('should render the SaveView component', async () => { | ||
| render(<SaveView />); | ||
| expect(await screen.findByText('Table View')).toBeInTheDocument(); | ||
|
|
||
| const savedViews = screen.getAllByRole('row'); | ||
| expect(savedViews).toHaveLength(2); | ||
|
|
||
| // assert row 1 | ||
| expect( | ||
| within(document.querySelector('.view-tag') as HTMLElement).getByText('T'), | ||
| ).toBeInTheDocument(); | ||
| expect(screen.getByText('test-user-1')).toBeInTheDocument(); | ||
|
|
||
| // assert row 2 | ||
| expect(screen.getByText('R-test panel')).toBeInTheDocument(); | ||
| expect(screen.getByText('test-user-test')).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| it('explorer icon should take the user to the related explorer page', async () => { | ||
| render( | ||
| <MemoryRouter initialEntries={[ROUTES.TRACES_SAVE_VIEWS]}> | ||
| <Route path={ROUTES.TRACES_SAVE_VIEWS}> | ||
| <SaveView /> | ||
| </Route> | ||
| </MemoryRouter>, | ||
| ); | ||
|
|
||
| expect(await screen.findByText('Table View')).toBeInTheDocument(); | ||
|
|
||
| const explorerIcon = await screen.findAllByTestId('go-to-explorer'); | ||
| expect(explorerIcon[0]).toBeInTheDocument(); | ||
|
|
||
| // Simulate click on explorer icon | ||
| fireEvent.click(explorerIcon[0]); | ||
|
|
||
| await waitFor(() => | ||
| expect(handleExplorerTabChangeTest).toHaveBeenCalledWith( | ||
| expect.anything(), | ||
| expect.anything(), | ||
| '/traces-explorer', // Asserts the third argument is '/traces-explorer' | ||
| ), | ||
| ); | ||
| }); | ||
|
|
||
| it('should render the SaveView component with a search input', async () => { | ||
| render(<SaveView />); | ||
| const searchInput = screen.getByPlaceholderText('Search for views...'); | ||
| expect(await screen.findByText('Table View')).toBeInTheDocument(); | ||
|
|
||
| expect(searchInput).toBeInTheDocument(); | ||
|
|
||
| // search for 'R-test panel' | ||
| searchInput.focus(); | ||
| (searchInput as HTMLInputElement).setSelectionRange( | ||
| 0, | ||
| (searchInput as HTMLInputElement).value.length, | ||
| ); | ||
|
|
||
| fireEvent.change(searchInput, { target: { value: 'R-test panel' } }); | ||
| expect(searchInput).toHaveValue('R-test panel'); | ||
| searchInput.blur(); | ||
|
|
||
| expect(await screen.findByText('R-test panel')).toBeInTheDocument(); | ||
|
|
||
| // Table View should not be present now | ||
| const savedViews = screen.getAllByRole('row'); | ||
| expect(savedViews).toHaveLength(1); | ||
| }); | ||
|
|
||
| it('should be able to edit name of view', async () => { | ||
| server.use( | ||
| rest.put( | ||
| 'http://localhost/api/v1/explorer/views/test-uuid-1', | ||
| // eslint-disable-next-line no-return-assign | ||
| (_req, res, ctx) => | ||
| res( | ||
| ctx.status(200), | ||
| ctx.json({ | ||
| ...explorerView, | ||
| data: [ | ||
| ...explorerView.data, | ||
| (explorerView.data[0].name = 'New Table View'), | ||
| ], | ||
| }), | ||
| ), | ||
| ), | ||
| ); | ||
| render(<SaveView />); | ||
|
|
||
| const editButton = await screen.findAllByTestId('edit-view'); | ||
| fireEvent.click(editButton[0]); | ||
|
|
||
| const viewName = await screen.findByTestId('view-name'); | ||
| expect(viewName).toBeInTheDocument(); | ||
| expect(viewName).toHaveValue('Table View'); | ||
|
|
||
| const newViewName = 'New Table View'; | ||
| fireEvent.change(viewName, { target: { value: newViewName } }); | ||
| expect(viewName).toHaveValue(newViewName); | ||
|
|
||
| const saveButton = await screen.findByTestId('save-view'); | ||
| fireEvent.click(saveButton); | ||
|
|
||
| await waitFor(() => | ||
| expect(screen.getByText(newViewName)).toBeInTheDocument(), | ||
| ); | ||
| }); | ||
|
|
||
| it('should be able to delete a view', async () => { | ||
| server.use( | ||
| rest.delete( | ||
| 'http://localhost/api/v1/explorer/views/test-uuid-1', | ||
| (_req, res, ctx) => res(ctx.status(200), ctx.json({ status: 'success' })), | ||
| ), | ||
| ); | ||
|
|
||
| render(<SaveView />); | ||
|
|
||
| const deleteButton = await screen.findAllByTestId('delete-view'); | ||
| fireEvent.click(deleteButton[0]); | ||
|
|
||
| expect(await screen.findByText('delete_confirm_message')).toBeInTheDocument(); | ||
|
|
||
| const confirmButton = await screen.findByTestId('confirm-delete'); | ||
| fireEvent.click(confirmButton); | ||
|
|
||
| await waitFor(() => expect(screen.queryByText('Table View')).toBeNull()); | ||
| }); | ||
|
|
||
| it('should render empty state', async () => { | ||
| server.use( | ||
| rest.get('http://localhost/api/v1/explorer/views', (_req, res, ctx) => | ||
| res( | ||
| ctx.status(200), | ||
| ctx.json({ | ||
| status: 'success', | ||
| data: [], | ||
| }), | ||
| ), | ||
| ), | ||
| ); | ||
| render(<SaveView />); | ||
|
|
||
| expect(screen.getByText('No data')).toBeInTheDocument(); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters