张翔
87 lines
2.6 KiB
TypeScript
87 lines
2.6 KiB
TypeScript
import { describe, it, expect, beforeEach, jest } from '@jest/globals';
|
|
import { render, screen } from '@testing-library/react';
|
|
import '@testing-library/jest-dom';
|
|
import { InsightsSection } from './insights-section';
|
|
|
|
jest.mock('@/components/ui/insight-card', () => ({
|
|
InsightCard: ({ title, category }: any) => (
|
|
<div data-testid="insight-card">
|
|
<div>{title}</div>
|
|
<div>{category}</div>
|
|
</div>
|
|
),
|
|
}));
|
|
|
|
describe('InsightsSection', () => {
|
|
beforeEach(() => {
|
|
jest.clearAllMocks();
|
|
});
|
|
|
|
describe('Rendering', () => {
|
|
it('should render insights section', () => {
|
|
render(<InsightsSection />);
|
|
const section = document.querySelector('section#insights');
|
|
expect(section).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render section heading', () => {
|
|
render(<InsightsSection />);
|
|
expect(screen.getByRole('heading', { level: 2 })).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render section description', () => {
|
|
render(<InsightsSection />);
|
|
expect(screen.getByText(/分享前沿技术趋势/)).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render insight cards', () => {
|
|
render(<InsightsSection />);
|
|
const cards = screen.getAllByTestId('insight-card');
|
|
expect(cards.length).toBeGreaterThan(0);
|
|
});
|
|
|
|
it('should render insight titles', () => {
|
|
render(<InsightsSection />);
|
|
expect(screen.getByText('2025年技术趋势：AI驱动的数字化转型')).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render insight categories', () => {
|
|
render(<InsightsSection />);
|
|
expect(screen.getByText('技术趋势')).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render view all button', () => {
|
|
render(<InsightsSection />);
|
|
expect(screen.getByText('查看全部洞察')).toBeInTheDocument();
|
|
});
|
|
});
|
|
|
|
describe('Accessibility', () => {
|
|
it('should have section id', () => {
|
|
render(<InsightsSection />);
|
|
const section = document.querySelector('section#insights');
|
|
expect(section).toBeInTheDocument();
|
|
});
|
|
});
|
|
|
|
describe('Styling', () => {
|
|
it('should have correct background', () => {
|
|
render(<InsightsSection />);
|
|
const section = document.querySelector('section.bg-\\[\\#FAFAFA\\]');
|
|
expect(section).toBeInTheDocument();
|
|
});
|
|
|
|
it('should have container', () => {
|
|
render(<InsightsSection />);
|
|
const container = document.querySelector('.container-wide');
|
|
expect(container).toBeInTheDocument();
|
|
});
|
|
|
|
it('should have grid layout', () => {
|
|
render(<InsightsSection />);
|
|
const grid = document.querySelector('.grid');
|
|
expect(grid).toBeInTheDocument();
|
|
});
|
|
});
|
|
});
|