import { describe, it, expect, afterEach, vi } from "vitest"; import { render, screen, cleanup, waitFor } from "@testing-library/react"; import DashboardPage from "@/app/dashboard/page"; export const pushMock = vi.fn(); vi.mock("next/navigation", () => { return { __esModule: true, useRouter: () => ({ push: pushMock }), }; }); afterEach(() => { cleanup(); vi.unstubAllGlobals(); vi.clearAllMocks(); }); describe("DashboardPage - GNB와 테마", () => { it("GNB에서 현재 페이지인 '대시보드' 탭에 aria-current=\"page\"가 설정되어야 한다", async () => { const overview = { summaryStats: { totalProjects: 0, totalSubmissions: 0, todaySubmissions: 0, last7DaysSubmissions: 0, }, projectStats: [], dailySubmissions: [], }; const fetchMock = vi.fn().mockResolvedValue( new Response(JSON.stringify(overview), { status: 200, headers: { "Content-Type": "application/json" }, }), ); vi.stubGlobal("fetch", fetchMock); render(); const dashboardLink = await screen.findByRole("link", { name: "대시보드" }); const projectsLink = await screen.findByRole("link", { name: "프로젝트 목록" }); const submissionsLink = await screen.findByRole("link", { name: "전체 제출 내역" }); expect(dashboardLink.getAttribute("href")).toBe("/dashboard"); expect(dashboardLink.getAttribute("aria-current")).toBe("page"); expect(projectsLink.getAttribute("aria-current")).toBeNull(); expect(submissionsLink.getAttribute("aria-current")).toBeNull(); }); it("헤더에 테마 전환 버튼이 있고 클릭 시 html 요소의 dark 클래스가 토글되어야 한다", async () => { const overview = { summaryStats: { totalProjects: 0, totalSubmissions: 0, todaySubmissions: 0, last7DaysSubmissions: 0, }, projectStats: [], dailySubmissions: [], }; const fetchMock = vi.fn().mockResolvedValue( new Response(JSON.stringify(overview), { status: 200, headers: { "Content-Type": "application/json" }, }), ); vi.stubGlobal("fetch", fetchMock); render(); const html = document.documentElement; html.classList.remove("dark"); const themeToggleButton = await screen.findByRole("button", { name: "테마 전환" }); expect(html.classList.contains("dark")).toBe(false); themeToggleButton.click(); expect(html.classList.contains("dark")).toBe(true); themeToggleButton.click(); expect(html.classList.contains("dark")).toBe(false); }); });