From b7cd9d30b15c555c3969a0d10049dcf9ed813d37 Mon Sep 17 00:00:00 2001 From: Sparshagarwal29 Date: Fri, 26 Dec 2025 22:44:42 +0530 Subject: [PATCH 1/2] test(navbar): improve coverage for NavbarDesktop --- .../HomeComponents/Navbar/NavbarDesktop.tsx | 9 ++- .../Navbar/__tests__/NavbarDesktop.test.tsx | 55 +++++++++++++++++-- 2 files changed, 56 insertions(+), 8 deletions(-) diff --git a/frontend/src/components/HomeComponents/Navbar/NavbarDesktop.tsx b/frontend/src/components/HomeComponents/Navbar/NavbarDesktop.tsx index 9f25d774..d60fb237 100644 --- a/frontend/src/components/HomeComponents/Navbar/NavbarDesktop.tsx +++ b/frontend/src/components/HomeComponents/Navbar/NavbarDesktop.tsx @@ -16,8 +16,11 @@ import { DropdownMenuLabel, DropdownMenuTrigger, } from '@/components/ui/dropdown-menu'; -import { Avatar, AvatarFallback, AvatarImage } from '../../ui/avatar'; -import { ModeToggle } from '../../utils/ThemeModeToggle'; +// import { Avatar, AvatarFallback, AvatarImage } from '../../ui/avatar'; +// import { ModeToggle } from '../../utils/ThemeModeToggle'; +import { ModeToggle } from '@/components/utils/ThemeModeToggle'; +import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'; + import { buttonVariants } from '@/components/ui/button'; import { routeList, @@ -41,7 +44,7 @@ import { exportTasksAsTXT, } from '@/components/utils/ExportTasks'; import { useState } from 'react'; -import { DevLogs } from '../DevLogs/DevLogs'; +import { DevLogs } from '@/components/HomeComponents/DevLogs/DevLogs'; import { useTaskAutoSync } from '@/components/utils/TaskAutoSync'; import { Label } from '@/components/ui/label'; diff --git a/frontend/src/components/HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx b/frontend/src/components/HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx index d49f565b..e544ea81 100644 --- a/frontend/src/components/HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx +++ b/frontend/src/components/HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx @@ -1,8 +1,16 @@ +jest.mock('@/components/ui/slider', () => ({ + Slider: () =>
, +})); +jest.mock('@/components/ui/switch', () => ({ + Switch: ({ onCheckedChange }: any) => ( + + ), +})); import { render, screen } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; import { NavbarDesktop } from '../NavbarDesktop'; import { Props, routeList } from '../navbar-utils'; -// Mock external dependencies jest.mock('../navbar-utils', () => ({ deleteAllTasks: jest.fn(), handleLogout: jest.fn(), @@ -13,8 +21,17 @@ jest.mock('../navbar-utils', () => ({ { href: '#faq', label: 'FAQ' }, ], })); +jest.mock('@/components/HomeComponents/DevLogs/DevLogs', () => ({ + DevLogs: () =>
, +})); +jest.mock('@/components/utils/URLs', () => ({ + url: { + githubRepoURL: 'https://github.com/test/repo', + }, +})); const mockSetIsLoading = jest.fn(); + const mockProps: Props = { imgurl: 'http://example.com/image.png', email: 'test@example.com', @@ -34,7 +51,6 @@ describe('NavbarDesktop', () => { afterEach(() => { jest.clearAllMocks(); }); - it('renders the navigation links correctly', () => { render(); @@ -42,14 +58,43 @@ describe('NavbarDesktop', () => { expect(screen.getByText(route.label)).toBeInTheDocument(); }); }); + it('opens user menu and displays email', async () => { + render(); - it('displays user email and handles dropdown menu actions', () => { + const avatarFallback = screen.getByText('CN'); + await userEvent.click(avatarFallback); + + expect(screen.getAllByText('test@example.com')[0]).toBeInTheDocument(); + }); + it('opens github link when clicked', async () => { + const openSpy = jest.spyOn(window, 'open').mockImplementation(() => null); + + const user = userEvent.setup(); + render(); + + await user.click(screen.getByText('CN')); + await user.click(screen.getByText('GitHub')); + + expect(openSpy).toHaveBeenCalledWith( + 'https://github.com/test/repo', + '_blank' + ); + + openSpy.mockRestore(); + }); + it('shows slider when auto sync is enabled', async () => { + const user = userEvent.setup(); render(); + + await user.click(screen.getByText('CN')); + await user.click(screen.getByText('toggle')); + + expect(screen.getByTestId('sync-slider')).toBeInTheDocument(); }); }); -describe('NavbarDesktop component using snapshot', () => { - test('renders correctly', () => { +describe('NavbarDesktop snapshot', () => { + it('renders correctly', () => { const { asFragment } = render(); expect(asFragment()).toMatchSnapshot(); }); From 00b509d96cd7b6d772c510bae876cef0eb0e928e Mon Sep 17 00:00:00 2001 From: Sparshagarwal29 Date: Fri, 26 Dec 2025 22:53:18 +0530 Subject: [PATCH 2/2] test(navbar): improve NavbarDesktop testability and coverage --- .../src/components/HomeComponents/Navbar/NavbarDesktop.tsx | 3 +-- .../HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx | 1 + 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/components/HomeComponents/Navbar/NavbarDesktop.tsx b/frontend/src/components/HomeComponents/Navbar/NavbarDesktop.tsx index d60fb237..60908966 100644 --- a/frontend/src/components/HomeComponents/Navbar/NavbarDesktop.tsx +++ b/frontend/src/components/HomeComponents/Navbar/NavbarDesktop.tsx @@ -16,8 +16,7 @@ import { DropdownMenuLabel, DropdownMenuTrigger, } from '@/components/ui/dropdown-menu'; -// import { Avatar, AvatarFallback, AvatarImage } from '../../ui/avatar'; -// import { ModeToggle } from '../../utils/ThemeModeToggle'; + import { ModeToggle } from '@/components/utils/ThemeModeToggle'; import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'; diff --git a/frontend/src/components/HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx b/frontend/src/components/HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx index e544ea81..0235cb28 100644 --- a/frontend/src/components/HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx +++ b/frontend/src/components/HomeComponents/Navbar/__tests__/NavbarDesktop.test.tsx @@ -66,6 +66,7 @@ describe('NavbarDesktop', () => { expect(screen.getAllByText('test@example.com')[0]).toBeInTheDocument(); }); + it('opens github link when clicked', async () => { const openSpy = jest.spyOn(window, 'open').mockImplementation(() => null);