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

describe("ListRow", () => {
  it("emits click", async () => {
    const wrapper = mount(ListRow, {
      slots: { title: "row", meta: "tag" },
    });
    await wrapper.get("[data-testid=list-row]").trigger("click");
    expect(wrapper.emitted("click")).toBeTruthy();
  });

  it("renders title + meta + description slots", () => {
    const wrapper = mount(ListRow, {
      slots: {
        title: '<span class="t">title-text</span>',
        meta: '<span class="m">meta-text</span>',
        description: '<span class="d">desc-text</span>',
      },
    });
    expect(wrapper.find(".t").text()).toBe("title-text");
    expect(wrapper.find(".m").text()).toBe("meta-text");
    expect(wrapper.find(".d").text()).toBe("desc-text");
  });

  it("applies the selected class", () => {
    const wrapper = mount(ListRow, {
      props: { selected: true },
      slots: { title: "row" },
    });
    expect(wrapper.get("[data-testid=list-row]").classes()).toContain("bg-zinc-900");
  });

  it("omits description block when slot is empty", () => {
    const wrapper = mount(ListRow, { slots: { title: "row" } });
    expect(wrapper.find(".line-clamp-2").exists()).toBe(false);
  });
});