const { chromium } = require('playwright');

async function testEditButton() {
  console.log('🔍 Testing Edit Button Functionality...\n');

  const browser = await chromium.launch({ headless: false }); // Run visible to see what happens
  const context = await browser.newContext({
    ignoreHTTPSErrors: true,
  });
  const page = await context.newPage();

  try {
    console.log('📍 Navigating to furniture editor...');
    await page.goto('https://admin-panel.habland.orb.local/furni', {
      waitUntil: 'networkidle',
      timeout: 15000
    });
    console.log('✅ Page loaded\n');

    await page.waitForTimeout(3000);

    // Find the first furniture item row
    console.log('🔍 Looking for first furniture item row...');
    const firstRow = page.locator('tbody tr').first();

    // Get the item details
    const itemText = await firstRow.textContent();
    console.log(`   First item: ${itemText.substring(0, 100)}...\n`);

    // Hover over the row to reveal edit button
    console.log('🖱️  Hovering over row to reveal Edit button...');
    await firstRow.hover();
    await page.waitForTimeout(1000);

    // Take screenshot after hover
    await page.screenshot({ path: '/Users/matt/DEV/habland/admin-panel/edit-button-hover.png', fullPage: true });
    console.log('📸 Screenshot saved: edit-button-hover.png\n');

    // Check if edit button exists and is visible
    const editButton = firstRow.locator('button[title="Edit"]');
    const editButtonCount = await editButton.count();
    console.log(`   Edit button count: ${editButtonCount}`);

    if (editButtonCount > 0) {
      const isVisible = await editButton.isVisible();
      console.log(`   Edit button visible: ${isVisible}`);

      if (isVisible) {
        console.log('\n🖱️  Clicking Edit button...');
        await editButton.click();
        console.log('   Clicked!\n');

        await page.waitForTimeout(2000);

        // Check if edit row appeared
        const editRowCount = await page.locator('tr.bg-purple-500\\/5').count();
        console.log(`   Edit row appeared: ${editRowCount > 0 ? '✅' : '❌'} (count: ${editRowCount})`);

        // Take screenshot after click
        await page.screenshot({ path: '/Users/matt/DEV/habland/admin-panel/edit-button-clicked.png', fullPage: true });
        console.log('📸 Screenshot saved: edit-button-clicked.png\n');

        if (editRowCount === 0) {
          console.log('⚠️  Edit button clicked but no edit row appeared!');
          console.log('   Checking for any errors in console...\n');
        }
      }
    } else {
      console.log('❌ Edit button not found in row');
    }

    // Keep browser open for manual inspection
    console.log('\n⏸️  Keeping browser open for 30 seconds for manual inspection...');
    await page.waitForTimeout(30000);

  } catch (error) {
    console.error('\n❌ Test failed:', error.message);
    await page.screenshot({ path: '/Users/matt/DEV/habland/admin-panel/edit-error.png', fullPage: true });
    console.log('📸 Error screenshot saved: edit-error.png');
  } finally {
    await browser.close();
    console.log('\n🎬 Browser closed');
  }
}

testEditButton().catch(console.error);