mini-starter/packages/merchant-management-ui/tests/basic.test.tsx

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(
      <QueryClientProvider client={queryClient}>
        <MerchantManagement />
      </QueryClientProvider>
    );

    // 等待组件加载完成
    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();
    });
  });
});