import { test, expect } from "@playwright/test";
import { gotoPage, openApp } from "./helpers";

// The Files library end to end, against the real app: the page opens on the whole library, and a
// link — typed into its box, or pasted onto any page — opens the one download dialog on it. Nothing
// is downloaded: the dialog is closed, so the run leaves the E2E account's library as it found it.
test.describe("Files", () => {
  const LINK = "https://www.youtube.com/watch?v=jNQXAC9IVRw";
  const dialog = (page: import("@playwright/test").Page) =>
    page.getByRole("dialog", { name: "Download video" });

  test("opens on the whole library, and its link box hands a link to the download dialog", async ({
    page,
  }) => {
    await openApp(page);
    await gotoPage(page, "files");
    await expect(page.getByRole("heading", { name: "All files" })).toBeVisible();
    const box = page.getByRole("textbox", { name: "A link to download" });
    await box.fill(LINK);
    await box.press("Enter");
    await expect(dialog(page)).toBeVisible();
    await expect(dialog(page)).toContainText("jNQXAC9IVRw");
    await page.keyboard.press("Escape");
    await expect(dialog(page)).toBeHidden();
  });

  test("a link pasted onto a page (not into a field) opens the download dialog", async ({
    page,
  }) => {
    await openApp(page);
    await page.evaluate((text) => {
      const e = new Event("paste", { bubbles: true, cancelable: true });
      Object.defineProperty(e, "clipboardData", {
        value: { getData: (type: string) => (type === "text/plain" ? text : "") },
      });
      document.body.dispatchEvent(e);
    }, LINK);
    await expect(dialog(page)).toBeVisible();
    await page.keyboard.press("Escape");
    await expect(dialog(page)).toBeHidden();
  });
});