/**
 * Comprehensive TEC Enhanced Template Validation
 * 
 * Complete validation with proper authentication and 100% field population testing
 */

const { chromium } = require('playwright');
const fs = require('fs').promises;
const path = require('path');

const config = {
    baseUrl: 'https://upskill-staging.measurequick.com',
    timeout: 45000,
    testCredentials: {
        username: 'test_trainer',
        password: 'TestTrainer123!'
    },
    screenshotDir: 'test-results/comprehensive-validation'
};

console.log('🎯 Comprehensive TEC Enhanced Template Validation');
console.log('===============================================');
console.log(`🌐 Testing URL: ${config.baseUrl}`);
console.log('📋 Target: 100% field population success rate validation');
console.log('');

async function runComprehensiveValidation() {
    await ensureDirectoryExists(config.screenshotDir);
    
    const browser = await chromium.launch({ 
        headless: false,
        slowMo: 1000,
        args: ['--no-sandbox', '--disable-dev-shm-usage']
    });
    
    const context = await browser.newContext({
        viewport: { width: 1920, height: 1080 },
        ignoreHTTPSErrors: true
    });
    
    const page = await context.newPage();
    
    const pageErrors = [];
    page.on('pageerror', error => {
        pageErrors.push(error.message);
        console.error(`❌ Page Error: ${error.message}`);
    });
    
    // Console monitoring for enhanced template indicators
    page.on('console', msg => {
        if (msg.type() === 'log' && (
            msg.text().includes('Enhanced') ||
            msg.text().includes('HVAC') ||
            msg.text().includes('Field Population')
        )) {
            console.log(`🔍 Browser: ${msg.text()}`);
        }
    });
    
    const testResults = {
        screenshots: [],
        authentication: false,
        templateDetection: {},
        enhancedFields: {},
        standardFields: {},
        fieldPopulation: {},
        formSubmission: {},
        errors: pageErrors
    };
    
    try {
        console.log('📋 Step 1: Authentication Process');
        
        // Navigate to TEC form (will redirect to login if needed)
        await page.goto(`${config.baseUrl}/events/network/add`);
        await page.waitForLoadState('networkidle');
        await takeScreenshot('01-initial-navigation', 'Initial navigation to TEC form');
        
        // Check if login is required
        const loginRequired = page.url().includes('login') || 
                             await page.locator('input[name="log"]').count() > 0 ||
                             await page.locator('.login').count() > 0;
        
        if (loginRequired) {
            console.log('🔐 Login required - authenticating...');
            
            // Handle login form
            const usernameField = await page.locator('input[name="log"], #user_login, input[type="email"]').first();
            const passwordField = await page.locator('input[name="pwd"], #user_pass, input[type="password"]').first();
            const submitButton = await page.locator('input[type="submit"], button[type="submit"], .wp-submit, button:has-text("LOG IN")').first();
            
            if (await usernameField.count() > 0 && await passwordField.count() > 0) {
                await usernameField.fill(config.testCredentials.username);
                await passwordField.fill(config.testCredentials.password);
                await takeScreenshot('02-credentials-filled', 'Login credentials filled');
                
                await submitButton.click();
                await page.waitForLoadState('networkidle');
                
                // Navigate back to TEC form after login
                await page.goto(`${config.baseUrl}/events/network/add`);
                await page.waitForLoadState('networkidle');
                await page.waitForTimeout(3000); // Allow enhanced template to load
                
                testResults.authentication = true;
                console.log('✅ Authentication successful');
            } else {
                throw new Error('Login form fields not found');
            }
        } else {
            console.log('ℹ️ No login required, proceeding directly');
            testResults.authentication = true;
        }
        
        await takeScreenshot('03-tec-form-authenticated', 'TEC form loaded after authentication');
        
        console.log('📋 Step 2: Enhanced Template Detection');
        
        testResults.templateDetection = await detectEnhancedTemplate(page);
        await takeScreenshot('04-template-detection', 'Enhanced template detection complete');
        
        console.log('📋 Step 3: Enhanced Fields Validation');
        
        testResults.enhancedFields = await validateEnhancedFields(page);
        await takeScreenshot('05-enhanced-fields', 'Enhanced fields validation complete');
        
        console.log('📋 Step 4: Standard TEC Fields Validation');
        
        testResults.standardFields = await validateStandardFields(page);
        await takeScreenshot('06-standard-fields', 'Standard fields validation complete');
        
        console.log('📋 Step 5: Field Population Testing');
        
        testResults.fieldPopulation = await testFieldPopulation(page);
        await takeScreenshot('07-field-population', 'Field population testing complete');
        
        console.log('📋 Step 6: Form Submission Readiness');
        
        testResults.formSubmission = await testFormSubmissionReadiness(page);
        await takeScreenshot('08-submission-ready', 'Form submission readiness check');
        
        console.log('📋 Step 7: Generate Comprehensive Report');
        
        const finalReport = generateComprehensiveReport(testResults);
        await saveComprehensiveReport(finalReport);
        
        console.log('\n🎉 COMPREHENSIVE VALIDATION COMPLETE');
        console.log('='.repeat(50));
        console.log(finalReport.summary);
        
        return finalReport;
        
    } catch (error) {
        console.error('❌ Comprehensive validation failed:', error.message);
        await takeScreenshot('error-comprehensive', `Error: ${error.message}`);
        throw error;
    } finally {
        await browser.close();
    }
    
    async function takeScreenshot(name, description) {
        try {
            const timestamp = new Date().toISOString().replace(/[:.]/g, '-');
            const filename = `${timestamp}_${name}.png`;
            const filepath = path.join(config.screenshotDir, filename);
            
            await page.screenshot({ 
                path: filepath,
                fullPage: true 
            });
            
            testResults.screenshots.push({
                name,
                description,
                filename,
                timestamp
            });
            
            console.log(`📸 Screenshot: ${description} -> ${filename}`);
        } catch (error) {
            console.error(`❌ Screenshot failed: ${error.message}`);
        }
    }
}

