import { chromium } from 'playwright';
const browser = await chromium.launch({ executablePath: 'C:/Program Files/Google/Chrome/Application/chrome.exe' });

async function login(p) {
  await p.goto('http://localhost:4200/login', { waitUntil: 'networkidle' });
  await p.waitForTimeout(600);
  await p.fill('input[type="tel"]', '13800138000');
  await p.fill('input[type="text"][maxlength="6"]', '123456');
  await p.click('button[type="submit"]');
  await p.waitForTimeout(3000);
}

// 全新 context = 无缓存,Cache-Control: no-store 双保险
const ctx = await browser.newContext({ viewport: { width: 1440, height: 900 }, bypassCSP: true });
const p = await ctx.newPage();
await p.route('**/*', r => r.continue());
const errs = [];
p.on('pageerror', e => errs.push(e.message.slice(0,120)));
p.on('console', m => { if (m.type()==='error') errs.push(m.text().slice(0,120)); });

await login(p);
await p.goto('http://localhost:4200/desktop/workbench', { waitUntil: 'networkidle' });
await p.waitForTimeout(2500);

const probe = await p.evaluate(() => ({
  url: location.pathname,
  h1: document.querySelector('h1')?.textContent?.trim(),
  stats: document.querySelectorAll('ui-statistic').length,
  cards: document.querySelectorAll('ui-card').length,
  oldCards: document.querySelectorAll('.agent-card').length,
  oldMetric: document.querySelectorAll('.bar').length,
  demoWord: document.body.innerText.includes('演示数据'),
  overflowX: document.documentElement.scrollWidth > document.documentElement.clientWidth,
  scrollW: document.documentElement.scrollWidth,
  clientW: document.documentElement.clientWidth,
}));
console.log('=== 工作台(1440×900, 无缓存) ===');
console.log(JSON.stringify(probe, null, 2));
if (errs.length) console.log('⚠ 控制台错误:', errs.slice(0,3));
else console.log('✅ 无控制台错误');

await p.screenshot({ path: '../../.shots/dk-workbench-NEW.png' });

// 宽屏 1920 验证流动布局
await p.setViewportSize({ width: 1920, height: 1080 });
await p.waitForTimeout(1200);
const wide = await p.evaluate(() => ({
  cols: getComputedStyle(document.querySelector('.grid')).gridTemplateColumns,
  scrollW: document.documentElement.scrollWidth,
  clientW: document.documentElement.clientWidth,
}));
console.log('\n=== 1920×1080 流动布局 ===');
console.log('卡片网格列:', wide.cols);
await p.screenshot({ path: '../../.shots/dk-workbench-1920.png' });

// 窄窗 1100 验证降级
await p.setViewportSize({ width: 1100, height: 900 });
await p.waitForTimeout(1200);
await p.screenshot({ path: '../../.shots/dk-workbench-1100.png' });
console.log('\n✅ 截图已出:dk-workbench-NEW / -1920 / -1100');
await browser.close();