Programmatic API

Use ViSnap programmatically or build custom tooling on top of its packages. This is useful when you need to integrate visual testing into custom workflows, build custom reporters, or create automated testing pipelines.

Packages

• @visnap/core: High-level APIs (runVisualTests, updateBaseline, initializeProject) and utilities
• @visnap/protocol: Shared TypeScript types and interfaces
• @visnap/reporter: JSON and HTML reporters

Core API

import { runVisualTests, updateBaseline, initializeProject } from '@visnap/core';

runVisualTests(options): Promise<TestResult>

Runs visual tests against your current codebase and compares with baseline screenshots.

import { runVisualTests } from '@visnap/core';

const result = await runVisualTests({
  configPath: './visnap.config.ts',
  // ... other options
});

console.log(`Tests completed: ${result.passed}/${result.total}`);

updateBaseline(options): Promise<void>

Updates baseline screenshots with current UI state.

import { updateBaseline } from '@visnap/core';

await updateBaseline({
  configPath: './visnap.config.ts',
  // ... other options
});

initializeProject(options): Promise<InitResult>

Initializes a new ViSnap project with configuration.

import { initializeProject } from '@visnap/core';

const result = await initializeProject({
  projectPath: './my-project',
  adapters: ['storybook', 'url']
});

Protocol Types

import type { VisualTestingToolConfig, InteractionAction } from '@visnap/protocol';

• Configuration model: adapters, comparison, viewport, runtime, reporter
• Interaction actions: click, dblclick, type, fill, press, wait, etc.

Reporters

import { JsonReporter, HtmlReporter } from '@visnap/reporter';

• JSON: machine-readable results
• HTML: interactive report