Snapshot Site TypeScript SDK

Official TypeScript SDK for the Snapshot Site API.

Install

pnpm add @snapshot-site/sdk

Usage

import { SnapshotSiteClient } from "@snapshot-site/sdk";

const client = new SnapshotSiteClient({
  apiKey: process.env.SNAPSHOT_SITE_API_KEY!,
});

const shot = await client.screenshot({
  url: "https://snapshot-site.com",
  format: "png",
  fullSize: true,
});

Complete examples

Screenshot

import { SnapshotSiteClient } from "@snapshot-site/sdk";

const client = new SnapshotSiteClient({
  apiKey: process.env.SNAPSHOT_SITE_API_KEY!,
});

const result = await client.screenshot({
  url: "https://snapshot-site.com/pricing",
  format: "png",
  width: 1440,
  fullSize: true,
  hideCookie: true,
});

console.log(result.link);

Analyze

import { SnapshotSiteClient } from "@snapshot-site/sdk";

const client = new SnapshotSiteClient({
  apiKey: process.env.SNAPSHOT_SITE_API_KEY!,
});

const analysis = await client.analyze({
  url: "https://snapshot-site.com",
  width: 1440,
  fullSize: true,
  enableSummary: true,
  enableQuality: true,
});

console.log(analysis.summary);
console.log(analysis.quality);

Compare

import { SnapshotSiteClient } from "@snapshot-site/sdk";

const client = new SnapshotSiteClient({
  apiKey: process.env.SNAPSHOT_SITE_API_KEY!,
});

const diff = await client.compare({
  before: {
    url: "https://snapshot-site.com/pricing",
    width: 1440,
    fullSize: true,
    hideCookie: true,
  },
  after: {
    url: "https://staging.snapshot-site.com/pricing",
    width: 1440,
    fullSize: true,
    hideCookie: true,
  },
  threshold: 0.1,
});

console.log(diff.diff?.link);
console.log(diff.summary?.mismatchPercentage);

Methods

• client.screenshot(payload)
• client.analyze(payload)
• client.compare(payload)