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

describe('Card Component', () => {
    it('debería renderizar el contenido dentro del contenedor', () => {
        render(<Card>Contenido de tarjeta</Card>);
        expect(screen.getByText('Contenido de tarjeta')).toBeDefined();
    });

    it('debería aplicar la clase hoverable y el padding correspondiente', () => {
        const { rerender } = render(<Card hoverable padding="lg">Tarjeta interactiva</Card>);
        let element = screen.getByText('Tarjeta interactiva');
        expect(element.className).toContain('hover:border-border');
        expect(element.className).toContain('p-8');

        rerender(<Card hoverable={false} padding="none">Tarjeta simple</Card>);
        element = screen.getByText('Tarjeta simple');
        expect(element.className).not.toContain('hover:border-border');
        expect(element.className).toContain('p-0');
    });
});