PettyUI/packages/core/tests/accordion.test.ts
2026-03-31 23:03:52 +07:00

52 lines
1.6 KiB
TypeScript

import { describe, it, expect, beforeEach } from "vitest";
import "../src/components/accordion/index";
import { h } from "./helpers";
describe("petty-accordion", () => {
let el: HTMLElement;
beforeEach(() => {
document.body.textContent = "";
el = document.createElement("petty-accordion");
const itemA = h("petty-accordion-item", { value: "a" },
h("details", {},
h("summary", {}, "Section A"),
h("div", { "data-part": "content" }, "Content A"),
),
);
const itemB = h("petty-accordion-item", { value: "b" },
h("details", {},
h("summary", {}, "Section B"),
h("div", { "data-part": "content" }, "Content B"),
),
);
el.appendChild(itemA);
el.appendChild(itemB);
document.body.appendChild(el);
});
it("registers the custom elements", () => {
expect(customElements.get("petty-accordion")).toBeDefined();
expect(customElements.get("petty-accordion-item")).toBeDefined();
});
it("defaults to single type", () => {
expect((el as HTMLElement & { type: string }).type).toBe("single");
});
it("accordion-item sets data-state closed on connect", () => {
const item = el.querySelector("petty-accordion-item")!;
expect(item.getAttribute("data-state")).toBe("closed");
});
it("accordion-item sets aria-expanded false on summary", () => {
const summary = el.querySelector("summary")!;
expect(summary.getAttribute("aria-expanded")).toBe("false");
});
it("supports multiple type attribute", () => {
el.setAttribute("type", "multiple");
expect((el as HTMLElement & { type: string }).type).toBe("multiple");
});
});