Fixed failing unit tests (#2580)

openmetadata-ui/src/main/resources/ui/src/components/MyData/MyData.test.tsx

@@ -14,13 +14,13 @@
 /* eslint-disable @typescript-eslint/camelcase */
 
 import {
-  findAllByTestId,
+  findAllByText,
   findByTestId,
   findByText,
   render,
 } from '@testing-library/react';
 import { SearchResponse } from 'Models';
-import React from 'react';
+import React, { ReactNode } from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { User } from '../../generated/entity/teams/user';
 import { formatDataResponse } from '../../utils/APIUtils';
@@ -234,10 +234,51 @@ jest.mock('../../components/recently-viewed/RecentlyViewed', () => {
   return jest.fn().mockReturnValue(<p>RecentlyViewed</p>);
 });
 
-jest.mock('../MyDataHeader/MyDataHeader.component', () => {
+jest.mock('../dropdown/DropDownList', () => {
-  return jest.fn().mockReturnValue(<p>MyDataHeader</p>);
+  return jest.fn().mockReturnValue(<p>DropDownList</p>);
 });
 
+jest.mock('../common/FeedCard/FeedCards.component', () => {
+  return jest.fn().mockReturnValue(<p>FeedCards</p>);
+});
+
+jest.mock('../MyAssetStats/MyAssetStats.component', () => {
+  return jest.fn().mockReturnValue(<p>MyAssetStats</p>);
+});
+
+jest.mock('../EntityList/EntityList', () => {
+  return jest.fn().mockReturnValue(<p>EntityList</p>);
+});
+
+jest.mock('../RecentSearchedTerms/RecentSearchedTerms', () => {
+  return jest.fn().mockReturnValue(<p>RecentSearchedTerms</p>);
+});
+
+jest.mock(
+  '../containers/PageLayout',
+  () =>
+    ({
+      children,
+      leftPanel,
+      rightPanel,
+    }: {
+      children: ReactNode;
+      rightPanel: ReactNode;
+      leftPanel: ReactNode;
+    }) =>
+      (
+        <div data-testid="PageLayout">
+          <div data-testid="left-panel-content">{leftPanel}</div>
+          <div data-testid="right-panel-content">{rightPanel}</div>
+          {children}
+        </div>
+      )
+);
+
+jest.mock('../../utils/EntityVersionUtils', () => ({
+  getFeedSummary: jest.fn().mockImplementation(() => <p>EntityVersionUtils</p>),
+}));
+
 jest.mock('../../utils/ServiceUtils', () => ({
   getAllServices: jest
     .fn()
@@ -278,16 +319,19 @@ describe('Test MyData page', () => {
         wrapper: MemoryRouter,
       }
     );
-    const pageContainer = await findByTestId(container, 'fluid-container');
+    const pageLayout = await findByTestId(container, 'PageLayout');
-    const searchData = await findByTestId(container, 'search-data');
+    const leftPanel = await findByTestId(container, 'left-panel-content');
-    const wrappedContent = await findByTestId(container, 'wrapped-content');
+    const rightPanel = await findByTestId(container, 'right-panel-content');
-    const tabs = await findAllByTestId(container, 'tab');
+    const recentSearchedTerms = await findByText(
-    const myDataHeader = await findByText(container, /MyDataHeader/i);
+      container,
+      /RecentSearchedTerms/i
+    );
+    const entityList = await findAllByText(container, /EntityList/i);
 
-    expect(pageContainer).toBeInTheDocument();
+    expect(pageLayout).toBeInTheDocument();
-    expect(searchData).toBeInTheDocument();
+    expect(leftPanel).toBeInTheDocument();
-    expect(wrappedContent).toBeInTheDocument();
+    expect(rightPanel).toBeInTheDocument();
-    expect(myDataHeader).toBeInTheDocument();
+    expect(recentSearchedTerms).toBeInTheDocument();
-    expect(tabs.length).toBe(3);
+    expect(entityList.length).toBe(2);
   });
 });

openmetadata-ui/src/main/resources/ui/src/components/UserDataCard/UserDataCard.test.tsx

@@ -11,7 +11,7 @@
  *  limitations under the License.
  */
 
-import { findByTestId, fireEvent, render } from '@testing-library/react';
+import { findByTestId, render } from '@testing-library/react';
 import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import UserDataCard from './UserDataCard';
@@ -32,19 +32,7 @@ jest.mock('../../components/common/avatar/Avatar', () => {
   return jest.fn().mockReturnValue(<p data-testid="avatar">Avatar</p>);
 });
 
-jest.mock('../../utils/SvgUtils', () => {
+describe('Test UserDataCard component', () => {
-  return {
-    __esModule: true,
-    default: jest.fn().mockReturnValue(<p data-testid="svg-icon">SVGIcons</p>),
-    Icons: {
-      TABLE: 'table',
-      TOPIC: 'topic',
-      DASHBOARD: 'dashboard',
-    },
-  };
-});
-
-describe('Test userCard component', () => {
   it('Component should render', async () => {
     const { container } = render(
       <UserDataCard item={mockItem} onClick={mockRemove} />,
@@ -70,36 +58,4 @@ describe('Test userCard component', () => {
 
     expect(await findByTestId(container, 'data-container')).toBeInTheDocument();
   });
-
-  it('If isActionVisible is passed it should show delete icon', async () => {
-    const { container } = render(
-      <UserDataCard item={mockItem} onClick={mockRemove} />,
-      {
-        wrapper: MemoryRouter,
-      }
-    );
-
-    const remove = await findByTestId(container, 'remove');
-
-    expect(remove).toBeInTheDocument();
-
-    fireEvent.click(remove);
-
-    expect(mockRemove).toBeCalled();
-  });
-
-  it('If dataset is provided, it should display accordingly', async () => {
-    const { container } = render(
-      <UserDataCard item={mockItem} onClick={mockRemove} />,
-      {
-        wrapper: MemoryRouter,
-      }
-    );
-
-    const svgIcon = await findByTestId(container, 'svg-icon');
-    const datasetLink = await findByTestId(container, 'dataset-link');
-
-    expect(svgIcon).toBeInTheDocument();
-    expect(datasetLink).toBeInTheDocument();
-  });
 });

openmetadata-ui/src/main/resources/ui/src/pages/login/index.test.tsx

@@ -28,14 +28,24 @@ jest.mock(
       <div data-testid="PageContainer">{children}</div>
 );
 
+jest.mock('../../assets/img/login-bg.jpeg', () => 'login-bg.jpeg');
+
+jest.mock('./LoginCarousel', () =>
+  jest.fn().mockReturnValue(<p>LoginCarousel</p>)
+);
+
 describe('Test SigninPage Component', () => {
   it('Component should render', async () => {
     const { container } = render(<SigninPage />, {
       wrapper: MemoryRouter,
     });
     const servicePage = await findByTestId(container, 'signin-page');
+    const bgImg = await findByTestId(container, 'bg-image');
+    const LoginCarousel = await findByText(container, /LoginCarousel/i);
 
     expect(servicePage).toBeInTheDocument();
+    expect(bgImg).toBeInTheDocument();
+    expect(LoginCarousel).toBeInTheDocument();
   });
 
   it('Sign in button should render', async () => {

openmetadata-ui/src/main/resources/ui/src/pages/login/index.tsx

@@ -74,7 +74,9 @@ const SigninPage = () => {
   }
 
   return (
-    <div className="tw-flex tw-bg-body-main tw-h-screen">
+    <div
+      className="tw-flex tw-bg-body-main tw-h-screen"
+      data-testid="signin-page">
       <div className="tw-w-5/12">
         <div className="tw-mt-52 tw-text-center">
           <SVGIcons alt="OpenMetadata Logo" icon={Icons.LOGO} width="152" />
@@ -89,7 +91,12 @@ const SigninPage = () => {
       </div>
       <div className="tw-w-7/12 tw-relative">
         <div className="tw-absolute tw-inset-0">
-          <img alt="bg-image" className="tw-w-full tw-h-screen" src={loginBG} />
+          <img
+            alt="bg-image"
+            className="tw-w-full tw-h-screen"
+            data-testid="bg-image"
+            src={loginBG}
+          />
         </div>
         <div className="tw-relative">
           <div className="tw-flex tw-justify-center tw-mt-44">

openmetadata-ui/src/main/resources/ui/src/pages/tags/index.test.tsx

@@ -14,6 +14,7 @@
 import {
   findAllByTestId,
   findByTestId,
+  findByText,
   fireEvent,
   render,
 } from '@testing-library/react';
@@ -78,23 +79,24 @@ jest.mock('../../utils/TagsUtils', () => ({
 }));
 
 jest.mock(
-  '../../components/containers/PageContainer',
+  '../../components/containers/PageLayout',
   () =>
-    ({
+    ({ children, leftPanel }: { children: ReactNode; leftPanel: ReactNode }) =>
-      children,
-      leftPanelContent,
-    }: {
-      children: ReactNode;
-      leftPanelContent: ReactNode;
-    }) =>
       (
-        <div data-testid="PageContainer">
+        <div data-testid="PageLayout">
-          <div data-testid="left-panel-content">{leftPanelContent}</div>
+          <div data-testid="left-panel-content">{leftPanel}</div>
           {children}
         </div>
       )
 );
 
+jest.mock(
+  '../../components/containers/PageContainerV1',
+  () =>
+    ({ children }: { children: ReactNode }) =>
+      <div data-testid="PageContainerV1">{children}</div>
+);
+
 jest.mock('../../components/common/non-admin-action/NonAdminAction', () => {
   return jest
     .fn()
@@ -121,6 +123,10 @@ jest.mock('../../components/Modals/FormModal', () => {
   return jest.fn().mockReturnValue(<p data-testid="form-modal">FormModal</p>);
 });
 
+jest.mock('../../components/common/description/Description', () => {
+  return jest.fn().mockReturnValue(<p>DescriptionComponent</p>);
+});
+
 jest.mock('../../components/common/non-admin-action/NonAdminAction', () => {
   return jest
     .fn()
@@ -135,7 +141,7 @@ describe('Test TagsPage page', () => {
     const tagsComponent = await findByTestId(container, 'tags-container');
     const pageContainerComponent = await findByTestId(
       container,
-      'PageContainer'
+      'PageContainerV1'
     );
     const leftPanelContent = await findByTestId(
       container,
@@ -202,10 +208,10 @@ describe('Test TagsPage page', () => {
       container,
       'description-container'
     );
-    const addDescription = await findByTestId(container, 'add-description');
+    const description = await findByText(container, /DescriptionComponent/i);
 
     expect(descriptionContainer).toBeInTheDocument();
-    expect(addDescription).toBeInTheDocument();
+    expect(description).toBeInTheDocument();
   });
 
   it('Table with respective header should be render', async () => {

openmetadata-ui/src/main/resources/ui/src/pages/teams/index.test.tsx

@@ -11,7 +11,12 @@
  *  limitations under the License.
  */
 
-import { findByTestId, fireEvent, render } from '@testing-library/react';
+import {
+  findByTestId,
+  findByText,
+  fireEvent,
+  render,
+} from '@testing-library/react';
 import React, { ReactNode } from 'react';
 import TeamsPage from './index';
 
@@ -25,17 +30,17 @@ const mockTeamsData = [
   },
   {
     description: '',
-    displayName: 'Cloud Infra',
+    displayName: 'Cloud Infra 2',
-    href: 'href1',
+    href: 'href2',
-    id: 'id1',
+    id: 'id2',
-    name: 'Cloud_Infra',
+    name: 'Cloud_Infra 2',
   },
   {
     description: '',
-    displayName: 'Cloud Infra',
+    displayName: 'Cloud Infra 3',
-    href: 'href1',
+    href: 'href3',
-    id: 'id1',
+    id: 'id3',
-    name: 'Cloud_Infra',
+    name: 'Cloud_Infra 3',
   },
 ];
 
@@ -86,7 +91,9 @@ jest.mock('../../axiosAPIs/teamsAPI', () => ({
     .mockImplementation(() => Promise.resolve({ data: mockDataTeamByName })),
   getTeams: jest
     .fn()
-    .mockImplementation(() => Promise.resolve({ data: mockTeamsData })),
+    .mockImplementation(() =>
+      Promise.resolve({ data: { data: mockTeamsData } })
+    ),
   patchTeamDetail: jest.fn(),
 }));
 
@@ -102,18 +109,19 @@ jest.mock('../../components/Modals/FormModal', () => {
 });
 
 jest.mock(
-  '../../components/containers/PageContainer',
+  '../../components/containers/PageContainerV1',
   () =>
-    ({
+    ({ children }: { children: ReactNode }) =>
-      children,
+      <div data-testid="PageContainer">{children}</div>
-      leftPanelContent,
+);
-    }: {
+
-      children: ReactNode;
+jest.mock(
-      leftPanelContent: ReactNode;
+  '../../components/containers/PageLayout',
-    }) =>
+  () =>
+    ({ children, leftPanel }: { children: ReactNode; leftPanel: ReactNode }) =>
       (
-        <div data-testid="PageContainer">
+        <div data-testid="page-layout">
-          <div data-testid="left-panel-content">{leftPanelContent}</div>
+          <div data-testid="left-panel-content">{leftPanel}</div>
           {children}
         </div>
       )
@@ -152,6 +160,10 @@ jest.mock('./UserCard', () => {
   return jest.fn().mockReturnValue(<div>UserCard</div>);
 });
 
+jest.mock('../../components/common/description/Description', () => {
+  return jest.fn().mockReturnValue(<div>Description</div>);
+});
+
 describe('Test Teams page', () => {
   it('Component should render', async () => {
     const { container } = render(<TeamsPage />);
@@ -220,12 +232,9 @@ describe('Test Teams page', () => {
       container,
       'description-container'
     );
-
+    const description = await findByText(container, /Description/i);
-    const description = await findByTestId(container, 'description');
-    const addDescription = await findByTestId(container, 'add-description');
 
     expect(descriptionContainer).toBeInTheDocument();
-    expect(addDescription).toBeInTheDocument();
     expect(description).toBeInTheDocument();
   });