src/test/category/MusicCategory.test.tsx

import { render, screen } from '@testing-library/react';
import MusicCategory from '../../feature/categories/MusicCategory';
import { Provider } from 'react-redux';
import { store } from '../../store/store';
import { MemoryRouter } from 'react-router';

describe('MusicCategory Component', () => {
  it('renders music category page with search, filters and music cards', () => {
    render(
      <MemoryRouter>
        <Provider store={store}>
          <MusicCategory />
        </Provider>
      </MemoryRouter>
    );

    // 验证标题和描述
    expect(screen.getByText('音乐资源分区')).toBeInTheDocument();
    expect(screen.getByText('高质量音乐资源共享，保持分享率，共建良好PT环境')).toBeInTheDocument();
    
    // 验证搜索框
    const searchInput = screen.getByPlaceholderText('搜索音乐名称或艺术家');
    expect(searchInput).toBeInTheDocument();
    
    // 验证音质筛选
    expect(screen.getByText('音质筛选：')).toBeInTheDocument();
    expect(screen.getByText('全部')).toBeInTheDocument();
    expect(screen.getByText('FLAC')).toBeInTheDocument();
    
    // 验证分类标签
    expect(screen.getByText('欧美流行 (15)')).toBeInTheDocument();
    expect(screen.getByText('华语流行 (23)')).toBeInTheDocument();
    
    // 验证音乐卡片
    expect(screen.getByText('Blinding Lights')).toBeInTheDocument();
    expect(screen.getByText('Bohemian Rhapsody')).toBeInTheDocument();
  });
});