Files
no-whatever/src/app/profile/page.test.tsx
T

109 lines
2.6 KiB
TypeScript

import { describe, it, expect, vi, beforeEach } from "vitest";
import { render, screen, waitFor } from "@testing-library/react";
import React from "react";
import { ToastContext, type ToastContextValue } from "@/hooks/useToast";
vi.mock("next/navigation", () => ({
useRouter: () => ({
push: vi.fn(),
back: vi.fn(),
}),
}));
vi.mock("@/lib/userId", () => ({
getUserId: vi.fn().mockReturnValue("user-1"),
getCachedProfile: vi.fn().mockReturnValue({ id: "user-1", username: "testuser", avatar: "🐱" }),
setCachedProfile: vi.fn(),
setCachedPreferences: vi.fn(),
logout: vi.fn(),
}));
vi.mock("@/lib/avatars", () => ({
getAvatarBg: vi.fn().mockReturnValue("bg-amber-100"),
AVATARS: [
{ emoji: "🐱", bg: "bg-amber-100" },
{ emoji: "🐶", bg: "bg-orange-100" },
],
}));
vi.mock("@/components/ProfileFavoritesCard", () => ({
default: () => <div data-testid="favorites-card" />,
}));
const mockFetch = vi.fn();
vi.stubGlobal("fetch", mockFetch);
import ProfilePage from "./ProfileClient";
const toastCtx: ToastContextValue = { show: vi.fn() };
function renderPage() {
return render(
React.createElement(
ToastContext.Provider,
{ value: toastCtx },
React.createElement(ProfilePage, { initialUserId: "user-1" }),
),
);
}
beforeEach(() => {
vi.clearAllMocks();
mockFetch.mockResolvedValue({
ok: true,
json: () =>
Promise.resolve({
id: "user-1",
username: "testuser",
avatar: "🐱",
email: null,
achievements: {
totalDecisions: 5,
unanimousCount: 2,
roomsCreated: 3,
streak: 1,
},
records: [],
favorites: [],
}),
});
});
describe("ProfilePage", () => {
it("renders profile heading", async () => {
renderPage();
expect(await screen.findByText("个人中心")).toBeInTheDocument();
await waitFor(() => {
expect(mockFetch).toHaveBeenCalledWith(
"/api/user?id=user-1",
);
});
});
it("fetches user profile data with correct URL", async () => {
renderPage();
await waitFor(() => {
expect(mockFetch).toHaveBeenCalledWith(
"/api/user?id=user-1",
);
});
});
it("renders user info after data loads", async () => {
renderPage();
await waitFor(() => {
expect(screen.getByText("testuser")).toBeInTheDocument();
});
});
it("renders navigation element", async () => {
renderPage();
await waitFor(() => {
expect(mockFetch).toHaveBeenCalledWith(
"/api/user?id=user-1",
);
});
expect(screen.getByRole("navigation")).toBeInTheDocument();
});
});