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

describe("ImageDisplay", () => {
  it("renders an img with src and alt", () => {
    const wrapper = mount(ImageDisplay, {
      props: { src: "https://picsum.photos/100", alt: "A picture" },
    })
    const img = wrapper.find("img")
    expect(img.exists()).toBe(true)
    expect(img.attributes("src")).toBe("https://picsum.photos/100")
    expect(img.attributes("alt")).toBe("A picture")
  })

  it("renders an empty placeholder when src is missing", () => {
    const wrapper = mount(ImageDisplay, { props: {} })
    expect(wrapper.find("img").exists()).toBe(false)
    expect(wrapper.find("[data-testid='image-display-empty']").exists()).toBe(true)
  })

  it("defaults alt to an empty string", () => {
    const wrapper = mount(ImageDisplay, {
      props: { src: "https://picsum.photos/100" },
    })
    expect(wrapper.find("img").attributes("alt")).toBe("")
  })

  it("applies classList (string) to the root", () => {
    const wrapper = mount(ImageDisplay, {
      props: { src: "x", classList: "round" },
    })
    expect(wrapper.attributes("class")).toContain("round")
  })

  it("applies classList (array) to the root", () => {
    const wrapper = mount(ImageDisplay, {
      props: { src: "x", classList: ["a", "b"] },
    })
    expect(wrapper.attributes("class")).toContain("a")
    expect(wrapper.attributes("class")).toContain("b")
  })
})
