import { describe, it, expect } from 'vitest';
import { render, screen } from '@testing-library/svelte';
import PageHeader from './PageHeader.svelte';

describe('PageHeader', () => {
	it('renders title', () => {
		render(PageHeader, { props: { title: 'Test Page' } });
		expect(screen.getByText('Test Page')).toBeInTheDocument();
	});

	it('renders description when provided', () => {
		render(PageHeader, { 
			props: { 
				title: 'Test Page', 
				description: 'This is a test description' 
			} 
		});
		expect(screen.getByText('This is a test description')).toBeInTheDocument();
	});

	it('does not render description when not provided', () => {
		const { container } = render(PageHeader, { props: { title: 'Test Page' } });
		expect(container.querySelector('p')).not.toBeInTheDocument();
	});

	it('renders action buttons via children snippet', () => {
		const { container } = render(PageHeader, { 
			props: { 
				title: 'Test Page'
			}
		});
		
		// The component should have a slot for children
		expect(container.querySelector('.page-header')).toBeInTheDocument();
	});
});