雨霖铃
9097c48b1f
- 新增 dashboardFeatures.ts 和 useDashboard.ts 文件，封装仪表板功能的解析和状态管理逻辑。 - 更新 Dashboard 组件，使用 useDashboard 钩子简化可见工具和最近使用工具的处理。 - 添加仪表板功能的单元测试，确保功能正确性。 - 更新 README.md，移除不再使用的 ToolCard 组件说明。
79 lines
2.3 KiB
TypeScript
79 lines
2.3 KiB
TypeScript
import { renderHook } from '@testing-library/react';
|
|
import { describe, it, expect, vi, beforeEach } from 'vitest';
|
|
import { useRouter } from '@/providers/RouterProvider';
|
|
import { useDashboard } from '../useDashboard';
|
|
import type { PageType } from '@/types/storage';
|
|
|
|
vi.mock('@/providers/RouterProvider', () => ({
|
|
useRouter: vi.fn(),
|
|
}));
|
|
|
|
const mockNavigateTo = vi.fn();
|
|
|
|
function mockRouterState(
|
|
overrides: {
|
|
visiblePages?: PageType[];
|
|
pageOrder?: PageType[];
|
|
recentlyUsedTools?: PageType[];
|
|
} = {},
|
|
) {
|
|
vi.mocked(useRouter).mockReturnValue({
|
|
currentPage: 'dashboard',
|
|
visiblePages: overrides.visiblePages ?? ['dashboard', 'timestamp', 'jwt'],
|
|
pageOrder: overrides.pageOrder ?? ['jwt', 'timestamp'],
|
|
recentlyUsedTools: overrides.recentlyUsedTools ?? [],
|
|
isLoaded: true,
|
|
navigateTo: mockNavigateTo,
|
|
goHome: vi.fn(),
|
|
setVisiblePages: vi.fn(),
|
|
setPageOrder: vi.fn(),
|
|
});
|
|
}
|
|
|
|
describe('useDashboard', () => {
|
|
beforeEach(() => {
|
|
vi.clearAllMocks();
|
|
});
|
|
|
|
it('应透传 router 中的 navigateTo', () => {
|
|
mockRouterState();
|
|
|
|
const { result } = renderHook(() => useDashboard());
|
|
|
|
expect(result.current.navigateTo).toBe(mockNavigateTo);
|
|
});
|
|
|
|
it('recentlyUsedTools 有可见工具时应显示最近使用', () => {
|
|
mockRouterState({
|
|
visiblePages: ['dashboard', 'timestamp', 'jwt'],
|
|
recentlyUsedTools: ['timestamp', 'jwt'],
|
|
});
|
|
|
|
const { result } = renderHook(() => useDashboard());
|
|
|
|
expect(result.current.showRecent).toBe(true);
|
|
expect(result.current.recentFeatures.map((item) => item.key)).toEqual(['timestamp', 'jwt']);
|
|
});
|
|
|
|
it('recentlyUsedTools 为空时不应显示最近使用', () => {
|
|
mockRouterState({ recentlyUsedTools: [] });
|
|
|
|
const { result } = renderHook(() => useDashboard());
|
|
|
|
expect(result.current.showRecent).toBe(false);
|
|
expect(result.current.recentFeatures).toEqual([]);
|
|
});
|
|
|
|
it('最近使用中的不可见工具应被过滤', () => {
|
|
mockRouterState({
|
|
visiblePages: ['dashboard', 'timestamp'],
|
|
recentlyUsedTools: ['jwt', 'timestamp'],
|
|
});
|
|
|
|
const { result } = renderHook(() => useDashboard());
|
|
|
|
expect(result.current.showRecent).toBe(true);
|
|
expect(result.current.recentFeatures.map((item) => item.key)).toEqual(['timestamp']);
|
|
});
|
|
});
|