import { chromium } from "playwright";

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();

  const pages = [
    { name: "ModelList", path: "/model-ops/models-master", file: "models.png" },
    { name: "ShadowRunQueue", path: "/model-ops/shadow-run-jobs", file: "shadowrun.png" },
    { name: "ApprovalQueue", path: "/governance/approvals", file: "approvals.png" },
  ];

  console.log("📸 CAPTURING OTHER 3 PAGES\n");

  for (const p of pages) {
    try {
      await page.goto(`http://localhost:5173${p.path}`, { waitUntil: "networkidle", timeout: 10000 });
      await page.waitForTimeout(1000);

      const state = await page.evaluate(() => {
        const h1 = document.querySelector("h1");
        const elements = Array.from(document.querySelectorAll("*"))
          .filter(el => window.getComputedStyle(el).display !== "none" && el.offsetHeight > 0).length;
        return { title: h1?.textContent?.trim(), elements };
      });

      await page.setViewportSize({ width: 1920, height: 1080 });
      await page.screenshot({ path: `D:\\Temp\\${p.file}`, fullPage: true });

      console.log(`✅ ${p.name}`);
      console.log(`   Title: ${state.title}`);
      console.log(`   Elements: ${state.elements}`);
      console.log(`   Screenshot: ${p.file}\n`);
    } catch (e) {
      console.log(`❌ ${p.name}: ${e.message}\n`);
    }
  }

  await browser.close();
})();