import { describe, it, expect, vi } from 'vitest'; import { render, screen, waitFor } from '@testing-library/react'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { MerchantManagement } from '../src/components/MerchantManagement'; // Mock API client vi.mock('../src/api/merchantClient', () => { const mockMerchantClient = { index: { $get: vi.fn(() => Promise.resolve({ status: 200, body: null, json: async () => ({ data: [], pagination: { total: 0, page: 1, limit: 10 } }) })), $post: vi.fn(() => Promise.resolve({ status: 201, body: null })), }, ':id': { $put: vi.fn(() => Promise.resolve({ status: 200, body: null })), $delete: vi.fn(() => Promise.resolve({ status: 204, body: null })), }, }; const mockMerchantClientManager = { get: vi.fn(() => mockMerchantClient), }; return { merchantClientManager: mockMerchantClientManager, merchantClient: mockMerchantClient, }; }); // Mock toast vi.mock('sonner', () => ({ toast: { success: vi.fn(() => {}), error: vi.fn(() => {}), }, })); const createTestQueryClient = () => new QueryClient({ defaultOptions: { queries: { retry: false, }, }, }); describe('商户管理基础测试', () => { it('应该正确渲染商户管理组件', async () => { const queryClient = createTestQueryClient(); render( ); // 等待组件加载完成 await waitFor(() => { // 验证组件标题 expect(screen.getByText('商户管理')).toBeInTheDocument(); expect(screen.getByText('商户列表')).toBeInTheDocument(); expect(screen.getByText('管理所有商户账户信息')).toBeInTheDocument(); // 验证创建按钮 expect(screen.getByText('创建商户')).toBeInTheDocument(); // 验证搜索框 expect(screen.getByPlaceholderText('搜索商户名称、用户名、手机号...')).toBeInTheDocument(); expect(screen.getByText('搜索')).toBeInTheDocument(); }); }); });