import { describe, expect, it } from "vitest"
import { mount } from "@vue/test-utils"
import CheckboxBoolean from "./CheckboxBoolean.vue"

describe("CheckboxBoolean (props-based composition)", () => {
  it("mounts and renders the label", () => {
    const wrapper = mount(CheckboxBoolean, {
      props: { label: "I agree" },
    })
    expect(wrapper.text()).toContain("I agree")
  })

  it("hides the visible label when hideLabel is true", () => {
    const wrapper = mount(CheckboxBoolean, {
      props: { label: "Hidden", hideLabel: true },
    })
    expect(wrapper.find("[data-testid='field-frame-label-sr']").exists()).toBe(
      true,
    )
    expect(wrapper.find("[data-testid='field-frame-label']").exists()).toBe(
      false,
    )
  })

  it("forwards modelValue=true to the checkbox", () => {
    const wrapper = mount(CheckboxBoolean, {
      props: { label: "X", modelValue: true },
    })
    // reka-ui CheckboxRoot uses aria-checked on the button
    expect(wrapper.find("[role='checkbox']").attributes("aria-checked")).toBe(
      "true",
    )
  })

  it("emits update:modelValue when toggled", async () => {
    const wrapper = mount(CheckboxBoolean, {
      props: { label: "X", modelValue: false },
    })
    await wrapper.find("[role='checkbox']").trigger("click")
    const emitted = wrapper.emitted("update:modelValue")
    expect(emitted).toBeTruthy()
    expect(emitted![0]).toEqual([true])
  })

  it("renders disabled / readonly / required", () => {
    const wrapper = mount(CheckboxBoolean, {
      props: {
        label: "X",
        id: "agree",
        disabled: true,
        readonly: true,
        required: true,
      },
    })
    const cb = wrapper.find("[role='checkbox']")
    expect(cb.attributes("disabled")).toBeDefined()
  })

  it("renders helpText", () => {
    const wrapper = mount(CheckboxBoolean, {
      props: { label: "X", helpText: "Helpful hint" },
    })
    expect(wrapper.find("[data-testid='field-frame-help']").text()).toBe(
      "Helpful hint",
    )
  })

  it("renders errors", () => {
    const wrapper = mount(CheckboxBoolean, {
      props: { label: "X", errors: ["Required field"] },
    })
    const errs = wrapper.find("[data-testid='field-frame-errors']")
    expect(errs.exists()).toBe(true)
    expect(errs.text()).toContain("Required field")
  })

  it("works without any props at all", () => {
    const wrapper = mount(CheckboxBoolean)
    expect(wrapper.find("[role='checkbox']").exists()).toBe(true)
  })
})
