HTMLAssertion v0.1.3 HTMLAssertion View Source
HTMLAssertion adds assertions for testing rendered HTML using CSS selectors.
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 # Imports assert_select, refute_select
# 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
Link to this section Summary
Functions
Asserts an attributes in HTML element
Link to this section Types
Link to this type
attribute_name() View Source
HTML element attribute name
Link to this type
attributes()
View Source
attributes()
View Source
attributes() :: [{attribute_name(), value()}]
attributes() :: [{attribute_name(), value()}]
HTML element attributes
Link to this type
css_selector()
View Source
css_selector()
View Source
css_selector() :: String.t()
css_selector() :: String.t()
CSS selector
Supported selectors
Pattern | Description |
---|---|
* | any element |
E | an element of type E |
E[foo] | an E element with a "foo" attribute |
E[foo="bar"] | an E element whose "foo" attribute value is exactly equal to "bar" |
E[foo~="bar"] | an E element whose "foo" attribute value is a list of whitespace-separated values, one of which is exactly equal to "bar" |
E[foo^="bar"] | an E element whose "foo" attribute value begins exactly with the string "bar" |
E[foo$="bar"] | an E element whose "foo" attribute value ends exactly with the string "bar" |
E[foo*="bar"] | an E element whose "foo" attribute value contains the substring "bar" |
E[foo|="en"] | an E element whose "foo" attribute has a hyphen-separated list of values beginning (from the left) with "en" |
E:nth-child(n) | an E element, the n-th child of its parent |
E:first-child | an E element, first child of its parent |
E:last-child | an E element, last child of its parent |
E:nth-of-type(n) | an E element, the n-th child of its type among its siblings |
E:first-of-type | an E element, first child of its type among its siblings |
E:last-of-type | an E element, last child of its type among its siblings |
E.warning | an E element whose class is "warning" |
E#myid | an E element with ID equal to "myid" |
E:not(s) | an E element that does not match simple selector s |
E F | an F element descendant of an E element |
E > F | an F element child of an E element |
E + F | an F element immediately preceded by an E element |
E ~ F | an F element preceded by an E element |
Link to this type
html()
View Source
html()
View Source
html() :: String.t()
html() :: String.t()
HTML response
Link to this type
value() View Source
Checking value
- if nil should not exist
Link to this section Functions
Link to this function
assert_select(html, value) View Source
Asserts an attributes in HTML element
assert attributes
:text
– asserts a text element in HTML:match
- asserts containing value in html
iex> html = ~S{<div class="foo bar"></div><div class="zoo bar"></div>}
...> assert_select(html, ".zoo", class: "bar zoo")
~S{<div class="foo bar"></div><div class="zoo bar"></div>}
# check if `id` not exsists
iex> assert_select(~S{<div>text</div>}, id: nil)
"<div>text</div>"
Examples check :text
Asserts a text element in HTML
iex> html = ~S{<h1 class="title">Header</h1>}
...> assert_select(html, text: "Header")
~S{<h1 class="title">Header</h1>}
iex> html = ~S{<div class="container"> <h1 class="title">Header</h1> </div>}
...> assert_select(html, ".title", text: "Header")
~S{<div class="container"> <h1 class="title">Header</h1> </div>}
iex> html = ~S{<h1 class="title">Header</h1>}
...> try do
...> assert_select(html, text: "HEADER")
...> rescue
...> e in ExUnit.AssertionError -> e
...> end
%ExUnit.AssertionError{
left: "HEADER",
right: "Header",
message: "Comparison `text` attribute failed.\n\n\t<h1 class=\"title\">Header</h1>.\n"
}
iex> html = ~S{<div class="foo">Some & text</div>}
...> assert_select(html, text: "Some & text")
~S{<div class="foo">Some & text</div>}
Selector
assert_select(html, "css selector")
iex> html = ~S{<p><div class="foo"><h1>Header</h1></div></p>}
...> assert_select(html, "p .foo h1")
~S{<p><div class="foo"><h1>Header</h1></div></p>}
iex> html = ~S{<p><div class="foo"><h1>Header</h1></div></p>}
...> assert_select(html, "h1")
~S{<p><div class="foo"><h1>Header</h1></div></p>}
Match elements in HTML
assert_select(html, ~r{<p>Hello</p>})
assert_select(html, match: ~r{<p>Hello</p>})
assert_select(html, match: "<p>Hello</p>")
\# Asserts a text element in HTML
Examples
iex> html = ~S{<div class="container"> <h1 class="title">Hello World</h1> </div>}
...> assert_select(html, "h1", "Hello World") == html
true
iex> html = ~S{<div class="container"> <h1 class="title">Hello World</h1> </div>}
...> assert_select(html, ".title", ~r{World})
~S{<div class="container"> <h1 class="title">Hello World</h1> </div>}
assert elements in selector
assert_select(html, ".container table", ~r{<p>Hello</p>})
Link to this function
assert_select(html, value, block_fn) View Source
Link to this function
assert_select(html, css_selector, attributes, block_fn \\ nil)
View Source
assert_select(html, css_selector, attributes, block_fn \\ nil)
View Source
assert_select(html(), css_selector(), value(), block_fn() | nil) ::
html() | no_return()
assert_select(html(), css_selector(), attributes(), block_fn() | nil) ::
html() | no_return()
assert_select(html(), css_selector(), value(), block_fn() | nil) :: html() | no_return()
assert_select(html(), css_selector(), attributes(), block_fn() | nil) :: html() | no_return()
Link to this function
refute_select(html, value) View Source
Link to this function
refute_select(html, value, block_fn) View Source
Link to this function
refute_select(html, css_selector, attributes, block_fn \\ nil)
View Source
refute_select(html, css_selector, attributes, block_fn \\ nil)
View Source
refute_select(html(), css_selector(), value(), block_fn() | nil) ::
html() | no_return()
refute_select(html(), css_selector(), attributes(), block_fn() | nil) ::
html() | no_return()
refute_select(html(), css_selector(), value(), block_fn() | nil) :: html() | no_return()
refute_select(html(), css_selector(), attributes(), block_fn() | nil) :: html() | no_return()