const { chromium } = require('playwright');
(async () => {
  const url = 'https://farmer.taild3aaf6.ts.net/fea/numeros/';
  const b = await chromium.launch({ args: ['--ignore-certificate-errors'] });
  const p = await b.newPage({ viewport: { width: 1440, height: 1700 }, ignoreHTTPSErrors: true, deviceScaleFactor: 2 });
  await p.goto(url, { waitUntil: 'networkidle' });
  await p.screenshot({ path: '/tmp/numeros_top.png', fullPage: false });

  // abrir las 3 cards
  await p.evaluate(() => { document.querySelectorAll('details.fea-don').forEach(d => d.open = true); });
  await p.waitForTimeout(200);
  await p.screenshot({ path: '/tmp/numeros_open.png', fullPage: false });

  const m = await p.evaluate(() => {
    const wrap = document.querySelector('.fea-don-wrap');
    const led = document.querySelector('.fea-ledger');
    const rec = document.querySelector('.fea-opt-rec');
    const rows = document.querySelectorAll('.fea-ledger tr');
    // detectar fechas que parten en 2 lineas en la primera columna
    let wrappedDates = 0;
    rows.forEach(r => { const td = r.querySelector('td'); if (td && td.getClientRects().length > 1) wrappedDates++; });
    return {
      viewport: window.innerWidth,
      wrap_width: wrap ? Math.round(wrap.getBoundingClientRect().width) : null,
      ledger_width: led ? Math.round(led.getBoundingClientRect().width) : null,
      ledger_rows: rows.length,
      rec_btns: document.querySelectorAll('.fea-rec-btns a').length,
      wrapped_date_cells: wrappedDates,
    };
  });
  console.log(JSON.stringify(m, null, 2));
  await b.close();
})();