/**
 * @vitest-environment jsdom
 */
// #region ReportCardTest:Module [TYPE Function]
// @SEMANTICS: reports, ux-tests, card, states, recovery
// @PURPOSE: Test UX states and transitions for ReportCard component
// @LAYER UI
// @RELATION DEPENDS_ON -> [EXT:frontend:ReportCard]
// @INVARIANT: Each test asserts at least one observable UX contract outcome.
// @TEST_CONTRACT: ReportCardInputProps -> ObservableUXOutput
// @TEST_SCENARIO: ready_state_shows_summary_status_type -> Ready state renders summary/status/type labels.
// @TEST_FIXTURE: valid_report_card -> INLINE_JSON
// @TEST_EDGE: empty_report_object -> Missing fields use placeholders and fallback labels.
// @TEST_EDGE: random_status -> Unknown status is rendered without crashing.
// @TEST_EDGE: missing_optional_fields -> Partial report keeps component interactive and emits select.
// @TEST_INVARIANT: report_card_state_is_observable -> VERIFIED_BY: [ready_state_shows_summary_status_type, empty_report_object, random_status]

import { describe, it, expect, vi } from 'vitest';
import { render, screen, fireEvent } from '@testing-library/svelte';
import ReportCard from '../ReportCard.svelte';
import { mixedTaskReports } from './fixtures/reports.fixtures.js';

// Mock i18n
vi.mock('$lib/i18n/index.svelte.js', () => ({
  t: {
    subscribe: (fn) => {
      fn({
        reports: {
          not_provided: 'Not provided',
          unknown_type: 'Other / Unknown Type',
          status_success: 'Success',
          status_failed: 'Failed',
          status_in_progress: 'In Progress',
          status_partial: 'Partial'
        }
      });
      return () => { };
    }
  },
  _: vi.fn((key) => key)
}));

describe('ReportCard UX Contract', () => {
  const mockReport = mixedTaskReports[0]; // Success report

  // @UX_STATE: Ready -> Card displays summary/status/type.
  it('should display summary, status and type in Ready state', () => {
    render(ReportCard, { report: mockReport, onselect: vi.fn() });
    expect(screen.getByText(mockReport.summary)).toBeDefined();
    // mockReport.status is "success", getStatusLabel(status) returns $t.reports?.status_success
    expect(screen.getByText('Success')).toBeDefined();
    // Profile label for llm_verification is 'LLM'
    expect(screen.getByText('LLM')).toBeDefined();
  });

  // @UX_FEEDBACK: Click on report emits select event.
  it('should emit select event on click', async () => {
    const onSelect = vi.fn();
    render(ReportCard, { report: mockReport, onselect: onSelect });

    const button = screen.getByRole('button');
    await fireEvent.click(button);

    expect(onSelect).toHaveBeenCalled();
  });

  // @UX_RECOVERY: Missing fields are rendered with explicit placeholder text.
  it('should render placeholders for missing fields', () => {
    const partialReport = { report_id: 'partial-1' };
    render(ReportCard, { report: partialReport, onselect: vi.fn() });

    // Check placeholders (using text from mocked $t)
    const placeholders = screen.getAllByText('Not provided');
    expect(placeholders.length).toBeGreaterThan(0);

    // Check fallback type (the profile itself returns 'reports.unknown_type' string which doesn't get translated by $t in the mock if it's returning the key)
    expect(screen.getByText('reports.unknown_type')).toBeDefined();
  });

// @TEST_FIXTURE: valid_report_card -> INLINE_JSON
  it('should render valid_report_card correctly', () => {
    const validReportCard = {
      task_type: "migration",
      status: "success",
      summary: "Test Summary",
      updated_at: "2024-01-01"
    };
    render(ReportCard, { report: validReportCard, onselect: vi.fn() });

    expect(screen.getByText('Test Summary')).toBeDefined();
    expect(screen.getByText('Success')).toBeDefined();
  });

// @TEST_EDGE: empty_report_object -> Missing fields use placeholders and fallback labels.
  it('should handle completely empty report object gracefully', () => {
    render(ReportCard, { report: {}, onselect: vi.fn() });
    const placeholders = screen.getAllByText('Not provided');
    expect(placeholders.length).toBeGreaterThan(0);
  });

// @TEST_EDGE: random_status -> Unknown status is rendered without crashing.
  it('should render random status directly if no translation matches', () => {
    render(ReportCard, { report: { status: "unknown_status_code" }, onselect: vi.fn() });
    expect(screen.getByText('unknown_status_code')).toBeDefined();
  });
});

// #endregion ReportCardTest:Module
