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

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

  console.log('打开统计页面...');
  await page.goto('http://localhost:5173/statistics', { waitUntil: 'networkidle', timeout: 15000 });
  await page.waitForTimeout(3000);

  // 检查页面内容
  const bodyHTML = await page.evaluate(() => document.body.innerHTML.substring(0, 2000));
  console.log('\n页面 body 前2000字符:');
  console.log(bodyHTML);

  // 查找所有包含 chart 的 class
  const chartElements = await page.evaluate(() => {
    const all = document.querySelectorAll('*');
    const result = [];
    all.forEach(el => {
      if (el.className && typeof el.className === 'string' && el.className.includes('chart')) {
        result.push({
          tag: el.tagName,
          class: el.className,
          hasCanvas: el.querySelector('canvas') ? 'has canvas' : 'no canvas'
        });
      }
    });
    return result;
  });
  console.log('\n包含 chart 的元素:');
  console.log(JSON.stringify(chartElements, null, 2));

  // 查找 echarts 相关的 canvas
  const allCanvases = await page.evaluate(() => {
    const canvases = document.querySelectorAll('canvas');
    return Array.from(canvases).map(c => ({
      parent: c.parentElement?.className || c.parentElement?.tagName,
      width: c.width,
      height: c.height
    }));
  });
  console.log('\n页面中所有 canvas:');
  console.log(JSON.stringify(allCanvases, null, 2));

  await browser.close();
}

runChartSwitchTest()
  .then(() => process.exit(0))
  .catch(e => {
    console.error('测试失败:', e);
    process.exit(1);
  });