/** * Tests for HeroSection component */ import { render, screen, fireEvent } from '@testing-library/react'; import { HeroSection } from '@/components/home/HeroSection'; // Mock framer-motion jest.mock('framer-motion', () => ({ motion: { div: ({ children, ...props }: any) =>
{children}
, h1: ({ children, ...props }: any) =>

{children}

, p: ({ children, ...props }: any) =>

{children}

, }, })); // Mock Next.js Link jest.mock('next/link', () => ({ __esModule: true, default: ({ children, href, ...props }: any) => { return ( {children} ); }, })); // Mock DemoCredentialsModal jest.mock('@/components/home/DemoCredentialsModal', () => ({ DemoCredentialsModal: ({ open, onClose }: any) => open ? (
) : null, })); describe('HeroSection', () => { it('renders badge with key highlights', () => { render( ); expect(screen.getByText('MIT Licensed')).toBeInTheDocument(); expect(screen.getByText('OAuth 2.0 + i18n')).toBeInTheDocument(); expect(screen.getByText('Pragmatic by Design')).toBeInTheDocument(); }); it('renders main headline', () => { render( ); expect(screen.getByText(/The Pragmatic/i)).toBeInTheDocument(); expect(screen.getByText(/Full-Stack Template/i)).toBeInTheDocument(); }); it('renders subheadline with key messaging', () => { render( ); expect(screen.getByText(/Opinionated, secure, and production-ready/i)).toBeInTheDocument(); expect(screen.getByText(/Start building features on day one/i)).toBeInTheDocument(); }); it('renders Try Live Demo button', () => { render( ); const demoButton = screen.getByRole('button', { name: /try live demo/i }); expect(demoButton).toBeInTheDocument(); }); it('renders View on GitHub link', () => { render( ); const githubLink = screen.getByRole('link', { name: /view on github/i }); expect(githubLink).toHaveAttribute('href', 'https://github.com/cardosofelipe/pragma-stack.git'); expect(githubLink).toHaveAttribute('target', '_blank'); expect(githubLink).toHaveAttribute('rel', 'noopener noreferrer'); }); it('renders Explore Components link', () => { render( ); const componentsLink = screen.getByRole('link', { name: /explore components/i }); expect(componentsLink).toHaveAttribute('href', '/dev'); }); it('calls onOpenDemoModal when Try Live Demo button is clicked', () => { const mockOnOpenDemoModal = jest.fn(); render(); const demoButton = screen.getByRole('button', { name: /try live demo/i }); fireEvent.click(demoButton); expect(mockOnOpenDemoModal).toHaveBeenCalledTimes(1); }); describe('Accessibility', () => { it('has proper heading hierarchy', () => { render( ); const heading = screen.getAllByRole('heading', { level: 1 })[0]; expect(heading).toBeInTheDocument(); }); it('has proper external link attributes', () => { render( ); const githubLink = screen.getByRole('link', { name: /view on github/i }); expect(githubLink).toHaveAttribute('target', '_blank'); expect(githubLink).toHaveAttribute('rel', 'noopener noreferrer'); }); }); });