import { chromium } from 'playwright';

const targetUrl = 'https://example.com';
const targets = [
  { name: 'iphone-se', width: 375, height: 667, dpr: 2 },
  { name: 'iphone-15', width: 393, height: 852, dpr: 3 },
  { name: 'ipad', width: 820, height: 1180, dpr: 2 },
  { name: 'macbook-air', width: 1440, height: 900, dpr: 2 }
];

const browser = await chromium.launch();
for (const target of targets) {
  const context = await browser.newContext({
    viewport: { width: target.width, height: target.height },
    deviceScaleFactor: target.dpr,
  });
  const page = await context.newPage();
  await page.goto(targetUrl, { waitUntil: 'networkidle' });
  await page.screenshot({
    path: `screenshots/${target.name}.png`,
    fullPage: true,
  });
  await context.close();
}
await browser.close();