import '@angular/compiler';
import { TestBed, getTestBed } from '@angular/core/testing';
import { BrowserTestingModule, platformBrowserTesting } from '@angular/platform-browser/testing';
import { afterEach, beforeAll, describe, expect, it, vi } from 'vitest';

import { EventDateNotice } from '../../../core/services/event-date-notice.service';
import { MODAL_DATA, ModalRef } from '../../../core/services/modal.service';
import { EventDateNoticeModalComponent } from './event-date-notice-modal.component';

describe('EventDateNoticeModalComponent', () => {
  beforeAll(() => {
    try {
      getTestBed().initTestEnvironment(BrowserTestingModule, platformBrowserTesting());
    } catch {
      // Test environment may already be initialized by another setup entrypoint.
    }
  });

  afterEach(() => {
    TestBed.resetTestingModule();
  });

  it('renders the precalculated message and emphasizes its marked parts', async () => {
    const close = vi.fn();
    const data: EventDateNotice = {
      type: 'rescheduled',
      change_ids: [1, 2],
      title: 'FECHAS REPROGRAMADAS!',
      message: [
        { text: 'Las fechas del ', bold: false },
        { text: '09 y 10 de Octubre de 2026', bold: true },
        { text: ' han sido reprogramadas, ', bold: false },
        { text: 'respectivamente', bold: true },
        { text: '.', bold: false },
      ],
    };

    await TestBed.configureTestingModule({
      imports: [EventDateNoticeModalComponent],
      providers: [
        { provide: MODAL_DATA, useValue: data },
        { provide: ModalRef, useValue: { close } },
      ],
    }).compileComponents();

    const fixture = TestBed.createComponent(EventDateNoticeModalComponent);
    fixture.detectChanges();
    const element = fixture.nativeElement as HTMLElement;

    expect(element.querySelector('h2')?.textContent).toContain(data.title);
    expect(
      [...element.querySelectorAll('b')].map((strong) => strong.textContent?.trim()),
    ).toEqual(['09 y 10 de Octubre de 2026', 'respectivamente']);

    element.querySelector('button')?.click();
    expect(close).toHaveBeenCalledOnce();
  });
});