import { render, screen } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import { mockFetch } from "../test/fetchMock";
import { MtrViewer } from "./MtrViewer";

const asset = (mime: string, pages: number | null) => ({
  body: { id: "a-mtr", mime, size: 9, sha256: "00", pages, original_name: "m", url: "/_blob/a-mtr" },
});

describe("MtrViewer", () => {
  it("draws a PDF with pdf.js, one entry per page, and never in a frame (CSP frame-src 'none')", async () => {
    mockFetch({ "/api/assets/a-mtr": asset("application/pdf", 2) });
    const { container } = render(<MtrViewer assetId="a-mtr" title="MTR · item 1" onClose={() => undefined} />);
    expect(await screen.findByRole("img", { name: "Drawing page 1" })).toBeInTheDocument();
    expect(screen.getByRole("list", { name: "Pages" }).querySelectorAll("li")).toHaveLength(2);
    expect(container.ownerDocument.querySelector("iframe, object, embed")).toBeNull();
    expect(screen.getByRole("link", { name: "Open in new tab" })).toHaveAttribute("href", "/_blob/a-mtr");
  });

  it("says a file it cannot show opens in a new tab", async () => {
    mockFetch({ "/api/assets/a-mtr": asset("application/zip", null) });
    render(<MtrViewer assetId="a-mtr" title="MTR · item 1" onClose={() => undefined} />);
    expect(await screen.findByText("This file cannot be shown here. Open it in a new tab.")).toBeInTheDocument();
  });
});