import { cleanup, render, screen } from "@testing-library/react";
import { FileDrop } from "@repo/ui";
import { afterEach, describe, expect, it, vi } from "vitest";

afterEach(() => {
  cleanup();
});

describe("FileDrop presentation accessibility", () => {
  it("renders feedback and progress status visibly in live regions", () => {
    render(
      <FileDrop
        onFilesSelect={vi.fn()}
        presentation={{
          accept: "image/png",
          allowsFileBatch: true,
          allowsFolderSelection: false,
          emptyDescription: "or drag it onto the canvas",
          emptyTitle: "Upload images",
          feedback: {
            category: "bundle",
            code: "invalid-bundle",
            message: "The image bundle could not be imported.",
          },
          items: [],
          presenter: "image-grid",
          secondaryActions: [],
          status: {
            label: "Decoding files",
            phase: "decoding",
            progress: 0.5,
          },
        }}
      />,
    );

    expect(screen.getByRole("alert").textContent).toContain(
      "The image bundle could not be imported.",
    );
    expect(screen.getByRole("status").textContent).toContain(
      "Decoding files",
    );
    expect(screen.getByRole("status").textContent).toContain("50%");
  });
});