import { describe, it, expect } from 'vitest';
import { render } from '@testing-library/react';
import { Separator } from '../Separator';
import React from 'react';

describe('Separator Component', () => {
    it('debería renderizar el rol decorativo por defecto', () => {
        const { container } = render(<Separator />);
        const div = container.firstChild as HTMLElement;
        expect(div.getAttribute('role')).toBe('none');
        expect(div.getAttribute('aria-orientation')).toBeNull();
        expect(div.className).toContain('h-[1px]');
    });

    it('debería aplicar el rol de separator y la orientación correspondiente cuando no es decorativo', () => {
        const { container, rerender } = render(<Separator decorative={false} orientation="vertical" />);
        let div = container.firstChild as HTMLElement;
        expect(div.getAttribute('role')).toBe('separator');
        expect(div.getAttribute('aria-orientation')).toBe('vertical');
        expect(div.className).toContain('w-[1px]');

        rerender(<Separator decorative={false} orientation="horizontal" />);
        div = container.firstChild as HTMLElement;
        expect(div.getAttribute('role')).toBe('separator');
        expect(div.getAttribute('aria-orientation')).toBe('horizontal');
        expect(div.className).toContain('h-[1px]');
    });
});