async function detectEnhancedTemplate(page) {
    console.log('🔍 Detecting enhanced template deployment...');
    
    const detectionChecks = {
        enhancedIndicator: '.hvac-success-indicator',
        enhancedForm: '.hvac-tec-enhanced-form',
        enhancedStyles: '#hvac-tec-enhanced-styles',
        basicTecForm: '#tribe-community-events',
        anyForm: 'form'
    };
    
    const results = {};
    let detected = 0;
    
    for (let [name, selector] of Object.entries(detectionChecks)) {
        try {
            const count = await page.locator(selector).count();
            results[name] = {
                found: count > 0,
                count: count,
                selector: selector
            };
            
            if (count > 0) {
                detected++;
                console.log(`✅ ${name}: Found (${count} elements)`);
            } else {
                console.log(`❌ ${name}: Not found`);
            }
        } catch (error) {
            results[name] = {
                found: false,
                error: error.message,
                selector: selector
            };
        }
    }
    
    const detectionRate = Math.round((detected / Object.keys(detectionChecks).length) * 100);
    console.log(`📊 Template detection rate: ${detected}/${Object.keys(detectionChecks).length} (${detectionRate}%)`);
    
    results._summary = {
        detected,
        total: Object.keys(detectionChecks).length,
        detectionRate
    };
    
    return results;
}

async function validateEnhancedFields(page) {
    console.log('🎯 Validating enhanced field sections...');
    
    const enhancedFieldChecks = {
        excerptField: '.hvac-excerpt-field, #hvac-excerpt-section, #hvac_post_excerpt',
        categoriesField: '.hvac-categories-field, #hvac-categories-section',
        featuredImageField: '.hvac-featured-image-field, #hvac-featured-image-section',
        tagsField: '.hvac-tags-field, #hvac-tags-section'
    };
    
    const results = {};
    let foundFields = 0;
    
    for (let [name, selector] of Object.entries(enhancedFieldChecks)) {
        try {
            const count = await page.locator(selector).count();
            results[name] = {
                found: count > 0,
                count: count,
                selector: selector
            };
            
            if (count > 0) {
                foundFields++;
                console.log(`✅ ${name}: Found (${count} elements)`);
            } else {
                console.log(`❌ ${name}: Not found`);
            }
        } catch (error) {
            results[name] = {
                found: false,
                error: error.message,
                selector: selector
            };
        }
    }
    
    const enhancedFieldsRate = Math.round((foundFields / Object.keys(enhancedFieldChecks).length) * 100);
    console.log(`📊 Enhanced fields rate: ${foundFields}/${Object.keys(enhancedFieldChecks).length} (${enhancedFieldsRate}%)`);
    
    results._summary = {
        foundFields,
        totalFields: Object.keys(enhancedFieldChecks).length,
        enhancedFieldsRate
    };
    
    return results;
}

