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

describe('<Icono />', () => {
  it('is decorative: hidden from assistive tech', () => {
    const { container } = render(<Icono nombre="inmersion" />);
    expect(container.querySelector('svg')).toHaveAttribute('aria-hidden', 'true');
  });

  it.each(NOMBRES_ICONO)('renders a non-empty svg for "%s"', (nombre) => {
    const { container } = render(<Icono nombre={nombre} />);
    const svg = container.querySelector('svg');
    expect(svg?.children.length).toBeGreaterThan(0);
  });

  it('takes its colour from currentColor via className, not a hardcoded fill', () => {
    const { container } = render(<Icono nombre="plan" className="text-dorado" />);
    expect(container.querySelector('svg')).toHaveAttribute('stroke', 'currentColor');
    expect(container.querySelector('svg')).toHaveClass('text-dorado');
  });
});