// @vitest-environment jsdom
import { cleanup, render, screen } from "@testing-library/react";
import { userEvent } from "@testing-library/user-event";
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
import { Toast } from "../toast.js";

afterEach(cleanup);

describe("Toast", () => {
	it("renders message text", () => {
		render(<Toast message="Hello" onDismiss={() => {}} />);
		expect(screen.getByText("Hello")).toBeDefined();
	});

	it("renders progress bar when progress is provided", () => {
		render(<Toast message="Loading" progress={0.5} onDismiss={() => {}} />);
		const bar = document.body.querySelector("[style*='width']") as HTMLElement;
		expect(bar).not.toBeNull();
		expect(bar.style.width).toBe("50%");
	});

	it("does not render progress bar when progress is omitted", () => {
		render(<Toast message="Done" onDismiss={() => {}} />);
		const bar = document.body.querySelector("[style*='width']");
		expect(bar).toBeNull();
	});

	it("calls onDismiss when close button is clicked", async () => {
		const onDismiss = vi.fn();
		render(<Toast message="Hi" onDismiss={onDismiss} />);

		const toast = screen.getByText("Hi").closest("div");
		const button = toast?.querySelector("button");
		expect(button).not.toBeNull();
		await userEvent.click(button as HTMLElement);

		expect(onDismiss).toHaveBeenCalledOnce();
	});

	describe("auto-dismiss", () => {
		beforeEach(() => {
			vi.useFakeTimers();
		});

		afterEach(() => {
			vi.useRealTimers();
		});

		it("auto-dismisses after specified timeout", () => {
			const onDismiss = vi.fn();
			render(
				<Toast message="Auto" onDismiss={onDismiss} autoDismissMs={3000} />,
			);

			expect(onDismiss).not.toHaveBeenCalled();
			vi.advanceTimersByTime(3000);
			expect(onDismiss).toHaveBeenCalledOnce();
		});

		it("does not auto-dismiss when autoDismissMs is omitted", () => {
			const onDismiss = vi.fn();
			render(<Toast message="Stay" onDismiss={onDismiss} />);

			vi.advanceTimersByTime(10000);
			expect(onDismiss).not.toHaveBeenCalled();
		});
	});
});