Heyya -- Snapshot testing for Phoenix Components

Heyya is a library to help with testing your Phoenix components. It allows for writing fast tests that assert your HTML is consistent and correct. Specifically, Heyya is designed to work with many functional components and the latest Phoenix and LiveView releases. As your code changes and mutates, tests can change quickly without writing new assertions each time.

There’s a blog post up with example code and integration help here:

https://www.batteriesincl.com/posts/heyya-snapshot-testing

Hex Docs are here:

https://hexdocs.pm/heyya/readme.html

If you’ve ever used React snapshot testing, Heyya will feel very similar.

14 Likes

We are releasing Heyya 1.0.0 which includes the following:

  • Stateless component snapshot testing
  • Easier to use LiveView pipe-based view testing
  • LiveComponent testing with automatic view hosting
  • LiveView snapshot testing

When combined, these tools allow for fast testing of Phoenix UIs that are easy to maintain and easy to read.

Blog Post: Heyya Testing Library Reaches Version 1.0.0 — Batteries Included
Github: GitHub - batteries-included/heyya: Heyya the snapshot testing utility for Phoenix framework components
Docs: Heyya — heyya v1.0.0

The newest LiveView snapshot testing feature allows developers to interact with a Phoenix live view and easily assert that some portion of the DOM matches the previous expectations.

For example, here’s an excerpt taken from the example project

defmodule ExampleWeb.NumbersLiveTest do
  use Heyya.LiveCase
  use ExampleWeb.ConnCase

  test "/numbers renders the live_view", %{conn: conn} do
    conn
    |> start(~p"/numbers")
    |> assert_matches_snapshot(name: "full_view", selector: "main")
  end
end
2 Likes