Production-ready recipes, as URLs, cURL, and SDK calls.

const shot = await client.take({ url: "https://stripe.com" });
await shot.save("stripe.png");
console.log("cached:", shot.cached, "type:", shot.contentType);

const shot = await client.take(
  TakeOptions.url("https://stripe.com")
    .fullPage(true)
    .format("jpeg")
    .quality(85),
);
await shot.save("full.jpg");

const shot = await client.take({
  url: "https://stripe.com",
  width: 1440,
  height: 900,
  deviceScaleFactor: 2,
});
await shot.save("retina.png");

const shot = await client.take({
  url: "https://stripe.com",
  selector: ".PricingTable",
  omitBackground: true,   // transparent PNG
});
await shot.save("pricing.png");

const shot = await client.take({
  url: "https://stripe.com",
  viewportMobile: true,
  darkMode: true,
});
await shot.save("mobile-dark.png");

// The SDK base64-encodes the HTML for you.
const shot = await client.take({
  html: "<h1>Hello</h1>",
  format: "png",
});
await shot.save("html.png");

const shot = await client.take({
  url: "https://news.ycombinator.com",
  blockAds: true,
  blockTrackers: true,
  blockCookieBanners: true,
  hideSelectors: [".intercom-launcher"],
});
await shot.save("clean.png");

const shot = await client.take({
  url: "https://app.example.com",
  waitForSelector: ".dashboard-loaded",
  waitUntil: "networkidle0",
  delay: 500,
});
await shot.save("spa.png");

const shot = await client.take({
  url: "https://app.example.com/billing",
  headers: { Authorization: "Bearer token123" },
  cookies: [
    { name: "session", value: "abc", domain: "app.example.com" },
  ],
});
await shot.save("billing.png");

const shot = await client.take({
  url: "https://example.com",
  styles: ".promo-bar{display:none}",
  scripts: "document.title='Snap'",
  click: "#accept-modal .close",
});
await shot.save("patched.png");

// The fluent builder exposes .geolocation(lat, lng, accuracy).
const shot = await client.take(
  TakeOptions.url("https://example.com")
    .timezone("Europe/Paris")
    .geolocation(48.8566, 2.3522, 50),
);
await shot.save("paris.png");

// Plain-object equivalent uses flat keys:
// { geolocationLatitude: 48.8566, geolocationLongitude: 2.3522,
//   geolocationAccuracy: 50, timezone: "Europe/Paris" }

// No network call — just builds the URL string.
const imgUrl = client.generateUrl({
  url: "https://stripe.com",
  fullPage: true,
});
// => use directly in an <img src>

// Builder: .clip(x, y, width, height)
const shot = await client.take(
  TakeOptions.url("https://stripe.com").clip(0, 0, 1200, 630),
);
await shot.save("og-card.png");

// Plain-object equivalent:
// { clipX: 0, clipY: 0, clipWidth: 1200, clipHeight: 630 }

const shot = await client.take({
  url: "https://stripe.com",
  width: 1440,
  height: 900,
  imageWidth: 600,    // downscale after capture
  imageHeight: 375,
});
await shot.save("thumb.png");

const shot = await client.take({
  url: "https://example.com",
  reducedMotion: true,
  mediaType: "print",   // "screen" | "print"
});
await shot.save("print.png");

const shot = await client.take({
  url: "https://example.com",
  userAgent: "SnapshotFlowBot/1.0 (+https://example.com/bot)",
});
await shot.save("ua.png");

const pdf = await client.take({
  url: "https://example.com",
  format: "pdf",
  pdfPrintBackground: true,
  pdfLandscape: true,
  pdfPaperFormat: "a4",
});
await pdf.save("report.pdf");

const res = await client.takeJson({
  url: "https://stripe.com",
  responseType: "base64",
  extractContent: true,
  contentFormat: "markdown",
  metadata: true,
});
console.log(res.metadata?.title);
console.log(res.content?.slice(0, 200));   // markdown
// res.image -> "data:image/png;base64,..."

const url = await client.takeUrl({ url: "https://stripe.com" });
// 1-hour signed URL, ready for an <img src>
console.log(url);

const shot = await client.take({
  url: "https://example.com",
  cache: false,
});
await shot.save("fresh.png");

const batch = await client.batch({
  urls: ["https://stripe.com", "https://vercel.com"],
  fullPage: true,
  responseType: "base64",
});
console.log("total:", batch.total);
for (const r of batch.results) {
  if (r.error) console.warn(r.url, r.error);
  else console.log(r.url, r.cached);
}

const diff = await client.diff({
  before: "https://myapp.com/v1",
  after: "https://myapp.com/v2",
  threshold: 0.1,
  responseType: "json",
});
console.log(diff.diff_percent, diff.changed_pixels, diff.has_changes);