// @vitest-environment jsdom
import { describe, it, expect, vi } from "vitest";
import { render, screen, fireEvent } from "@testing-library/react";
import { DayTabButton } from "./DayTabButton.js";

describe("DayTabButton", () => {
  it("has data-testid based on date", () => {
    render(<DayTabButton date="20260416" isActive={false} isDisabled={false} locale="en" onClick={() => {}} />);
    expect(screen.getByTestId("day-tab-20260416")).toBeTruthy();
  });

  it("renders weekday, day number, and month", () => {
    render(<DayTabButton date="20260416" isActive={false} isDisabled={false} locale="en" onClick={() => {}} />);
    expect(screen.getByText("16")).toBeTruthy();
    expect(screen.getByText(/Apr/i)).toBeTruthy();
    expect(screen.getByText(/Thu/i)).toBeTruthy();
  });

  it("calls onClick with date when enabled", () => {
    const onClick = vi.fn();
    render(<DayTabButton date="20260416" isActive={false} isDisabled={false} locale="en" onClick={onClick} />);
    fireEvent.click(screen.getByTestId("day-tab-20260416"));
    expect(onClick).toHaveBeenCalledWith("20260416");
  });

  it("does not call onClick when disabled", () => {
    const onClick = vi.fn();
    render(<DayTabButton date="20260416" isActive={false} isDisabled={true} locale="en" onClick={onClick} />);
    fireEvent.click(screen.getByTestId("day-tab-20260416"));
    expect(onClick).not.toHaveBeenCalled();
  });

  it("applies --active modifier when active", () => {
    render(<DayTabButton date="20260416" isActive={true} isDisabled={false} locale="en" onClick={() => {}} />);
    const el = screen.getByTestId("day-tab-20260416");
    expect(el.className).toMatch(/--active/);
  });

  it("applies --disabled modifier when disabled", () => {
    render(<DayTabButton date="20260416" isActive={false} isDisabled={true} locale="en" onClick={() => {}} />);
    const el = screen.getByTestId("day-tab-20260416");
    expect(el.className).toMatch(/--disabled/);
  });

  it("is disabled attribute set when disabled", () => {
    render(<DayTabButton date="20260416" isActive={false} isDisabled={true} locale="en" onClick={() => {}} />);
    const btn = screen.getByTestId("day-tab-20260416") as HTMLButtonElement;
    expect(btn.disabled).toBe(true);
  });
});
