// 完整TDD测试流程 - 添加5元交通支出验证
const { chromium } = require('playwright');

async function runTDDTest() {
  console.log('='.repeat(60));
  console.log('TDD测试: 添加5元交通支出验证');
  console.log('='.repeat(60));

  const browser = await chromium.launch({ headless: false });
  const context = await browser.newContext({
    viewport: { width: 1920, height: 1080 }
  });
  const page = await context.newPage();
  const baseUrl = 'http://localhost:5173';

  const testResults = {
    passed: [],
    failed: [],
    screenshots: []
  };

  try {
    // ========== 步骤1: 打开记账页面 ==========
    console.log('\n[步骤1] 打开记账页面 http://localhost:5173/record');
    await page.goto(`${baseUrl}/record`, { waitUntil: 'networkidle', timeout: 30000 });
    await page.waitForTimeout(2000);

    const recordPageTitle = await page.$('.page-title');
    console.log(`  - 页面标题: ${recordPageTitle ? '✅' : '❌'}`);

    // 截图记录页面（添加前）
    await page.screenshot({ path: 'd:/Users/kaifa/Trae_cn260425/testing-archive/tdd_test/01_record_page_before.png', fullPage: true });
    console.log('  - 截图: 01_record_page_before.png');
    testResults.screenshots.push('01_record_page_before.png');

    // ========== 步骤2: 点击"新增账单"按钮 ==========
    console.log('\n[步骤2] 点击"新增账单"按钮');
    const addBtn = await page.$('#addBtn');
    if (addBtn) {
      await addBtn.click();
      console.log('  - 新增按钮: ✅ 点击成功');
      await page.waitForTimeout(500);
    } else {
      throw new Error('未找到新增按钮 #addBtn');
    }

    // 截图弹窗
    await page.screenshot({ path: 'd:/Users/kaifa/Trae_cn260425/testing-archive/tdd_test/02_modal_opened.png', fullPage: true });
    console.log('  - 截图: 02_modal_opened.png');
    testResults.screenshots.push('02_modal_opened.png');

    // ========== 步骤3: 填写表单 ==========
    console.log('\n[步骤3] 填写表单');
    console.log('  - 类型: 支出（默认）');

    // 输入金额
    const amountInput = await page.$('#amount');
    if (amountInput) {
      await amountInput.fill('5');
      console.log('  - 金额: ✅ 输入 5');
    } else {
      throw new Error('未找到金额输入框 #amount');
    }

    // 选择"交通"分类
    const trafficCategory = await page.$('[data-category="交通"]');
    if (trafficCategory) {
      await trafficCategory.click();
      console.log('  - 分类: ✅ 选择"交通"');
    } else {
      throw new Error('未找到交通分类按钮 [data-category="交通"]');
    }

    // 填写备注
    const noteInput = await page.$('#note');
    if (noteInput) {
      await noteInput.fill('地铁测试');
      console.log('  - 备注: ✅ 输入"地铁测试"');
    } else {
      throw new Error('未找到备注输入框 #note');
    }

    // 截图表单填写完成
    await page.screenshot({ path: 'd:/Users/kaifa/Trae_cn260425/testing-archive/tdd_test/03_form_filled.png', fullPage: true });
    console.log('  - 截图: 03_form_filled.png');
    testResults.screenshots.push('03_form_filled.png');

    // ========== 步骤4: 点击"保存记录" ==========
    console.log('\n[步骤4] 点击"保存记录"');
    const submitBtn = await page.$('button[type="submit"]');
    if (submitBtn) {
      await submitBtn.click();
      console.log('  - 保存按钮: ✅ 点击成功');
    } else {
      throw new Error('未找到保存按钮 button[type="submit"]');
    }

    // 等待保存成功toast
    await page.waitForTimeout(3000);

    // 截图保存后
    await page.screenshot({ path: 'd:/Users/kaifa/Trae_cn260425/testing-archive/tdd_test/04_after_save.png', fullPage: true });
    console.log('  - 截图: 04_after_save.png');
    testResults.screenshots.push('04_after_save.png');

    // ========== 步骤5: 验证记账页面 ==========
    console.log('\n[步骤5] 验证记账页面数据');

    // 检查是否有"交通 - 5元"的记录
    const recordItems = await page.$$('.record-item');
    console.log(`  - 账单记录数量: ${recordItems.length}`);

    let trafficRecordFound = false;
    for (const item of recordItems) {
      const title = await item.$('.record-title');
      const amount = await item.$('.record-amount');
      if (title && amount) {
        const titleText = await title.textContent();
        const amountText = await amount.textContent();
        console.log(`    记录: ${titleText} - ${amountText}`);
        if (titleText === '交通' && amountText.includes('5')) {
          trafficRecordFound = true;
        }
      }
    }

    if (trafficRecordFound) {
      console.log('  - 验证结果: ✅ 找到"交通 - 5元"记录');
      testResults.passed.push('记账页面显示交通支出5元');
    } else {
      console.log('  - 验证结果: ❌ 未找到"交通 - 5元"记录');
      testResults.failed.push('记账页面未显示交通支出5元');
    }

    // 关闭弹窗（如果还开着）
    const closeBtn = await page.$('#closeModal');
    if (closeBtn) {
      await closeBtn.click();
      await page.waitForTimeout(500);
    }

    // 再次截图确认
    await page.screenshot({ path: 'd:/Users/kaifa/Trae_cn260425/testing-archive/tdd_test/05_record_page_after.png', fullPage: true });
    console.log('  - 截图: 05_record_page_after.png');
    testResults.screenshots.push('05_record_page_after.png');

    // ========== 步骤6: 导航到统计页面 ==========
    console.log('\n[步骤6] 导航到统计页面 http://localhost:5173/statistics');
    await page.goto(`${baseUrl}/statistics`, { waitUntil: 'networkidle', timeout: 30000 });
    await page.waitForTimeout(2000);

    // 截图统计页面
    await page.screenshot({ path: 'd:/Users/kaifa/Trae_cn260425/testing-archive/tdd_test/06_statistics_page.png', fullPage: true });
    console.log('  - 截图: 06_statistics_page.png');
    testResults.screenshots.push('06_statistics_page.png');

    // ========== 步骤7: 验证统计页面 ==========
    console.log('\n[步骤7] 验证统计页面数据');

    // 查找交通支出数据（应该是30元 = 25 + 5）
    const chartCards = await page.$$('.chart-card');
    console.log(`  - 图表卡片数量: ${chartCards.length}`);

    // 尝试多种方式查找交通支出数据
    const pageContent = await page.content();
    const hasTraffic30 = pageContent.includes('30') && pageContent.includes('交通');

    // 查找类别统计
    const categoryStats = await page.$$('.category-stat');
    if (categoryStats.length > 0) {
      for (const stat of categoryStats) {
        const statText = await stat.textContent();
        if (statText && statText.includes('交通')) {
          console.log(`    找到交通统计: ${statText}`);
          if (statText.includes('30')) {
            console.log('  - 验证结果: ✅ 交通支出显示为30元');
            testResults.passed.push('统计页面显示交通支出30元');
          } else {
            console.log('  - 验证结果: ⚠️ 交通支出不是30元');
            testResults.failed.push('统计页面交通支出不是30元');
          }
        }
      }
    } else {
      // 直接搜索页面中的金额
      const expenseData = await page.evaluate(() => {
        const body = document.body.innerText;
        // 查找所有包含"交通"和金额的行
        const lines = body.split('\n');
        for (const line of lines) {
          if (line.includes('交通') && (line.includes('25') || line.includes('30'))) {
            return line;
          }
        }
        return null;
      });

      if (expenseData) {
        console.log(`    找到交通数据: ${expenseData}`);
        if (expenseData.includes('30')) {
          console.log('  - 验证结果: ✅ 交通支出显示为30元');
          testResults.passed.push('统计页面显示交通支出30元');
        }
      } else {
        console.log('  - 验证结果: ⚠️ 未明确找到交通支出30元数据');
        testResults.failed.push('统计页面未找到交通支出30元');
      }
    }

    // ========== 步骤8: 验证Dashboard首页 ==========
    console.log('\n[步骤8] 导航到Dashboard首页验证数据');
    await page.goto(`${baseUrl}/`, { waitUntil: 'networkidle', timeout: 30000 });
    await page.waitForTimeout(2000);

    await page.screenshot({ path: 'd:/Users/kaifa/Trae_cn260425/testing-archive/tdd_test/07_dashboard_page.png', fullPage: true });
    console.log('  - 截图: 07_dashboard_page.png');
    testResults.screenshots.push('07_dashboard_page.png');

    // 查找Dashboard中的支出数据
    const dashboardContent = await page.evaluate(() => {
      const body = document.body.innerText;
      const lines = body.split('\n');
      const relevantLines = [];
      for (const line of lines) {
        if (line.includes('交通') || (line.includes('支出') && line.match(/\d+/))) {
          relevantLines.push(line.trim());
        }
      }
      return relevantLines.slice(0, 10);
    });

    if (dashboardContent.length > 0) {
      console.log('  - Dashboard相关数据:');
      dashboardContent.forEach(line => console.log(`    ${line}`));
    }

  } catch (error) {
    console.error(`\n❌ 测试执行出错: ${error.message}`);
    testResults.failed.push(`测试执行错误: ${error.message}`);

    await page.screenshot({ path: 'd:/Users/kaifa/Trae_cn260425/testing-archive/tdd_test/error_screenshot.png', fullPage: true });
    testResults.screenshots.push('error_screenshot.png');
  } finally {
    await browser.close();
  }

  // ========== 测试报告 ==========
  console.log('\n' + '='.repeat(60));
  console.log('TDD测试报告');
  console.log('='.repeat(60));
  console.log(`\n通过项 (${testResults.passed.length}):`);
  testResults.passed.forEach(item => console.log(`  ✅ ${item}`));

  if (testResults.failed.length > 0) {
    console.log(`\n失败项 (${testResults.failed.length}):`);
    testResults.failed.forEach(item => console.log(`  ❌ ${item}`));
  }

  console.log(`\n截图文件:`);
  testResults.screenshots.forEach(file => console.log(`  - ${file}`));

  console.log('\n' + '='.repeat(60));
  if (testResults.failed.length === 0) {
    console.log('🎉 测试结果: 全部通过!');
  } else {
    console.log(`⚠️ 测试结果: ${testResults.failed.length}项失败`);
  }
  console.log('='.repeat(60));

  return testResults;
}

runTDDTest().catch(console.error);