async function validateStandardFields(page) {
    console.log('📝 Validating standard TEC fields...');
    
    const standardFieldChecks = {
        titleField: 'input[name*="title"], input[id*="title"], input[name="post_title"], #post-title-0',
        contentField: 'textarea[name*="content"], textarea[id*="content"], textarea[name="post_content"], #post-content-0',
        venueField: 'input[name*="venue"], select[name*="venue"], input[id*="venue"], select[id*="venue"]',
        organizerField: 'input[name*="organizer"], select[name*="organizer"], input[id*="organizer"], select[id*="organizer"]',
        dateField: 'input[name*="date"], input[id*="date"], input[type="date"]',
        timeField: 'input[name*="time"], input[id*="time"], input[type="time"]',
        costField: 'input[name*="cost"], input[id*="cost"], input[name*="price"]'
    };
    
    const results = {};
    let foundStandard = 0;
    
    for (let [name, selector] of Object.entries(standardFieldChecks)) {
        try {
            const count = await page.locator(selector).count();
            results[name] = {
                found: count > 0,
                count: count,
                selector: selector
            };
            
            if (count > 0) {
                foundStandard++;
                console.log(`✅ ${name}: Found (${count} elements)`);
            } else {
                console.log(`❌ ${name}: Not found`);
            }
        } catch (error) {
            results[name] = {
                found: false,
                error: error.message,
                selector: selector
            };
        }
    }
    
    const standardFieldsRate = Math.round((foundStandard / Object.keys(standardFieldChecks).length) * 100);
    console.log(`📊 Standard fields rate: ${foundStandard}/${Object.keys(standardFieldChecks).length} (${standardFieldsRate}%)`);
    
    results._summary = {
        foundStandard,
        totalStandard: Object.keys(standardFieldChecks).length,
        standardFieldsRate
    };
    
    return results;
}

async function testFieldPopulation(page) {
    console.log('✏️ Testing field population capabilities...');
    
    const testData = {
        title: 'Comprehensive Enhanced Template Test Event',
        content: 'This event validates the enhanced TEC template deployment with comprehensive field population testing.',
        venue: 'Enhanced Template Test Center',
        organizer: 'Template Validation Company',
        cost: '299'
    };
    
    const populationTests = [
        { name: 'Title', selectors: ['input[name*="title"]', '#post-title-0', 'input[name="post_title"]'], value: testData.title },
        { name: 'Content', selectors: ['textarea[name*="content"]', '#post-content-0', 'textarea[name="post_content"]'], value: testData.content },
        { name: 'Venue', selectors: ['input[name*="venue"]', 'select[name*="venue"]'], value: testData.venue },
        { name: 'Organizer', selectors: ['input[name*="organizer"]', 'select[name*="organizer"]'], value: testData.organizer },
        { name: 'Cost', selectors: ['input[name*="cost"]', 'input[name*="price"]'], value: testData.cost }
    ];
    
    const results = {};
    let populatedFields = 0;
    
    for (let test of populationTests) {
        let populated = false;
        let usedSelector = null;
        
        for (let selector of test.selectors) {
            try {
                const element = await page.locator(selector).first();
                if (await element.count() > 0 && await element.isVisible()) {
                    await element.clear();
                    await element.fill(test.value);
                    
                    // Verify population
                    const currentValue = await element.inputValue();
                    if (currentValue === test.value) {
                        populated = true;
                        usedSelector = selector;
                        populatedFields++;
                        console.log(`✅ ${test.name}: Successfully populated using ${selector}`);
                        break;
                    }
                }
            } catch (error) {
                // Continue to next selector
            }
        }
        
        results[test.name] = {
            populated: populated,
            usedSelector: usedSelector,
            testValue: test.value,
            selectors: test.selectors
        };
        
        if (!populated) {
            console.log(`❌ ${test.name}: Could not populate with any selector`);
        }
    }
    
    const populationRate = Math.round((populatedFields / populationTests.length) * 100);
    console.log(`📊 Field population rate: ${populatedFields}/${populationTests.length} (${populationRate}%)`);
    
    results._summary = {
        populatedFields,
        totalFields: populationTests.length,
        populationRate
    };
    
    return results;
}

