import { describe, it, expect, beforeEach } from "vitest";
import { PettyProgress } from "../src/components/progress/index";
describe("petty-progress", () => {
  let el: PettyProgress;
  beforeEach(() => {
    document.body.textContent = "";
    el = document.createElement("petty-progress") as PettyProgress;
    const fill = document.createElement("div");
    fill.setAttribute("data-part", "fill");
    const label = document.createElement("span");
    label.setAttribute("data-part", "label");
    el.appendChild(fill);
    el.appendChild(label);
    document.body.appendChild(el);
  });
  it("registers as petty-progress", () => {
    expect(customElements.get("petty-progress")).toBe(PettyProgress);
  });
  it("sets progressbar ARIA on connect", () => {
    expect(el.getAttribute("role")).toBe("progressbar");
    expect(el.getAttribute("aria-valuemin")).toBe("0");
    expect(el.getAttribute("aria-valuemax")).toBe("100");
  });
  it("is indeterminate without value", () => {
    expect(el.value).toBeNull();
    expect(el.dataset.state).toBe("indeterminate");
    expect(el.hasAttribute("aria-valuenow")).toBe(false);
  });
  it("tracks value and max attributes", () => {
    el.setAttribute("value", "50");
    el.setAttribute("max", "200");
    expect(el.value).toBe(50);
    expect(el.max).toBe(200);
    expect(el.getAttribute("aria-valuenow")).toBe("50");
    expect(el.dataset.state).toBe("loading");
  });
  it("sets complete state at max", () => {
    el.setAttribute("value", "100");
    expect(el.dataset.state).toBe("complete");
  });
  it("returns to indeterminate when value removed", () => {
    el.setAttribute("value", "50");
    el.removeAttribute("value");
    expect(el.dataset.state).toBe("indeterminate");
    expect(el.hasAttribute("aria-valuenow")).toBe(false);
  });
});