From f6e5de350ce50ba3016f5578d279209a0d56674b Mon Sep 17 00:00:00 2001
From: Ashish Gupta <ashish@getcollate.io>
Date: Mon, 12 Feb 2024 11:35:43 +0530
Subject: [PATCH] added unit test for github star (#15134)

---
 .../GithubStarCard.component.tsx              |  16 +--
 .../GithubStarCard/GithubStarCard.test.tsx    | 130 ++++++++++++++++++
 2 files changed, 138 insertions(+), 8 deletions(-)
 create mode 100644 openmetadata-ui/src/main/resources/ui/src/components/GithubStarCard/GithubStarCard.test.tsx

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/GithubStarCard/GithubStarCard.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/GithubStarCard/GithubStarCard.component.tsx
index f5c9aa41f85..eb8f4f05203 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/GithubStarCard/GithubStarCard.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/GithubStarCard/GithubStarCard.component.tsx
@@ -43,16 +43,14 @@ const GithubStarCard = () => {
   const [starredCount, setStarredCount] = useState<number>(0);
   const [isLoading, setIsLoading] = useState<boolean>(true);
 
-  const loggedInUserName = useMemo(() => currentUser?.name, [currentUser]);
-
   const isWhatNewAlertVisible = useMemo(
     () => cookieStorage.getItem(COOKIE_VERSION) !== 'true',
     [cookieStorage]
   );
 
   const userCookieName = useMemo(
-    () => `${STAR_OMD_USER}_${loggedInUserName}`,
-    [loggedInUserName]
+    () => `${STAR_OMD_USER}_${currentUser?.name}`,
+    [currentUser?.name]
   );
 
   const isHomePage = useMemo(
@@ -89,12 +87,12 @@ const GithubStarCard = () => {
 
   const githubPopup = useCallback(
     (show: boolean) => {
-      if (loggedInUserName && show) {
+      if (currentUser?.name && show) {
         fetchOpenMetaData();
       }
       setShowGithubStarPopup(show);
     },
-    [loggedInUserName, userCookieName]
+    [currentUser?.name, userCookieName]
   );
 
   const updateGithubPopup = useCallback(
@@ -136,7 +134,7 @@ const GithubStarCard = () => {
           </Space>
           <Button
             className="flex-center m--t-xss"
-            data-testid="close-whats-new-alert"
+            data-testid="close-github-star-popup-card"
             icon={<CloseIcon color={BLACK_COLOR} height={12} width={12} />}
             type="text"
             onClick={handleClosePopup}
@@ -169,7 +167,9 @@ const GithubStarCard = () => {
             }}>
             <Button className="github-modal-action-button">
               {isLoading ? (
-                <Skeleton.Button active size="small" />
+                <div data-testid="skeleton-loader">
+                  <Skeleton.Button active size="small" />
+                </div>
               ) : (
                 starredCount
               )}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/GithubStarCard/GithubStarCard.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/GithubStarCard/GithubStarCard.test.tsx
new file mode 100644
index 00000000000..c6c332afbbc
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/GithubStarCard/GithubStarCard.test.tsx
@@ -0,0 +1,130 @@
+/*
+ *  Copyright 2024 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 { act, fireEvent, render, screen } from '@testing-library/react';
+import React from 'react';
+import { useLocation } from 'react-router-dom';
+import { TWO_MINUTE_IN_MILLISECOND } from '../../constants/constants';
+import GithubStarCard from './GithubStarCard.component';
+
+const mockLinkButton = jest.fn();
+
+jest.mock('react-router-dom', () => ({
+  useLocation: jest.fn().mockImplementation(() => ({ pathname: '/my-data' })),
+  Link: jest.fn().mockImplementation(({ children, ...rest }) => (
+    <a {...rest} onClick={mockLinkButton}>
+      {children}
+    </a>
+  )),
+}));
+
+jest.mock('../../utils/WhatsNewModal.util', () => ({
+  getReleaseVersionExpiry: jest.fn().mockImplementation(() => new Date()),
+}));
+
+jest.mock('../../rest/commonAPI', () => ({
+  getRepositoryData: jest.fn().mockImplementation(() =>
+    Promise.resolve({
+      stargazers_count: 10,
+    })
+  ),
+}));
+
+jest.mock('../Auth/AuthProviders/AuthProvider', () => ({
+  useAuthContext: jest.fn(() => ({
+    currentUser: {
+      name: 'admin',
+    },
+  })),
+}));
+
+describe('GithubStarCard', () => {
+  beforeEach(() => {
+    jest.useFakeTimers();
+  });
+
+  it('should render GithubStarCard', async () => {
+    await act(async () => {
+      render(<GithubStarCard />);
+      jest.advanceTimersByTime(TWO_MINUTE_IN_MILLISECOND);
+    });
+
+    expect(screen.getByTestId('github-star-popup-card')).toBeInTheDocument();
+    expect(
+      screen.getByText('message.star-on-github-description')
+    ).toBeInTheDocument();
+    expect(
+      screen.getByTestId('close-github-star-popup-card')
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole('button', { name: 'label.star' })
+    ).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: '10' })).toBeInTheDocument();
+  });
+
+  it('should render count badge in loading state', async () => {
+    await act(async () => {
+      render(<GithubStarCard />);
+    });
+    jest.advanceTimersByTime(TWO_MINUTE_IN_MILLISECOND);
+
+    expect(screen.getByTestId('skeleton-loader')).toBeInTheDocument();
+  });
+
+  it('check redirect buttons', async () => {
+    await act(async () => {
+      render(<GithubStarCard />);
+      jest.advanceTimersByTime(TWO_MINUTE_IN_MILLISECOND);
+    });
+
+    const starTextButton = screen.getByRole('button', { name: 'label.star' });
+
+    fireEvent.click(starTextButton);
+
+    const countButton = screen.getByRole('button', { name: '10' });
+
+    fireEvent.click(countButton);
+
+    expect(mockLinkButton).toHaveBeenCalledTimes(2);
+  });
+
+  it('should close the alert when the close button is clicked', async () => {
+    await act(async () => {
+      render(<GithubStarCard />);
+    });
+    jest.advanceTimersByTime(TWO_MINUTE_IN_MILLISECOND);
+
+    act(async () => {
+      fireEvent.click(screen.getByTestId('close-github-star-popup-card'));
+    });
+
+    expect(
+      screen.queryByTestId('github-star-popup-card')
+    ).not.toBeInTheDocument();
+  });
+
+  it('should not render card if not my-data page', async () => {
+    (useLocation as jest.Mock).mockImplementation(() => ({
+      pathname: '/',
+    }));
+
+    await act(async () => {
+      render(<GithubStarCard />);
+      jest.advanceTimersByTime(TWO_MINUTE_IN_MILLISECOND);
+    });
+
+    expect(
+      screen.queryByTestId('github-star-popup-card')
+    ).not.toBeInTheDocument();
+  });
+});