import { cleanup, render, screen } from "@testing-library/react";
import { afterEach, describe, expect, it } from "vitest";
import { TransferProgressBar } from "../../../features/file-manager/components/TransferProgressBar";
afterEach(cleanup);
describe("TransferProgressBar", () => {
it("exposes determinate progress and drives the fill with a transform", () => {
const { container } = render(
,
);
const progress = screen.getByRole("progressbar", {
name: "Uploading archive",
});
expect(progress.getAttribute("aria-valuenow")).toBe("42");
expect(progress.getAttribute("aria-busy")).toBe("false");
expect(
container
.querySelector(".transfer-progress-fill")
?.style.getPropertyValue("--transfer-progress"),
).toBe("0.42");
});
it("clamps invalid percentages before exposing them", () => {
const { rerender } = render(
,
);
expect(screen.getByRole("progressbar").getAttribute("aria-valuenow")).toBe(
"100",
);
rerender();
expect(screen.getByRole("progressbar").getAttribute("aria-valuenow")).toBe(
"0",
);
});
it("marks unknown and stalled progress without inventing a percentage", () => {
const { container } = render(
,
);
const progress = screen.getByRole("progressbar");
expect(progress.hasAttribute("aria-valuenow")).toBe(false);
expect(progress.getAttribute("aria-busy")).toBe("true");
expect(progress.getAttribute("data-stalled")).toBe("true");
expect(
container
.querySelector(".transfer-progress-fill")
?.classList.contains("transfer-progress-indeterminate"),
).toBe(true);
expect(
container
.querySelector(".transfer-progress-fill")
?.classList.contains("transfer-progress-stalled"),
).toBe(true);
});
});