// 前端功能验证测试 const fs = require('fs'); const path = require('path'); console.log('🔍 开始前端应用测试...\n'); // 读取app.js文件内容 const appJsPath = path.join(__dirname, '../../web/app.js'); if (!fs.existsSync(appJsPath)) { console.error('❌ app.js文件不存在'); process.exit(1); } const appJsContent = fs.readFileSync(appJsPath, 'utf8'); console.log(`📄 app.js文件大小: ${appJsContent.length} 字符`); // 测试项目 const tests = [ { name: 'OpenCodeApp类定义', condition: appJsContent.includes('class OpenCodeApp'), message: '✓ OpenCodeApp类定义存在' }, { name: '构造函数', condition: appJsContent.includes('constructor()'), message: '✓ 构造函数存在' }, { name: '用户ID生成', condition: appJsContent.includes('generateUserId()'), message: '✓ 用户ID生成功能存在' }, { name: 'DOM元素初始化', condition: appJsContent.includes('initElements()'), message: '✓ DOM元素初始化存在' }, { name: '事件绑定', condition: appJsContent.includes('bindEvents()'), message: '✓ 事件绑定功能存在' }, { name: '健康检查', condition: appJsContent.includes('checkHealth()'), message: '✓ 健康检查功能存在' }, { name: '会话创建', condition: appJsContent.includes('createSession()'), message: '✓ 会话创建功能存在' }, { name: '会话列表加载', condition: appJsContent.includes('loadSessions()'), message: '✓ 会话列表加载功能存在' }, { name: '消息发送', condition: appJsContent.includes('sendMessage()'), message: '✓ 消息发送功能存在' }, { name: '同步消息发送', condition: appJsContent.includes('sendMessageSync()'), message: '✓ 同步消息发送功能存在' }, { name: '流式消息发送', condition: appJsContent.includes('sendMessageStream()'), message: '✓ 流式消息发送功能存在' }, { name: '日志流启动', condition: appJsContent.includes('startLogStream()'), message: '✓ 日志流启动功能存在' }, { name: '日志条目添加', condition: appJsContent.includes('addLogEntry('), message: '✓ 日志条目添加功能存在' } ]; // API端点检查 const apiEndpoints = [ '/api/health', '/api/session/create', '/api/session/list', '/api/prompt/sync', '/api/prompt/stream', '/api/logs/stream' ]; // 运行测试 let passed = 0; let failed = 0; console.log('🧪 运行功能测试:'); tests.forEach(test => { if (test.condition) { console.log(` ${test.message}`); passed++; } else { console.log(` ❌ ${test.name} 失败`); failed++; } }); console.log('\n🌐 API端点检查:'); apiEndpoints.forEach(endpoint => { if (appJsContent.includes(endpoint)) { console.log(` ✓ 引用端点: ${endpoint}`); passed++; } else { console.log(` ❌ 缺少端点: ${endpoint}`); failed++; } }); // 检查关键事件处理 console.log('\n🎯 事件处理检查:'); const events = [ 'addEventListener', 'onclick', 'onkeydown', 'onmessage', 'onerror' ]; events.forEach(event => { if (appJsContent.includes(event)) { console.log(` ✓ 事件处理: ${event}`); passed++; } else { console.log(` ⚠️ 未找到: ${event}`); } }); // 检查流式处理技术 console.log('\n🚀 流式处理技术检查:'); const streamingTech = [ 'EventSource', 'getReader', 'TextDecoder', 'fetch', 'JSON.parse' ]; streamingTech.forEach(tech => { if (appJsContent.includes(tech)) { console.log(` ✓ 使用技术: ${tech}`); passed++; } else { console.log(` ⚠️ 未找到: ${tech}`); } }); // 检查错误处理 console.log('\n🛡️ 错误处理检查:'); const errorHandling = [ 'try {', 'catch (error)', 'console.error', 'console.log' ]; errorHandling.forEach(item => { if (appJsContent.includes(item)) { console.log(` ✓ 错误处理: ${item}`); passed++; } else { console.log(` ⚠️ 未找到: ${item}`); } }); // 检查DOM操作 console.log('\n💻 DOM操作检查:'); const domOperations = [ 'getElementById', 'querySelector', 'innerHTML', 'textContent', 'classList', 'appendChild' ]; domOperations.forEach(op => { if (appJsContent.includes(op)) { console.log(` ✓ DOM操作: ${op}`); passed++; } else { console.log(` ⚠️ 未找到: ${op}`); } }); // 输出总结 console.log('\n📊 测试总结:'); console.log(` 通过: ${passed}`); console.log(` 失败: ${failed}`); console.log(` 总数: ${passed + failed}`); if (failed > 0) { console.log('\n❌ 前端测试失败'); process.exit(1); } else { console.log('\n✅ 所有前端测试通过!'); // 额外检查:验证HTML文件 const htmlPath = path.join(__dirname, '../../web/index.html'); if (fs.existsSync(htmlPath)) { const htmlContent = fs.readFileSync(htmlPath, 'utf8'); console.log('\n📄 HTML文件检查:'); const htmlChecks = [ { name: '包含app.js引用', condition: htmlContent.includes(''), message: '✓ 正确引用app.js' }, { name: '包含必要元素ID', condition: htmlContent.includes('id="') && htmlContent.includes('id="createSessionBtn"') && htmlContent.includes('id="messageInput"'), message: '✓ 包含必要的元素ID' }, { name: '包含CSS样式', condition: htmlContent.includes(''), message: '✓ 包含内联CSS样式' } ]; htmlChecks.forEach(check => { if (check.condition) { console.log(` ${check.message}`); } else { console.log(` ❌ ${check.name} 失败`); } }); console.log(`\n🎨 HTML文件大小: ${htmlContent.length} 字符`); } console.log('\n✨ 前端应用验证完成!'); }