Skip to content
/ elogram Public

A mechanism to capture screenshots from Phoenix LiveView tests without a camera.

License

Notifications You must be signed in to change notification settings

mcrumm/elogram

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ELogram

Capture screenshots with the Phoenix.LiveViewTest Element API.

This package is EXPERIMENTAL and should not be used by anyone.

Installation

The package can be installed by adding elogram to your list of dependencies in mix.exs:

def deps do
  [
    {:elogram,
       only: :test, git: "https://github.com/mcrumm/elogram.git"}
  ]
end

Capturing Screenshots

Start the screenshots server in test/test_helper.exs:

+ Elogram.start([])
ExUnit.start()

Then capture a screenshot from your LiveView:

defmodule MyAppWeb.PageLiveTest do
  use MyAppWeb.ConnCase

  import Phoenix.LiveViewTest
  import Elogram.CaptureScreenshot

  test "a thousand words", %{conn: conn} end
    {:ok, view, _} = live(conn, "/")

    assert view
           |> capture_screenshot(name: "welcome.png")
           |> render() =~ "Welcome to Phoenix!"
  end
end

Test Setup

Headless Chrome

Start a headless browser before running your tests:

Github Actions

steps:
    - name: Start Google Chrome
      run: google-chrome --headless --disable-gpu --remote-debugging-port=9222 &

MacOS

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --headless --disable-gpu --remote-debugging-port=9222

Save Path

By default screenshots will be saved to tmp/screenshots, so you may wish to update your .gitignore file to include the tmp directory:

# Temporary files for e.g. tests
/tmp

Releases

No releases published

Packages

No packages published

Languages