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

describe('<ContadorNumero />', () => {
  it('starts at 0 and only counts up once scrolled into view', () => {
    const { container } = render(<ContadorNumero hasta={30} />);
    expect(container.textContent).toBe('0');
  });

  it('appends the given suffix', () => {
    const { container } = render(<ContadorNumero hasta={30} sufijo="+" />);
    expect(container.textContent).toBe('0+');
  });

  it('applies the given className to the counter span', () => {
    const { container } = render(<ContadorNumero hasta={30} className="text-dorado" />);
    expect(container.querySelector('span')).toHaveClass('text-dorado');
  });
});