Raxol.UI.VisualTest (Raxol v2.6.0)

Visual regression testing utilities for Raxol applications.

Provides helpers for capturing screenshots, comparing renders, and detecting visual regressions in component output.

Usage

defmodule MyComponentVisualTest do
  use ExUnit.Case
  import Raxol.UI.VisualTest

  test "button renders correctly" do
    result = render_snapshot(MyButton, label: "Click")
    assert_snapshot(result, "button_default")
  end

  test "button hover state" do
    result = render_snapshot(MyButton, label: "Click", state: :hover)
    assert_snapshot(result, "button_hover")
  end
end

Snapshot Storage

Snapshots are stored in test/snapshots/ by default. The first run creates baseline snapshots, subsequent runs compare against them.

Summary

Functions

assert_different(snapshot_a, snapshot_b)

Assert that two snapshots are different.

assert_identical(snapshot_a, snapshot_b)

Assert that two snapshots are visually identical.

assert_snapshot(snapshot, name, opts \\ [])

Assert that a snapshot matches the stored baseline.

compare_renders(snapshot_a, snapshot_b)

Compare two renders and return the differences.

delete_snapshot(name, opts \\ [])

Delete a snapshot.

list_snapshots(opts \\ [])

List all snapshots in the snapshot directory.

render_snapshot(component, opts \\ [])

Render a component and capture it as a snapshot.

visual_diff(snapshot_a, snapshot_b)

Generate a visual diff representation.

Functions

assert_different(snapshot_a, snapshot_b)

@spec assert_different(map(), map()) :: :ok

Assert that two snapshots are different.

Example

assert_different(snapshot_a, snapshot_b)

assert_identical(snapshot_a, snapshot_b)

@spec assert_identical(map(), map()) :: :ok

Assert that two snapshots are visually identical.

Example

assert_identical(snapshot_a, snapshot_b)

assert_snapshot(snapshot, name, opts \\ [])

@spec assert_snapshot(map(), String.t(), keyword()) :: :ok

Assert that a snapshot matches the stored baseline.

On first run, creates the baseline. On subsequent runs, compares against the baseline and fails if different.

Options

:update - Force update the baseline (default: false)
:snapshot_dir - Custom snapshot directory

Example

assert_snapshot(snapshot, "my_component_default")

compare_renders(snapshot_a, snapshot_b)

@spec compare_renders(map(), map()) :: map()

Compare two renders and return the differences.

Example

diff = compare_renders(old_snapshot, new_snapshot)

delete_snapshot(name, opts \\ [])

@spec delete_snapshot(
  String.t(),
  keyword()
) :: :ok | {:error, term()}

Delete a snapshot.

Example

delete_snapshot("my_component_default")

list_snapshots(opts \\ [])

@spec list_snapshots(keyword()) :: [String.t()]

List all snapshots in the snapshot directory.

Example

snapshots = list_snapshots()

render_snapshot(component, opts \\ [])

@spec render_snapshot(
  module(),
  keyword()
) :: %{
  content: String.t(),
  width: non_neg_integer(),
  height: non_neg_integer(),
  component: module(),
  props: keyword(),
  checksum: String.t()
}

Render a component and capture it as a snapshot.

Options

:width - Buffer width (default: 80)
:height - Buffer height (default: 24)
Additional options are passed to the component

Example

snapshot = render_snapshot(MyButton, label: "Click", width: 20, height: 3)

visual_diff(snapshot_a, snapshot_b)

@spec visual_diff(map(), map()) :: String.t()

Generate a visual diff representation.

Returns a string showing the differences between two snapshots.

Example

diff_text = visual_diff(old_snapshot, new_snapshot)
IO.puts(diff_text)