import { render, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { describe, expect, it } from "vitest";
import { ThemeProvider } from "./theme";
import { ThemeToggle } from "./theme-toggle";

describe("ThemeToggle", () => {
  it("switches theme via dropdown, persists to localStorage, toggles dark class", async () => {
    localStorage.clear();
    document.documentElement.classList.remove("dark");
    render(
      <ThemeProvider>
        <ThemeToggle />
      </ThemeProvider>,
    );

    await userEvent.click(screen.getByRole("button", { name: "切换主题" }));
    await userEvent.click(await screen.findByText("深色"));

    await waitFor(() => expect(localStorage.getItem("ui.theme")).toBe("dark"));
    expect(document.documentElement.classList.contains("dark")).toBe(true);
  });
});