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

(async () => {
  const browser = await chromium.launch({ headless: true });
  const context = await browser.newContext();
  const page = await context.newPage();

  console.log('正在打开页面...');
  
  try {
    // 打开视频生成页面
    await page.goto('http://localhost:5173/#/pages/video-generator/create', {
      waitUntil: 'networkidle',
      timeout: 30000
    });
    
    console.log('页面已加载');
    
    // 等待页面加载
    await page.waitForTimeout(2000);
    
    // 检查页面标题
    const title = await page.title();
    console.log('页面标题:', title);
    
    // 截图
    await page.screenshot({ path: 'test-screenshot-1.png', fullPage: true });
    console.log('已保存截图: test-screenshot-1.png');
    
    // 检查页面内容
    const pageContent = await page.content();
    console.log('页面包含关键词 "视频生成":', pageContent.includes('视频生成'));
    console.log('页面包含关键词 "添加图片":', pageContent.includes('添加图片'));
    console.log('页面包含关键词 "下一步":', pageContent.includes('下一步'));
    
    // 检查是否有console错误
    page.on('console', msg => {
      if (msg.type() === 'error') {
        console.log('Console错误:', msg.text());
      }
    });
    
    // 检查API连接
    console.log('\n正在测试API连接...');
    const apiResponse = await page.evaluate(async () => {
      try {
        const response = await fetch('http://localhost:3000/api/video/projects');
        return {
          status: response.status,
          statusText: response.statusText,
          ok: response.ok
        };
      } catch (error) {
        return { error: error.message };
      }
    });
    console.log('API响应:', JSON.stringify(apiResponse, null, 2));
    
    // 测试API调用
    const testResult = await page.evaluate(async () => {
      try {
        const response = await fetch('http://localhost:3000/api/video/projects', {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({ title: '测试视频项目' })
        });
        const data = await response.json();
        return { status: response.status, data };
      } catch (error) {
        return { error: error.message };
      }
    });
    console.log('POST API响应:', JSON.stringify(testResult, null, 2));
    
    console.log('\n✅ 测试完成');
    
  } catch (error) {
    console.error('❌ 测试失败:', error.message);
  } finally {
    await browser.close();
  }
})();