Snapshot Helper

API reference for the veraSnapshot() helper function.

Import

import { veraSnapshot } from "@vera-ci/playwright-reporter";

Usage

The veraSnapshot function takes a named screenshot and automatically attaches it to the current Playwright test. Vera CI uses these named screenshots for pixel-level diffing against baselines.

import { test } from "@playwright/test";
import { veraSnapshot } from "@vera-ci/playwright-reporter";

test("my test", async ({ page }) => {
  await page.goto("/");
  await veraSnapshot(page, "homepage");
});

API

veraSnapshot(page: Page, name: string, options?: VeraSnapshotOptions): Promise<void>

Parameter	Type	Description
`page`	Page	The Playwright Page object
`name`	string	A unique name for this screenshot
`options`	VeraSnapshotOptions	Optional configuration (see below)

Options

Option	Type	Default	Description
`fullPage`	boolean	false	Capture the full scrollable page
`element`	string \| Locator	—	CSS selector or Playwright Locator to capture a specific element
`waitForStable`	number	500	Milliseconds to wait for animations to settle. Pass 0 to disable

Examples

Capture a specific element:

await veraSnapshot(page, "navigation", {
  element: "nav.main-nav",
});

Capture using a Playwright Locator:

const card = page.getByTestId("product-card");
await veraSnapshot(page, "product-card", {
  element: card,
});

Capture a full-page screenshot with no stabilization delay:

await veraSnapshot(page, "full-page", {
  fullPage: true,
  waitForStable: 0,
});

See the Playwright Quickstart for a complete setup guide.