async function testFormSubmissionReadiness(page) {
    console.log('📤 Testing form submission readiness...');
    
    const submitSelectors = [
        'input[type="submit"]',
        'button[type="submit"]',
        'button:has-text("Publish")',
        'button:has-text("Submit")',
        '.tribe-events-c-nav__list-item--publish',
        '#publish'
    ];
    
    let submitFound = false;
    let submitSelector = null;
    
    for (let selector of submitSelectors) {
        try {
            const element = await page.locator(selector).last();
            if (await element.count() > 0) {
                submitFound = true;
                submitSelector = selector;
                console.log(`✅ Submit button found: ${selector}`);
                break;
            }
        } catch (error) {
            // Continue to next selector
        }
    }
    
    if (!submitFound) {
        console.log('❌ Submit button not found');
    }
    
    return {
        submitFound,
        submitSelector,
        ready: submitFound
    };
}

function generateComprehensiveReport(results) {
    const report = {
        timestamp: new Date().toISOString(),
        summary: '',
        details: results,
        success: false,
        metrics: {},
        recommendations: []
    };
    
    // Extract metrics
    report.metrics.authenticationSuccess = results.authentication;
    report.metrics.templateDetectionRate = results.templateDetection._summary?.detectionRate || 0;
    report.metrics.enhancedFieldsRate = results.enhancedFields._summary?.enhancedFieldsRate || 0;
    report.metrics.standardFieldsRate = results.standardFields._summary?.standardFieldsRate || 0;
    report.metrics.fieldPopulationRate = results.fieldPopulation._summary?.populationRate || 0;
    report.metrics.formSubmissionReady = results.formSubmission?.ready || false;
    report.metrics.screenshotsCaptured = results.screenshots.length;
    report.metrics.errorsDetected = results.errors.length;
    
    // Determine overall success
    const criticalSuccess = report.metrics.authenticationSuccess && 
                           report.metrics.templateDetectionRate >= 60 &&
                           report.metrics.standardFieldsRate >= 70;
    
    const enhancedSuccess = report.metrics.enhancedFieldsRate >= 75;
    const populationSuccess = report.metrics.fieldPopulationRate >= 80;
    
    report.success = criticalSuccess && enhancedSuccess && populationSuccess;
    
    // Generate recommendations
    if (report.metrics.enhancedFieldsRate < 100) {
        report.recommendations.push('Enhanced field sections need deployment verification');
    }
    if (report.metrics.fieldPopulationRate < 100) {
        report.recommendations.push('Field population system needs optimization');
    }
    if (!report.metrics.formSubmissionReady) {
        report.recommendations.push('Form submission mechanism needs verification');
    }
    
    // Generate summary
    let summary = '\n📊 COMPREHENSIVE TEC VALIDATION REPORT\n';
    summary += '='.repeat(50) + '\n\n';
    
    summary += `🔐 AUTHENTICATION: ${report.metrics.authenticationSuccess ? '✅ SUCCESS' : '❌ FAILED'}\n`;
    summary += `🔍 TEMPLATE DETECTION: ${report.metrics.templateDetectionRate}%\n`;
    summary += `🎯 ENHANCED FIELDS: ${report.metrics.enhancedFieldsRate}%\n`;
    summary += `📝 STANDARD FIELDS: ${report.metrics.standardFieldsRate}%\n`;
    summary += `✏️ FIELD POPULATION: ${report.metrics.fieldPopulationRate}%\n`;
    summary += `📤 FORM SUBMISSION: ${report.metrics.formSubmissionReady ? '✅ READY' : '❌ NOT READY'}\n`;
    summary += `📸 SCREENSHOTS: ${report.metrics.screenshotsCaptured}\n`;
    summary += `❌ ERRORS: ${report.metrics.errorsDetected}\n`;
    
    summary += '\n🏆 OVERALL RESULT: ';
    if (report.success) {
        summary += '✅ SUCCESS - PRODUCTION READY\n';
        summary += '✅ Enhanced TEC template fully functional\n';
        summary += '✅ Field population system operational\n';
        summary += '✅ Ready for 100% field population achievement\n';
    } else if (criticalSuccess) {
        summary += '⚠️ PARTIAL SUCCESS - NEEDS ENHANCEMENT\n';
        summary += '✅ Basic functionality working\n';
        summary += '⚠️ Enhanced features need optimization\n';
    } else {
        summary += '❌ CRITICAL ISSUES - DEPLOYMENT NEEDED\n';
        summary += '❌ Core functionality not working properly\n';
        summary += '❌ Requires immediate investigation\n';
    }
    
    // Target achievement assessment
    summary += '\n🎯 TARGET ACHIEVEMENT ASSESSMENT:\n';
    if (report.metrics.fieldPopulationRate === 100) {
        summary += '🎉 TARGET ACHIEVED: 100% field population success!\n';
    } else if (report.metrics.fieldPopulationRate >= 90) {
        summary += '⚠️ NEAR TARGET: 90%+ field population achieved\n';
    } else if (report.metrics.fieldPopulationRate >= 70) {
        summary += '⚠️ MODERATE SUCCESS: 70%+ field population achieved\n';
    } else {
        summary += '❌ TARGET NOT MET: Field population below 70%\n';
    }
    
    if (report.recommendations.length > 0) {
        summary += '\n🔧 RECOMMENDATIONS:\n';
        report.recommendations.forEach((rec, index) => {
            summary += `   ${index + 1}. ${rec}\n`;
        });
    }
    
    if (report.metrics.errorsDetected > 0) {
        summary += '\n❌ PAGE ERRORS DETECTED:\n';
        results.errors.forEach((error, index) => {
            summary += `   ${index + 1}. ${error}\n`;
        });
    }
    
    report.summary = summary;
    return report;
}

