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

import * as AllIcons from '@/icons';
import * as AllFigmaIcons from '@/icons/generated';

describe('Icons', () => {
  describe('All icons', () => {
    Object.entries(AllIcons).forEach(([iconName, IconComponent]) => {
      describe(iconName, () => {
        it('accepts a custom className', () => {
          const { container } = render(
            <IconComponent className='text-accent-brand' />
          );
          expect(container.firstElementChild?.classList).toContain(
            'text-accent-brand'
          );
        });
      });
    });
  });

  describe('Figma-generated icons', () => {
    Object.entries(AllFigmaIcons).forEach(([iconName, IconComponent]) => {
      describe(iconName, () => {
        let iconElement: Element;
        beforeAll(() => {
          const { container } = render(<IconComponent />);
          if (!(container.firstElementChild instanceof Element)) {
            throw new Error('Container does not contain a rendered element');
          }
          iconElement = container.firstElementChild;
        });
        it('renders as an SVG', () => {
          expect(iconElement.nodeName).toBe('svg');
        });
        it('has the expected size', () => {
          expect(iconElement.getAttribute('width')).toBe('1em');
          expect(iconElement.getAttribute('height')).toBe('1em');
          expect(iconElement.getAttribute('viewBox')).toBe('0 0 24 24');
        });
        it('has the expected root fill value', () => {
          expect(iconElement.getAttribute('fill')).toBe('currentColor');
        });
      });
    });
  });
});