import { chromium } from "playwright";
import fs from "fs/promises";
import os from "os";
import path from "path";
import { fileURLToPath } from "url";

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const EXTENSION_PATH = path.join(__dirname, "dist");

async function main() {
  const userDataDir = path.join(
    os.tmpdir(),
    `peach-playwright-profile-${Date.now()}`
  );
  await fs.mkdir(userDataDir, { recursive: true });

  const context = await chromium.launchPersistentContext(userDataDir, {
    headless: false,
    args: [
      `--disable-extensions-except=${EXTENSION_PATH}`,
      `--load-extension=${EXTENSION_PATH}`,
      "--no-sandbox",
      "--disable-setuid-sandbox",
    ],
  });

  const page = await context.newPage();

  // Capture console messages
  page.on("console", (msg) => {
    console.log(`[console.${msg.type()}] ${msg.text()}`);
  });

  page.on("pageerror", (err) => {
    console.log(`[pageerror] ${err.message}`);
  });

  // Click the extension icon to open popup
  let [serviceWorker] = context.serviceWorkers();
  if (!serviceWorker) {
    serviceWorker = await context.waitForEvent("serviceworker");
  }

  const extId = new URL(serviceWorker.url()).host;
  console.log(`Extension ID: ${extId}`);

  const popup = await context.newPage();
  await popup.goto(`chrome-extension://${extId}/src/popup/index.html`);

  popup.on("console", (msg) => {
    console.log(`[popup console.${msg.type()}] ${msg.text()}`);
  });

  popup.on("pageerror", (err) => {
    console.log(`[popup pageerror] ${err.message}`);
  });

  // Wait for the page to load
  await popup.waitForTimeout(2000);

  const title = await popup.title();
  console.log(`Popup title: ${title}`);

  const createButton = popup.getByRole("button", { name: "create vault" });
  const unlockButton = popup.getByRole("button", { name: "unlock" });

  if (await createButton.isVisible()) {
    console.log("\nCreating fresh vault...");
    await popup.locator("#master-password").fill("testpassword123");
    await popup.locator("#confirm-password").fill("testpassword123");
    await createButton.click();
    await popup.waitForTimeout(1500);
  }

  const newEntryButton = popup.getByRole("button", {
    name: "New entry",
    exact: true,
  });
  await newEntryButton.click();
  console.log("New entry form opened");

  await popup.locator(".peach-new-name-input").fill("GitHub");
  await popup.locator('input[placeholder="domain.com"]').fill("https://github.com");
  await popup.locator('input[placeholder="username or email"]').fill("june");
  await popup.locator('input[placeholder="password"]').fill("supersecret123!");
  await popup.getByRole("button", { name: "create" }).click();
  console.log("Entry created");

  await popup.waitForTimeout(1000);
  console.log(
    `Entry visible after save: ${await popup.locator("text=GitHub").first().isVisible()}`
  );

  await popup.close();
  console.log("Popup closed to simulate clicking away");

  const reopenedPopup = await context.newPage();
  await reopenedPopup.goto(`chrome-extension://${extId}/src/popup/index.html`);
  await reopenedPopup.waitForTimeout(1500);

  const createVisibleAfterReopen = await reopenedPopup
    .getByRole("button", { name: "create vault" })
    .isVisible()
    .catch(() => false);
  const unlockVisibleAfterReopen = await reopenedPopup
    .getByRole("button", { name: "unlock" })
    .isVisible()
    .catch(() => false);
  const entryVisibleAfterReopen = await reopenedPopup
    .locator("text=GitHub")
    .first()
    .isVisible()
    .catch(() => false);

  console.log(`Create vault visible after reopen: ${createVisibleAfterReopen}`);
  console.log(`Unlock visible after reopen: ${unlockVisibleAfterReopen}`);
  console.log(`Entry visible after reopen: ${entryVisibleAfterReopen}`);

  if (!entryVisibleAfterReopen && unlockVisibleAfterReopen) {
    const reopenedUnlockButton = reopenedPopup.getByRole("button", {
      name: "unlock",
    });
    await reopenedPopup.locator("#master-password").fill("testpassword123");
    await reopenedUnlockButton.click();
    await reopenedPopup.waitForTimeout(1500);
    console.log(
      `Entry still present after unlock: ${await reopenedPopup
        .locator("text=GitHub")
        .first()
        .isVisible()}`
    );
  }

  await context.close();
  console.log("\nDone.");
}

main().catch(console.error);