const { chromium } = require('playwright');
(async () => {
  const browser = await chromium.launch({ headless: true });
  const page = await browser.newPage();
  page.on('pageerror', err => console.log('PAGE_ERR:', err.message));
  page.on('console', msg => {
    if (msg.type() === 'error') console.log('CONSOLE_ERR:', msg.text().substring(0,200));
  });

  try {
    await page.goto('http://localhost:5111/build-calculator', { timeout: 30000, waitUntil: 'load' });
    console.log('Page loaded');
  } catch (e) {
    console.log('Page load error:', e.message);
  }

  await page.waitForTimeout(10000);
  console.log('Waited 10s');

  const selCount = await page.locator('select').count();
  console.log('Select elements count:', selCount);

  if (selCount > 0) {
    for (let s = 0; s < selCount; s++) {
      const opts = await page.locator('select').nth(s).locator('option').allTextContents();
      console.log('Select', s, 'options:', JSON.stringify(opts.map(o => o.trim())));
    }

    await page.locator('select').nth(0).selectOption("Q'Rath");
    console.log('Selected Q\' Rath');
    await page.waitForTimeout(500);

    await page.locator('select').nth(1).selectOption('Orzum');
    console.log('Selected Orzum');
    await page.waitForTimeout(2000);

    // Log all key buttons
    const buttons = page.locator('.keyContainer > div > div');
    const count = await buttons.count();
    console.log('=== All key buttons (' + count + ') ===');
    for (let i = 0; i < count; i++) {
      const txt = (await buttons.nth(i).textContent() || '').trim();
      console.log('Button', i, ':', JSON.stringify(txt.substring(0,60)));
    }

    // Find Q button
    for (let i = 0; i < count; i++) {
      const txt = (await buttons.nth(i).textContent() || '');
      if (txt.trim().toUpperCase().startsWith('Q')) {
        console.log('\nFound Q button at index', i, ':', JSON.stringify(txt.trim().substring(0,60)));
        console.log('Clicking it...');
        await buttons.nth(i).click({ force: true });
        break;
      }
    }

    await page.waitForTimeout(1000);

    // Check entity view
    const evCount = await page.locator('.entityClickView #entityName').count();
    console.log('entityName count:', evCount);
    if (evCount > 0) {
      const name = (await page.locator('.entityClickView #entityName').textContent() || '').trim();
      console.log('entityName text:', JSON.stringify(name));
    }
  } else {
    console.log('No select elements found!');
    console.log('URL:', page.url());
    const body = await page.evaluate(() => document.body.innerText.substring(0, 500));
    console.log('Body text:', JSON.stringify(body));
  }

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