diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Modals/ConfirmationModal/ConfirmationModal.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Modals/ConfirmationModal/ConfirmationModal.test.tsx index 6aa1df7a574..edd5222e24f 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Modals/ConfirmationModal/ConfirmationModal.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Modals/ConfirmationModal/ConfirmationModal.test.tsx @@ -58,4 +58,26 @@ describe('Test Ingestion modal component', () => { expect(mockConfirmation).toBeCalled(); }); + + it('waiting', () => { + const { getByTestId } = render( + + ); + const loader = getByTestId('loading-button'); + + expect(loader).toBeInTheDocument(); + }); }); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.test.tsx index 64a33f8dd3d..183c2fd0738 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.test.tsx @@ -11,23 +11,29 @@ * limitations under the License. */ -import { findByTestId, render } from '@testing-library/react'; +import { fireEvent, render } from '@testing-library/react'; import React from 'react'; import { MemoryRouter } from 'react-router-dom'; -import UserDataCard from './UserDataCard'; +import { act } from 'react-test-renderer'; +import UserDataCard, { Item, Props } from './UserDataCard'; -const mockItem = { +const onClick = jest.fn(); +const onDelete = jest.fn(); + +const mockItem: Item = { displayName: 'description1', name: 'name1', - id: 'id1', email: 'string@email.com', isActiveUser: true, profilePhoto: '', teamCount: 'Cloud_Infra', }; -const mockSelect = jest.fn(); -const mockDelete = jest.fn(); +const mockProp: Props = { + item: mockItem, + onClick, + onDelete, +}; jest.mock('../../authentication/auth-provider/AuthProvider', () => { return { @@ -57,38 +63,69 @@ jest.mock('../../utils/SvgUtils', () => { }; }); +jest.mock('../common/non-admin-action/NonAdminAction', () => { + return jest.fn().mockImplementation(({ children }) => { + return ( +
+ NonAdminAction + {children} +
+ ); + }); +}); + describe('Test UserDataCard component', () => { it('Component should render', async () => { - const { container } = render( - , + const { findByTestId, findByText } = render( + , { wrapper: MemoryRouter, } ); - const cardContainer = await findByTestId(container, 'user-card-container'); - const avatar = await findByTestId(container, 'profile-picture'); + const cardContainer = await findByTestId('user-card-container'); + const avatar = await findByTestId('profile-picture'); + const userDisplayName = await findByText(mockItem.displayName); expect(avatar).toBeInTheDocument(); expect(cardContainer).toBeInTheDocument(); + + act(() => { + fireEvent.click(userDisplayName); + }); + + expect(onClick).toBeCalled(); }); it('Data should render', async () => { - const { container } = render( - , - { - wrapper: MemoryRouter, - } + const { findByTestId } = render(, { + wrapper: MemoryRouter, + }); + + expect(await findByTestId('data-container')).toBeInTheDocument(); + }); + + it('Inacive status should be shown for deleted user', () => { + const { getByText } = render( + ); - expect(await findByTestId(container, 'data-container')).toBeInTheDocument(); + expect(getByText('Inactive')).toBeInTheDocument(); + }); + + it('User should get removed when deleted', async () => { + const { queryByText, getByTestId } = render( + + ); + const removeButton = getByTestId('remove'); + + expect(queryByText(mockItem.displayName)).toBeInTheDocument(); + expect(removeButton).toBeInTheDocument(); + + act(() => { + fireEvent.click(removeButton); + }); + + expect(onDelete).toHaveBeenCalledWith('id1', mockItem.displayName); }); }); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.tsx b/openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.tsx index 47ce78d155d..5b227e32ca8 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.tsx @@ -18,7 +18,7 @@ import SVGIcons, { Icons } from '../../utils/SvgUtils'; import NonAdminAction from '../common/non-admin-action/NonAdminAction'; import ProfilePicture from '../common/ProfilePicture/ProfilePicture'; -type Item = { +export type Item = { displayName: string; name: string; id?: string; @@ -28,7 +28,7 @@ type Item = { teamCount?: string | JSX.Element; }; -type Props = { +export type Props = { item: Item; showTeams?: boolean; onClick?: (value: string) => void; @@ -42,9 +42,9 @@ const UserDataCard = ({ item, onClick, onDelete, showTeams = true }: Props) => { data-testid="user-card-container">
{ }}> {item.displayName}

- {!item?.isActiveUser && ( + {!item.isActiveUser && ( Inactive @@ -81,7 +81,7 @@ const UserDataCard = ({ item, onClick, onDelete, showTeams = true }: Props) => { onClick={(e) => { e.preventDefault(); e.stopPropagation(); - onDelete(item.id as string, item.displayName); + onDelete?.(item.id as string, item.displayName); }}> ({ + useHistory: () => ({ + push: jest.fn(), + }), +})); + +jest.mock('../common/error-with-placeholder/ErrorPlaceHolder', () => { + return jest.fn().mockReturnValue(

ErrorPlaceHolder

); +}); + +jest.mock('../common/next-previous/NextPrevious', () => { + return jest.fn().mockReturnValue(

NextPrevious

); +}); + +jest.mock('../common/popover/PopOver', () => { + return jest.fn().mockReturnValue(

PopOver

); +}); + +jest.mock('../common/searchbar/Searchbar', () => { + return jest.fn().mockReturnValue(

Searchbar

); +}); + +jest.mock('../Loader/Loader', () => { + return jest.fn().mockReturnValue(

Loader

); +}); + +jest.mock('../Modals/ConfirmationModal/ConfirmationModal', () => { + return jest.fn().mockReturnValue(

ConfirmationModal

); +}); + +jest.mock('../UserDataCard/UserDataCard', () => { + return jest.fn().mockImplementation(({ onClick, onDelete }) => ( + <> +

UserDataCard

+

onClick(mockSelectedUserList[1].name)}> + handleUserRedirection +

+

+ onDelete( + mockSelectedUserList[1].id, + mockSelectedUserList[1].displayName + ) + }> + handleDeleteUserModal +

+ + )); +}); + +describe('Test UserDetails component', () => { + it('Checking if loader is diplaying properly while loading the user list', () => { + const { getByText } = render(); + + const loader = getByText('Loader'); + + expect(loader).toBeInTheDocument(); + }); + + it('Checking if all the components are rendering properly after getting list of users', () => { + const { getByText, getAllByText } = render(); + + const searchBar = getByText('Searchbar'); + const userDataCard = getAllByText('UserDataCard'); + const nextPrevious = getByText('NextPrevious'); + const handleUserRedirection = getAllByText('handleUserRedirection'); + + expect(searchBar).toBeInTheDocument(); + expect(userDataCard.length).toBe(3); + expect(nextPrevious).toBeInTheDocument(); + + act(() => { + fireEvent.click(handleUserRedirection[0]); + }); + }); + + it('Checking if conformationModal is showing after delete button clicked', () => { + const { getAllByText, queryByText } = render( + + ); + + const userDataCard = getAllByText('UserDataCard'); + const handleDeleteUserModal = getAllByText('handleDeleteUserModal'); + + expect(userDataCard.length).toBe(3); + + expect(queryByText('ConfirmationModal')).toBeNull(); + + act(() => { + fireEvent.click(handleDeleteUserModal[0]); + }); + + expect(queryByText('ConfirmationModal')).toBeInTheDocument(); + }); + + it('Checking if Error is displayed when no users present', () => { + const { getByText } = render( + + ); + + const errorPlaceHolder = getByText('ErrorPlaceHolder'); + + expect(errorPlaceHolder).toBeInTheDocument(); + }); +}); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/UserDetails/UserDetails.tsx b/openmetadata-ui/src/main/resources/ui/src/components/UserDetails/UserDetails.tsx index eac06c01ba6..7a203a3ee41 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/UserDetails/UserDetails.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/UserDetails/UserDetails.tsx @@ -26,7 +26,7 @@ import Loader from '../Loader/Loader'; import ConfirmationModal from '../Modals/ConfirmationModal/ConfirmationModal'; import UserDataCard from '../UserDataCard/UserDataCard'; -type UserDetailsProps = { +export type UserDetailsProps = { selectedUserList: User[]; handleUserSearchTerm: (value: string) => void; userSearchTerm: string; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/ProfilePicture/ProfilePicture.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/ProfilePicture/ProfilePicture.test.tsx index f0fa4147ea0..34162317275 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/ProfilePicture/ProfilePicture.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/ProfilePicture/ProfilePicture.test.tsx @@ -48,7 +48,15 @@ afterAll(() => { describe('Test ProfilePicture component', () => { it('ProfilePicture component should render with Avatar', async () => { - const { container } = render(); + const { container } = render( + + ); const avatar = await findByText(container, 'Avatar'); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/avatar/Avatar.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/avatar/Avatar.test.tsx new file mode 100644 index 00000000000..442eff20ac7 --- /dev/null +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/avatar/Avatar.test.tsx @@ -0,0 +1,42 @@ +/* + * Copyright 2022 Collate + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { render } from '@testing-library/react'; +import React from 'react'; +import Avatar from './Avatar'; + +describe('Test for Avatar component', () => { + it('Component should render avatar properly', () => { + const { getByTestId } = render(); + + const avatar = getByTestId('avatar'); + + expect(avatar).toBeInTheDocument(); + }); + + it('Component should render avatar properly for type circle', () => { + const { getByTestId } = render( + + ); + + const avatar = getByTestId('avatar'); + + expect(avatar).toBeInTheDocument(); + }); +}); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/avatar/Avatar.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/avatar/Avatar.tsx index 983abe9d114..1cd46f9b321 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/avatar/Avatar.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/avatar/Avatar.tsx @@ -37,6 +37,7 @@ const Avatar = ({ 'tw-flex tw-flex-shrink-0 tw-justify-center tw-items-center tw-align-middle', className )} + data-testid="avatar" style={{ height: `${width}px`, width: `${width}px`, diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolder.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolder.test.tsx index 6bb1d6b47d1..6380e944164 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolder.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolder.test.tsx @@ -11,15 +11,20 @@ * limitations under the License. */ -import { getByTestId, render } from '@testing-library/react'; +import { getByTestId, getByText, render } from '@testing-library/react'; import React from 'react'; import ErrorPlaceHolder from './ErrorPlaceHolder'; describe('Test Error place holder Component', () => { it('Component should render', () => { - const { container } = render(); + const { container } = render( + +

Children1

+ + ); expect(getByTestId(container, 'error')).toBeInTheDocument(); expect(getByTestId(container, 'no-data-image')).toBeInTheDocument(); + expect(getByText(container, 'Children1')).toBeInTheDocument(); }); }); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolderES.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolderES.test.tsx index 61bb37ec699..21344db266e 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolderES.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolderES.test.tsx @@ -15,6 +15,14 @@ import { getByTestId, getByText, render } from '@testing-library/react'; import React from 'react'; import ErrorPlaceHolderES from './ErrorPlaceHolderES'; +jest.mock('../../../AppState', () => ({ + userDetails: { + name: 'testUser', + displayName: 'Test User', + }, + users: [{ name: 'user1', displayName: 'User1DN' }], +})); + jest.mock('../../../authentication/auth-provider/AuthProvider', () => { return { useAuthContext: jest.fn(() => ({ @@ -26,15 +34,6 @@ jest.mock('../../../authentication/auth-provider/AuthProvider', () => { }; }); -jest.mock('../../../AppState', () => - jest.fn().mockReturnValue({ - users: [], - userDetails: { - displayName: 'Test User', - }, - }) -); - const mockErrorMessage = 'An exception with message [Elasticsearch exception [type=index_not_found_exception, reason=no such index [test_search_index]]] was thrown while processing request.'; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/next-previous/NextPrevious.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/next-previous/NextPrevious.test.tsx index ffec789288f..d1b306c4d5a 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/next-previous/NextPrevious.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/next-previous/NextPrevious.test.tsx @@ -11,8 +11,9 @@ * limitations under the License. */ -import { render } from '@testing-library/react'; +import { fireEvent, render } from '@testing-library/react'; import React from 'react'; +import { act } from 'react-test-renderer'; import { PAGE_SIZE } from '../../../constants/constants'; import NextPrevious from './NextPrevious'; @@ -223,4 +224,39 @@ describe('Test Pagination Component', () => { expect(pageIndicator).toHaveTextContent(`${totalPage}/${totalPage} Page`); }); + + it('On clicking Previous and Next button respective pages should be rendered', () => { + const paging = { + before: 'test', + after: '', + total: PAGE_SIZE * 2, + }; + + const totalPage = computeTotalPages(PAGE_SIZE, PAGE_SIZE * 2); + + const { getByTestId } = render( + + ); + const nextButton = getByTestId('next'); + const prevButton = getByTestId('previous'); + + act(() => { + fireEvent.click(prevButton); + }); + + expect(mockCallback).toHaveBeenCalledTimes(1); + + act(() => { + fireEvent.click(nextButton); + }); + + expect(mockCallback).toHaveBeenCalledTimes(2); + }); }); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/non-admin-action/NonAdminAction.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/non-admin-action/NonAdminAction.test.tsx index a8dbdda84c3..08266804990 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/non-admin-action/NonAdminAction.test.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/non-admin-action/NonAdminAction.test.tsx @@ -11,8 +11,9 @@ * limitations under the License. */ -import { findByTestId, render } from '@testing-library/react'; +import { findByTestId, fireEvent, render } from '@testing-library/react'; import React from 'react'; +import { act } from 'react-test-renderer'; import NonAdminAction from './NonAdminAction'; const mockAuth = { @@ -66,13 +67,23 @@ describe('Test AddUsersModal component', () => { mockAuth.userPermissions.UpdateOwner = false; const { container } = render( - + ); const popover = await findByTestId(container, 'popover'); + const testButton = await findByTestId(container, 'test-button'); expect(popover).toBeInTheDocument(); + + act(() => { + fireEvent.click(testButton); + }); }); }); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/popover/PopOver.test.js b/openmetadata-ui/src/main/resources/ui/src/components/common/popover/PopOver.test.jsx similarity index 91% rename from openmetadata-ui/src/main/resources/ui/src/components/common/popover/PopOver.test.js rename to openmetadata-ui/src/main/resources/ui/src/components/common/popover/PopOver.test.jsx index f23c726ee8c..a07ae814dd1 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/popover/PopOver.test.js +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/popover/PopOver.test.jsx @@ -35,7 +35,16 @@ global.document.createRange = () => ({ describe('Test Popover Component', () => { it('Component should render', () => { const { container } = render( - + Hello World ); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/searchbar/Searchbar.test.js b/openmetadata-ui/src/main/resources/ui/src/components/common/searchbar/Searchbar.test.js index b3a12603870..e0cb5558c27 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/searchbar/Searchbar.test.js +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/searchbar/Searchbar.test.js @@ -36,13 +36,20 @@ describe('Test Searchbar Component', () => { it('Renders the user typed text when a change event is fired', () => { const onSearch = jest.fn(); - const { container } = render(); + const { container, getByText } = render( + + ); const searchElement = getByTestId(container, 'searchbar'); expect(searchElement.value).toBe(''); + expect(getByText('Test Label')).toBeInTheDocument(); + + fireEvent.focus(searchElement); fireEvent.change(searchElement, { target: { value: 'Test Search' } }); + fireEvent.blur(searchElement); + expect(searchElement.value).toBe('Test Search'); });