import { render } from '@testing-library/react';
import { describe, it, expect } from 'vitest';
import { useEnVista } from '@/lib/motion';

function Sonda() {
  const { ref, enVista, reduced } = useEnVista();
  return <svg ref={ref} data-en-vista={String(enVista)} data-reducido={String(reduced)} />;
}

describe('useEnVista', () => {
  it('hands back a ref to attach, plus the two flags a drawing needs', () => {
    const { container } = render(<Sonda />);
    const svg = container.querySelector('svg');
    expect(svg).toHaveAttribute('data-en-vista');
    expect(svg).toHaveAttribute('data-reducido');
  });

  it('starts out not-yet-in-view so drawings do not skip their entrance', () => {
    const { container } = render(<Sonda />);
    // jsdom's IntersectionObserver stub never fires, so this also pins the
    // safe default: nothing claims to be visible until the observer says so.
    expect(container.querySelector('svg')).toHaveAttribute('data-en-vista', 'false');
  });
});