import { createComponentFactory, Spectator } from '@ngneat/spectator/jest';
import { MockComponent } from 'ng-mocks';
import { TextButtonComponent } from './text-button.component';
import { NgIconComponent } from '@ng-icons/core';

describe('TextButtonComponent', () => {
  let spectator: Spectator<TextButtonComponent>;
  const createComponent = createComponentFactory({
    component: TextButtonComponent,
    declarations: [MockComponent(NgIconComponent)],
  });

  beforeEach(() => {
    spectator = createComponent();
  });

  it('should create the component', () => {
    expect(spectator.component).toBeTruthy();
  });

  it('should have default classes for size and color', () => {
    const hostElement = spectator.element;
    // Expected default inputs: size 'medium', color 'normal'
    expect(hostElement.classList).toContain('ui-text-button');
    expect(hostElement.classList).toContain('ui-text-button__medium');
    expect(hostElement.classList).toContain('ui-text-button__normal');
  });

  it('should update classes when inputs change', () => {
    spectator.setInput('size', 'large');
    spectator.setInput('color', 'primary');
    spectator.detectChanges();

    const hostElement = spectator.element;
    expect(hostElement.classList).toContain('ui-text-button__large');
    expect(hostElement.classList).toContain('ui-text-button__primary');
  });

  it('should correctly set the tabindex attribute', () => {
    const hostElement = spectator.element;
    expect(hostElement.getAttribute('tabindex')).toEqual('0');

    spectator.setInput('tabIndex', 5);
    spectator.detectChanges();
    expect(hostElement.getAttribute('tabindex')).toEqual('5');
  });

  it('should update pending class when pending input changes', () => {
    // Set the pending input to true and verify the class is added
    spectator.setInput('pending', true);
    spectator.detectChanges();

    const hostElement = spectator.element;
    expect(hostElement.classList).toContain('ui-text-button__pending');

    // Set the pending input back to false and verify the class is removed
    spectator.setInput('pending', false);
    spectator.detectChanges();
    expect(hostElement.classList).not.toContain('ui-text-button__pending');
  });
});
