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

describe('<FondoFoto />', () => {
  it('is decorative: hidden from assistive tech, empty alt text', () => {
    const { container } = render(<FondoFoto src="/images/test.jpg" />);
    expect(container.firstElementChild).toHaveAttribute('aria-hidden', 'true');
    expect(container.querySelector('img')).toHaveAttribute('alt', '');
  });
  it('lazy-loads the image', () => {
    const { container } = render(<FondoFoto src="/images/test.jpg" />);
    expect(container.querySelector('img')).toHaveAttribute('loading', 'lazy');
  });
  it('tints the photo into the brand duotone via mix-blend-mode, not raw colour', () => {
    const { container } = render(<FondoFoto src="/images/test.jpg" />);
    expect(container.querySelector('img')?.className).toContain('mix-blend-luminosity');
  });
});