#!/usr/bin/env node

/**
 * 直接访问姓名管理页面的测试
 */

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

async function runDirectNameTest() {
    console.log('🎭 直接访问姓名管理页面测试...\n');

    let browser;
    let page;

    try {
        browser = await chromium.launch({ 
            headless: false,
            slowMo: 1000
        });
        
        const context = await browser.newContext({
            viewport: { width: 1280, height: 800 }
        });
        
        page = await context.newPage();

        // 监听API调用
        page.on('request', request => {
            const url = request.url();
            if (url.includes('/nameTemplate/') || url.includes('/firstname/') || url.includes('/lastname/')) {
                console.log(`📤 API请求: ${request.method()} ${url}`);
            }
        });

        page.on('response', response => {
            const url = response.url();
            if (url.includes('/nameTemplate/') || url.includes('/firstname/') || url.includes('/lastname/')) {
                console.log(`📥 API响应: ${response.status()} ${url} - ${response.statusText()}`);
            }
        });

        // 直接尝试访问可能的姓名管理页面URL
        const possibleUrls = [
            'http://localhost:8891/#/nameManage/firstnameList',
            'http://localhost:8891/#/nameManage/lastnameList', 
            'http://localhost:8891/#/firstname',
            'http://localhost:8891/#/lastname',
            'http://localhost:8891/#/name',
            'http://localhost:8891/nameManage/firstnameList',
            'http://localhost:8891/nameManage/lastnameList'
        ];

        for (const url of possibleUrls) {
            try {
                console.log(`🌐 尝试访问: ${url}`);
                await page.goto(url, { 
                    waitUntil: 'networkidle',
                    timeout: 10000 
                });
                
                // 等待页面加载
                await page.waitForTimeout(3000);
                
                // 检查页面内容
                const title = await page.title();
                const hasError = await page.$('text=404') !== null || await page.$('text=Not Found') !== null;
                const hasLogin = await page.$('text=登录') !== null || await page.$('text=Login') !== null;
                const hasNameContent = await page.$('text=姓氏') !== null || await page.$('text=姓名') !== null || await page.$('text=名字') !== null;
                
                console.log(`📝 页面检查结果:`);
                console.log(`   标题: ${title}`);
                console.log(`   有错误页面: ${hasError}`);
                console.log(`   需要登录: ${hasLogin}`);
                console.log(`   包含姓名内容: ${hasNameContent}`);
                
                if (!hasError && !hasLogin && hasNameContent) {
                    console.log('✅ 成功找到姓名管理页面！');
                    
                    // 截取页面
                    await page.screenshot({ 
                        path: `name_page_${Date.now()}.png`,
                        fullPage: true 
                    });
                    
                    // 检查页面具体内容
                    const hasTable = await page.$('table') !== null;
                    const hasAddButton = await page.$('button:has-text("添加")') !== null;
                    const hasSearchBox = await page.$('input[placeholder*="姓"]') !== null;
                    
                    console.log(`📊 页面功能检查:`);
                    console.log(`   - 数据表格: ${hasTable}`);
                    console.log(`   - 添加按钮: ${hasAddButton}`);
                    console.log(`   - 搜索框: ${hasSearchBox}`);
                    
                    break;
                } else if (hasLogin) {
                    console.log('⚠️ 页面需要登录');
                } else if (hasError) {
                    console.log('❌ 页面不存在');
                } else {
                    console.log('🔍 页面内容不明确，继续尝试其他URL');
                }
                
            } catch (error) {
                console.log(`❌ 访问失败: ${error.message}`);
            }
        }

        // 尝试直接调用API
        console.log('\n🔧 直接测试API调用...');
        
        try {
            // 尝试调用无需认证的API
            const response = await page.evaluate(async () => {
                try {
                    const res = await fetch('http://localhost:3000/nameTemplate/supportedOptions');
                    const data = await res.json();
                    return { status: res.status, data };
                } catch (error) {
                    return { error: error.message };
                }
            });
            
            console.log('📡 API调用结果:', JSON.stringify(response, null, 2));
        } catch (apiError) {
            console.log(`❌ API调用失败: ${apiError.message}`);
        }

        // 等待观察
        await page.waitForTimeout(5000);

    } catch (error) {
        console.error('❌ 测试失败:', error.message);
    } finally {
        if (browser) {
            await browser.close();
        }
        console.log('\n🎭 直接访问测试完成');
    }
}

if (require.main === module) {
    runDirectNameTest().catch(console.error);
}

module.exports = runDirectNameTest;