/**
 * Debug Script: Signup Functionality Issue
 * 
 * This script is meant to be run in the browser console to debug signup issues.
 * 
 * To use:
 * 1. Navigate to http://localhost:3000/auth/signup
 * 2. Open browser developer tools (F12)
 * 3. Go to Console tab
 * 4. Paste this entire script and run it
 * 
 * What it checks:
 * - Form submission event listeners
 * - Network requests when form is submitted
 * - JavaScript errors in console
 * - Element existence and attributes
 */

console.log('🔍 Starting Signup Debug Analysis...');

// Check if form exists
const signupForm = document.querySelector('form');
if (!signupForm) {
    console.warn('❌ No form found on signup page');
    console.log('Available elements:');
    document.querySelectorAll('*').forEach(el => {
        if (el.tagName === 'FORM') {
            console.log('Found form element:', el);
        }
    });
} else {
    console.log('✅ Form found:', signupForm);
    
    // Check form attributes
    console.log('Form attributes:', {
        action: signupForm.action,
        method: signupForm.method,
        id: signupForm.id,
        className: signupForm.className
    });
    
    // Add temporary event listener to see if submit is being called
    signupForm.addEventListener('submit', function(e) {
        console.log('📋 Form submit intercepted');
        console.log('Submit event:', e);
        console.log('Form data will be sent to:', this.action || 'default');
    }, { once: true });
    
    // Check input fields
    const emailInput = document.querySelector('input[name="email"]');
    const passwordInput = document.querySelector('input[name="password"]');
    const submitButton = document.querySelector('button[type="submit"]');
    
    console.log('Input fields:');
    if (emailInput) console.log('✅ Email input:', emailInput);
    if (passwordInput) console.log('✅ Password input:', passwordInput);
    if (submitButton) console.log('✅ Submit button:', submitButton);
    
    // Monitor network requests
    console.log('🔍 Monitoring network requests...');
    const originalFetch = window.fetch;
    window.fetch = function(...args) {
        console.log('📡 Fetch called with:', args);
        const [input, init] = args;
        console.log('  URL:', input);
        console.log('  Method:', (init && init.method) || 'GET');
        if (init && init.body) {
            console.log('  Body:', init.body);
        }
        return originalFetch.apply(this, args);
    };
    
    // Monitor for errors
    window.addEventListener('error', function(e) {
        console.error('🚨 JS Error caught:', e.error);
        console.error('Error location:', e.filename, e.lineno, e.colno);
    });
}

// Additional checks
console.log('🔧 Additional diagnostic checks:');
console.log('Current URL:', window.location.href);
console.log('DOM ready state:', document.readyState);

// Wait a moment to see if any network activity occurs
setTimeout(() => {
    console.log('⏰ Checking for network activity after 2 seconds...');
    console.log('If form submission worked, you should see network requests above');
}, 2000);

console.log('📝 Debug script loaded. Try submitting the form now to see output.');