lanyuanxiaoyao
870004af23
- 重构 AppLayout 为可折叠侧边栏导航布局 - 实现统计仪表盘：统计摘要卡片 + 请求趋势图表 - Provider 页面使用 Card 包裹优化视觉层次 - 主题切换按钮移至侧边栏底部，支持折叠态 - Header 适配暗色主题，添加分隔线优化视觉过渡 - 添加全局样式重置（SCSS） - 完善组件测试和 E2E 测试覆盖 - 同步 OpenSpec 规范到主 specs
60 lines
1.5 KiB
TypeScript
60 lines
1.5 KiB
TypeScript
import { render, screen } from '@testing-library/react';
|
|
import { describe, it, expect, vi } from 'vitest';
|
|
import { UsageChart } from '@/pages/Stats/UsageChart';
|
|
import type { UsageStats } from '@/types';
|
|
|
|
vi.mock('@ant-design/charts', () => ({
|
|
Line: vi.fn(() => <div data-testid="mock-line-chart" />),
|
|
}));
|
|
|
|
const mockStats: UsageStats[] = [
|
|
{
|
|
id: '1',
|
|
providerId: 'openai',
|
|
modelName: 'gpt-4o',
|
|
requestCount: 100,
|
|
date: '2024-01-01',
|
|
},
|
|
{
|
|
id: '2',
|
|
providerId: 'openai',
|
|
modelName: 'gpt-3.5-turbo',
|
|
requestCount: 200,
|
|
date: '2024-01-01',
|
|
},
|
|
{
|
|
id: '3',
|
|
providerId: 'anthropic',
|
|
modelName: 'claude-3',
|
|
requestCount: 150,
|
|
date: '2024-01-02',
|
|
},
|
|
];
|
|
|
|
describe('UsageChart', () => {
|
|
it('renders chart title', () => {
|
|
render(<UsageChart stats={mockStats} />);
|
|
|
|
expect(screen.getByText('请求趋势')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders with data', () => {
|
|
const { container } = render(<UsageChart stats={mockStats} />);
|
|
|
|
expect(container.querySelector('.ant-card')).toBeInTheDocument();
|
|
expect(screen.getByTestId('mock-line-chart')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders empty state when no data', () => {
|
|
render(<UsageChart stats={[]} />);
|
|
|
|
expect(screen.getByText('暂无数据')).toBeInTheDocument();
|
|
});
|
|
|
|
it('aggregates data by date correctly', () => {
|
|
const { container } = render(<UsageChart stats={mockStats} />);
|
|
|
|
expect(container.querySelector('.ant-card')).toBeInTheDocument();
|
|
});
|
|
});
|