import { chromium } from 'playwright-core';
import { PAGE, HAND } from './paths.mjs';
// every route selected in turn, on every map: the route panel must never overflow sideways
const b = await chromium.launch({ executablePath: process.env.CH });
const bad = [];
for (const [w, h] of [[1440, 900], [1024, 768], [390, 844]]) {
  const p = await b.newPage({ viewport: { width: w, height: h } });
  await p.goto(PAGE('web/index.html'), { waitUntil: 'load' }); await p.waitForTimeout(2500);
  for (const v of ['globe', 'ae', 'dp', 'merc']) {
    await p.click(`.models button[data-v="${v}"]`); await p.waitForTimeout(1100);
    const r = await p.evaluate(() => { const out = []; for (const q of LP) { select(q.idx); for (const el of document.querySelectorAll('#card .body, #card .row')) if (el.scrollWidth > el.clientWidth + 1) { out.push(`${LS[q.a].name}-${LS[q.b].name} ${el.className} ${el.scrollWidth}>${el.clientWidth}`); break } } return out; });
    if (r.length) bad.push(`${w}x${h} ${v}: ${r.length} routes overflow, e.g. ${r[0]}`);
  }
  await p.close();
}
console.log('CARD OVERFLOW', bad.length ? bad.join('\n') : 'none'); await b.close();