HtmlAssertion

Build Status Hex pm Coverage Status

HTMLAssertion adds assertions for testing rendered HTML using CSS selectors.

It is very useful in Phoenix controller and integration tests.

Installation

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

def deps do
  [
    {:html_assertion, "~> 0.1.3", only: :test}
  ]
end

Usage in Phoenix Controller and Integration Test

Import the HTML assertion functions in YourAppWeb.ConnCase. Remember to replace all instances of YourApp with your app module name.

defmodule YourAppWeb.ConnCase do
  .
  .
  .
  using do
    quote do
      # Import conveniences for testing with connections
      use Phoenix.ConnTest
      alias YourAppWeb.Router.Helpers, as: Routes
      use HTMLAssertion
      # The default endpoint for testing
      @endpoint YourAppWeb.Endpoint
    end
  end
  .
  .
  .
end

Assuming the html_response(conn, 200) returns:

<!DOCTYPE html>
<html>
<head>
  <title>PAGE TITLE</title>
</head>
<body>
  <a href="/signup">Sign up</a>
  <a href="/help">Help</a>
</body>
</html>

An example controller test:

defmodule YourAppWeb.PageControllerTest do
  use YourAppWeb.ConnCase, async: true

  test "should get index", %{conn: conn} do
    conn = conn
    |> get(Routes.page_path(conn, :index))

    html_response(conn, 200)
    # Page title is "PAGE TITLE"
    |> assert_select("title", "PAGE TITLE")
    # Page title is "PAGE TITLE" and there is only one title element
    |> assert_select("title", count: 1, text: "PAGE TITLE")
    # Page title matches "PAGE" and there is only one title element
    |> assert_select("title", count: 1, match: "PAGE")
    # Page has one link with href value "/signup"
    |> assert_select("a[href='/signup']", count: 1)
    # Page has at least one link
    |> assert_select("a", min: 1)
    # Page has at most two links
    |> assert_select("a", max: 2)
    # Page contains no forms
    |> refute_select("form")
  end
end

Read the docs at https://hexdocs.pm/html_assertion.