import { chromium } from 'playwright';
import { config } from 'dotenv';
import path from 'path';
config({ path: path.resolve(process.cwd(), '.env.local') });

(async () => {
  const browser = await chromium.launch({ headless: false });
  const page = await browser.newPage();

  await page.goto('https://forms.skyslope.com/?tab=all', { waitUntil: 'domcontentloaded', timeout: 30_000 });
  // Wait for JS to render
  await page.waitForTimeout(5000);

  console.log('URL:', page.url());
  await page.screenshot({ path: 'scripts/debug-forms-rendered.png', fullPage: false });
  console.log('Screenshot saved');

  // Look for form items
  const bodyText = await page.locator('body').innerText().catch(() => '');
  console.log('Page text (first 500 chars):', bodyText.slice(0, 500));

  // Look for any list items or cards
  const items = await page.locator('[class*="form"], [class*="Form"], [class*="item"], [class*="card"]').count();
  console.log('Form-like elements:', items);

  // Look for the NRDS/authorization prompt
  const hasNRDS = bodyText.toLowerCase().includes('nrds') || bodyText.toLowerCase().includes('authorization');
  console.log('Has NRDS/auth prompt:', hasNRDS);

  // Check if we're on a tab with forms
  const tabs = await page.locator('[role="tab"]').all();
  for (const tab of tabs) {
    console.log('Tab:', await tab.textContent());
  }

  await page.waitForTimeout(2000);
  await browser.close();
})();