import { ComponentFixture, TestBed } from '@angular/core/testing';
import { beforeEach, describe, expect, it } from 'vitest';

import { PurchaseItem, PurchaseItemViewModel } from './purchase-item';

describe('PurchaseItem', () => {
  let fixture: ComponentFixture<PurchaseItem>;

  const item: PurchaseItemViewModel = {
    id: 1,
    title: 'Entrada general',
    description: 'Acceso al evento durante toda la jornada.',
    imageUrl: null,
    quantity: 2,
    attributes: [{ label: 'Turno', value: 'Tarde' }],
    price: '20000.00',
    transferPrice: '18000.00',
  };

  beforeEach(async () => {
    await TestBed.configureTestingModule({ imports: [PurchaseItem] }).compileComponents();
    fixture = TestBed.createComponent(PurchaseItem);
  });

  it('uses the image-free layout and moves description and item details', () => {
    fixture.componentInstance.item = item;
    fixture.detectChanges();

    const element = fixture.nativeElement as HTMLElement;

    expect(
      element.querySelector('.cart-item')?.classList.contains('cart-item--without-image'),
    ).toBe(true);
    expect(element.querySelector('.cart-item-media')).toBeNull();
    expect(element.querySelector('.cart-item-description')?.textContent?.trim()).toBe(
      item.description,
    );
    expect(element.querySelector('.cart-item-bottom-details')?.textContent).toContain(
      'Turno: Tarde',
    );
    expect(element.querySelector('.cart-item-bottom-details')?.textContent).toContain(
      'Cantidad: 2 unidades',
    );
    expect(element.querySelector('.cart-item-transfer-price')).toBeNull();
  });

  it('keeps the existing layout when the product has an image', () => {
    fixture.componentInstance.item = {
      ...item,
      imageUrl: 'https://example.com/product.png',
    };
    fixture.detectChanges();

    const element = fixture.nativeElement as HTMLElement;

    expect(
      element.querySelector('.cart-item')?.classList.contains('cart-item--without-image'),
    ).toBe(false);
    expect(element.querySelector('.cart-item-media img')).not.toBeNull();
    expect(element.querySelector('.cart-item-description')).toBeNull();
    expect(element.querySelector('.cart-item-attributes')?.textContent).toContain(
      'Cantidad: 2 unidades',
    );
    expect(element.querySelector('.cart-item-transfer-price')?.textContent).toContain(
      'Precio por transferencia',
    );
  });
});
