import { render, screen } from '@testing-library/react';
import { describe, it, expect } from 'vitest';
import { Footer } from '../Footer';
import { creditosFotos } from '@/lib/content';

describe('<Footer />', () => {
  it('renders the tagline and the legal line', () => {
    render(<Footer />);
    expect(screen.getByText('CLARIDAD · DIRECCIÓN · CRECIMIENTO')).toBeInTheDocument();
    expect(screen.getByText(/© 2026 creeer/)).toBeInTheDocument();
  });
  it('does not introduce a second h1', () => {
    render(<Footer />);
    expect(screen.queryByRole('heading', { level: 1 })).toBeNull();
  });
  it('credits every reused photograph, with author, licence and modification notice', () => {
    render(<Footer />);
    // The licences these photographs carry require three things: naming the
    // author, linking the licence, and saying the image was modified. This is
    // the only place in the project where that obligation is enforced, so it
    // counts against `creditosFotos` itself rather than a number typed here —
    // adding a photograph without crediting it has to fail, and a hard-coded
    // count only fails once someone remembers to update it.
    for (const credito of creditosFotos) {
      expect(credito.desc).toMatch(/—\s*\S/); // the author, after the em dash
      expect(screen.getByText(credito.desc)).toHaveAttribute('href', credito.href);
      expect(screen.getAllByText(credito.licencia).length).toBeGreaterThan(0);
    }
    expect(screen.getAllByText(/modificada/)).toHaveLength(creditosFotos.length);
  });
});

describe('<Footer /> — redes', () => {
  it('links every contact channel by name, since the icons alone say nothing to a screen reader', () => {
    render(<Footer />);
    const lista = screen.getByRole('list', { name: /redes y contacto/i });
    expect(lista.querySelectorAll('a')).toHaveLength(3);
    expect(screen.getByRole('link', { name: /^WhatsApp/ })).toHaveAttribute('href', expect.stringMatching(/^https:\/\/wa\.me\//));
    expect(screen.getByRole('link', { name: 'Email' })).toHaveAttribute('href', expect.stringMatching(/^mailto:/));
    expect(screen.getByRole('link', { name: /^LinkedIn/ })).toHaveAttribute('href', expect.stringMatching(/linkedin\./));
  });

  it('opens every outside link in a new tab, so the reader keeps the page', () => {
    render(<Footer />);
    for (const a of screen.getAllByRole('link')) {
      const href = a.getAttribute('href') ?? '';
      if (/^https?:/.test(href)) {
        expect(a).toHaveAttribute('target', '_blank');
        expect(a).toHaveAttribute('rel', 'noopener noreferrer');
        expect(a).toHaveAccessibleName(/se abre en otra pestaña/);
      } else {
        // mailto: in a new tab only leaves an empty tab behind.
        expect(a).not.toHaveAttribute('target');
      }
    }
  });
});