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

describe('<ClaridadHero />', () => {
  it('is decorative: hidden from assistive tech', () => {
    const { container } = render(<ClaridadHero className="w-full h-full" />);
    expect(container.firstElementChild).toHaveAttribute('aria-hidden', 'true');
  });

  it('holds the box open so nothing shifts when the scene arrives', () => {
    const { container } = render(<ClaridadHero className="w-full h-full" />);
    expect(container.firstElementChild).toHaveClass('w-full', 'h-full');
  });

  // The stub observer in the test setup never reports an intersection, which is
  // exactly the case worth pinning: until the box comes near the viewport,
  // nothing mounts and three.js is never fetched.
  it('does not fetch three.js before the box comes near the viewport', () => {
    const { container } = render(<ClaridadHero className="w-full h-full" />);
    expect(container.firstElementChild).toBeEmptyDOMElement();
  });
});