import { describe, it, expect } from "vitest";
import { render, screen } from "@testing-library/react";
import { PropertySliderField } from "@/features/editor/components/PropertySliderField";

describe("PropertySliderField - 테마", () => {
  it("텍스트 입력은 라이트/다크 테마에 맞는 배경/텍스트 클래스를 사용해야 한다", () => {
    render(
      <PropertySliderField
        label="테스트 슬라이더"
        ariaLabelSlider="테스트 슬라이더"
        ariaLabelInput="테스트 값 입력"
        value={10}
        min={0}
        max={100}
        step={1}
        onChange={() => {}}
      />,
    );

    const input = screen.getByLabelText("테스트 값 입력") as HTMLInputElement;
    const className = input.getAttribute("class") ?? "";

    // 라이트 모드: 흰 배경 + 어두운 텍스트
    expect(className).toContain("bg-white");
    expect(className).toContain("text-slate-900");
    // 다크 모드: 다크 배경 + 밝은 텍스트
    expect(className).toContain("dark:bg-slate-900");
    expect(className).toContain("dark:text-slate-100");
  });
});