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

describe('<Wordmark />', () => {
  it('renders the wordmark in lowercase', () => {
    render(<Wordmark />);
    const text = screen.getByText(/cre/).closest('span')?.textContent;
    expect(text?.toLowerCase()).toBe('creeer.');
  });
  it('renders the accent "e" separately for gold styling', () => {
    const { container } = render(<Wordmark />);
    const accent = container.querySelector('[data-accent="true"]');
    expect(accent).not.toBeNull();
    expect(accent?.textContent).toBe('e');
  });
  it('never renders uppercase CREEER', () => {
    const { container } = render(<Wordmark />);
    expect(container.textContent).not.toMatch(/CREEER/);
    expect(container.textContent).not.toMatch(/Creeer/);
  });
});