// Form Interaction Example
// Fills out and interacts with forms on the page

console.log('📝 Interacting with forms...');

// Find and fill input fields
await page.evaluate(() => {
  // Fill text inputs
  const textInputs = document.querySelectorAll('input[type="text"], input[type="email"]');
  textInputs.forEach((input, index) => {
    if (input.placeholder.toLowerCase().includes('email')) {
      input.value = 'demo@example.com';
    } else if (input.placeholder.toLowerCase().includes('name')) {
      input.value = 'John Doe';
    } else {
      input.value = `Demo Text ${index + 1}`;
    }
    input.dispatchEvent(new Event('input', { bubbles: true }));
  });

  // Select first option in dropdowns
  const selects = document.querySelectorAll('select');
  selects.forEach(select => {
    if (select.options.length > 1) {
      select.selectedIndex = 1;
      select.dispatchEvent(new Event('change', { bubbles: true }));
    }
  });

  // Check checkboxes
  const checkboxes = document.querySelectorAll('input[type="checkbox"]');
  checkboxes.forEach(checkbox => {
    checkbox.checked = true;
    checkbox.dispatchEvent(new Event('change', { bubbles: true }));
  });
});

console.log('✓ Forms filled');

// Wait for any animations
await new Promise(resolve => setTimeout(resolve, 500));