import { chromium } from '/Users/simon-pierreboucher/Desktop/uqo-eval/node_modules/playwright/index.mjs';
const BASE = process.argv[2] ?? 'http://localhost:8290';
const OUT = new URL('./screens/compare-rankings/seg/', import.meta.url).pathname;
import { mkdirSync } from 'node:fs'; mkdirSync(OUT, { recursive: true });
const SHOTS = [
  ['cmp-snapshot', '/compare/canada/united-states/france', 390, [0, 700]],
  ['cmp-economy', '/compare/canada/united-states/france?tab=economy', 390, [0, 900, 1800]],
  ['cmp-hero', '/compare/canada/united-states/france?tab=economy&indicator=gdp-per-capita&from=1990&mode=index100', 390, [0, 700]],
  ['cmp-economy', '/compare/canada/united-states/france?tab=economy', 1280, [0, 900, 1800]],
  ['cmp-hero', '/compare/canada/united-states/france?tab=economy&indicator=gdp-per-capita&from=1990&mode=index100', 1280, [0]],
  ['rankings', '/rankings', 390, [0, 800]],
  ['rankings', '/rankings', 1280, [0, 900]],
  ['rk-gdppc', '/rankings/gdp-per-capita', 390, [0, 800, 2600, 3600]],
  ['rk-gdppc', '/rankings/gdp-per-capita', 1280, [900, 1800]],
  ['rk-life-oecd', '/rankings/life-expectancy?group=oecd', 390, [0, 1200]],
  ['rk-life-oecd', '/rankings/life-expectancy?group=oecd', 1280, [0, 1600]],
];
const b = await chromium.launch();
for (const [name, path, w, offsets] of SHOTS) {
  const mobile = w < 768;
  const ctx = await b.newContext({ viewport: { width: w, height: mobile ? 844 : 900 }, isMobile: mobile, hasTouch: mobile, deviceScaleFactor: 1 });
  const pg = await ctx.newPage();
  await pg.goto(BASE + path, { waitUntil: 'networkidle' });
  await pg.waitForTimeout(600);
  for (const y of offsets) {
    await pg.evaluate((yy) => window.scrollTo(0, yy), y);
    await pg.waitForTimeout(700);
    await pg.screenshot({ path: `${OUT}${name}-${w}-y${y}.png` });
  }
  await ctx.close();
}
await b.close();
console.log('done');