import { test, expect } from './fixtures/auth';
import { CommonActions } from './utils/common-actions';

test('Debug button click simple', async ({ authenticatedPage: page }) => {
  test.setTimeout(30000);
  const actions = new CommonActions(page);

  // Navigate to templates page
  await actions.navigateAndWait('/communication-templates/');
  
  // Wait for scripts
  await page.waitForFunction(() => typeof HVACTemplates !== 'undefined');

  // Check what happens when we click the button
  const buttonTest = await page.evaluate(() => {
    const buttons = document.querySelectorAll('button');
    const createButton = Array.from(buttons).find(btn => btn.textContent?.includes('Create New Template'));
    
    if (!createButton) return { error: 'Button not found' };

    const onclick = createButton.getAttribute('onclick');
    return {
      buttonFound: true,
      onclickAttribute: onclick,
      hasOnclickFunction: typeof HVACTemplates.createNewTemplate === 'function',
      buttonText: createButton.textContent
    };
  });

  console.log('Button investigation:', buttonTest);

  // Try calling the onclick directly
  const onclickResult = await page.evaluate(() => {
    try {
      // Try to execute the onclick directly
      eval('HVACTemplates.createNewTemplate()');
      
      const overlay = document.getElementById('template-form-overlay');
      return {
        success: true,
        display: overlay ? overlay.style.display : 'no overlay'
      };
    } catch (error) {
      return {
        success: false,
        error: error.message
      };
    }
  });

  console.log('Onclick execution result:', onclickResult);

  await actions.screenshot('debug-button-simple-result');
});