async function saveComprehensiveReport(report) {
    try {
        const reportPath = path.join(config.screenshotDir, 'comprehensive-validation-report.json');
        await fs.writeFile(reportPath, JSON.stringify(report, null, 2));
        
        const summaryPath = path.join(config.screenshotDir, 'comprehensive-validation-summary.txt');
        await fs.writeFile(summaryPath, report.summary);
        
        console.log(`📄 Comprehensive report saved: ${reportPath}`);
        console.log(`📄 Summary saved: ${summaryPath}`);
    } catch (error) {
        console.error(`❌ Failed to save report: ${error.message}`);
    }
}

async function ensureDirectoryExists(dirPath) {
    try {
        await fs.access(dirPath);
    } catch {
        await fs.mkdir(dirPath, { recursive: true });
        console.log(`📁 Created directory: ${dirPath}`);
    }
}

// Main execution
if (require.main === module) {
    runComprehensiveValidation()
        .then(report => {
            console.log('\n✅ Comprehensive validation completed');
            console.log(`🎯 Field Population Rate: ${report.metrics.fieldPopulationRate}%`);
            console.log(`🔍 Enhanced Fields Rate: ${report.metrics.enhancedFieldsRate}%`);
            console.log(`📝 Standard Fields Rate: ${report.metrics.standardFieldsRate}%`);
            console.log(`🏆 Production Ready: ${report.success ? 'YES' : 'NO'}`);
            
            if (report.metrics.fieldPopulationRate === 100) {
                console.log('\n🎉 TARGET ACHIEVED: 100% field population success rate!');
            }
            
            process.exit(0);
        })
        .catch(error => {
            console.error('\n❌ Comprehensive validation failed:', error.message);
            process.exit(1);
        });
}

module.exports = { runComprehensiveValidation };