e4959d584f
主要更新： - 更新代理商端文档，明确项目由品牌方分配流程 - 新增Brief配置详情页(已配置)设计稿 - 完善工作台紧急待办中品牌新任务功能 - 整理Pencil设计文件中代理商端页面顺序 - 新增后端FastAPI框架及核心API - 新增前端Next.js页面和组件库 - 添加.gitignore排除构建和缓存文件 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
62 lines
2.1 KiB
TypeScript
62 lines
2.1 KiB
TypeScript
/**
|
|
* BottomNav 组件测试
|
|
* 测试覆盖: role 渲染、active 状态、基础样式
|
|
*/
|
|
import { render, screen } from '@testing-library/react';
|
|
import { describe, it, expect, beforeEach, vi } from 'vitest';
|
|
import { usePathname } from 'next/navigation';
|
|
import { BottomNav } from './BottomNav';
|
|
|
|
const mockedUsePathname = vi.mocked(usePathname);
|
|
|
|
describe('BottomNav', () => {
|
|
// ==================== 基础渲染测试 ====================
|
|
describe('基础渲染', () => {
|
|
it('渲染导航栏', () => {
|
|
const { container } = render(<BottomNav />);
|
|
expect(container.firstChild).toBeInTheDocument();
|
|
});
|
|
|
|
it('渲染所有导航项', () => {
|
|
render(<BottomNav role="creator" />);
|
|
expect(screen.getByText('任务')).toBeInTheDocument();
|
|
expect(screen.getByText('消息')).toBeInTheDocument();
|
|
expect(screen.getByText('我的')).toBeInTheDocument();
|
|
});
|
|
|
|
it('渲染图标', () => {
|
|
const { container } = render(<BottomNav />);
|
|
const icons = container.querySelectorAll('svg');
|
|
expect(icons.length).toBeGreaterThan(0);
|
|
});
|
|
});
|
|
|
|
// ==================== Active 状态测试 ====================
|
|
describe('Active 状态', () => {
|
|
beforeEach(() => {
|
|
mockedUsePathname.mockReturnValue('/creator/messages');
|
|
});
|
|
|
|
it('激活项使用高亮颜色', () => {
|
|
render(<BottomNav role="creator" />);
|
|
const activeLink = screen.getByText('消息').closest('a');
|
|
expect(activeLink).toHaveClass('text-text-primary');
|
|
});
|
|
|
|
it('非激活项使用次要颜色', () => {
|
|
render(<BottomNav role="creator" />);
|
|
const inactiveLink = screen.getByText('任务').closest('a');
|
|
expect(inactiveLink).toHaveClass('text-text-secondary');
|
|
});
|
|
});
|
|
|
|
// ==================== 样式测试 ====================
|
|
describe('样式', () => {
|
|
it('固定定位在底部', () => {
|
|
const { container } = render(<BottomNav />);
|
|
const root = container.firstChild as HTMLElement;
|
|
expect(root).toHaveClass('fixed', 'bottom-0', 'left-0', 'right-0');
|
|
});
|
|
});
|
|
});
|