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

describe('<FraseAncla />', () => {
  it('renders the anchor quote', () => {
    const { container } = render(<FraseAncla />);
    expect(container.textContent).toMatch(/Las empresas no dejan de crecer/i);
    expect(container.textContent).toMatch(/falta de claridad/i);
  });

  it('paints the "after": the anchor names the problem, this line names the outcome', () => {
    const { container } = render(<FraseAncla />);
    expect(container.textContent).toMatch(/Sabes exactamente dónde invertir/i);
  });

  it('resolves the brand metaphor into the mark', () => {
    const { container } = render(<FraseAncla />);
    expect(container.querySelectorAll('[data-resolucion]')).toHaveLength(3);
  });
});