TDD - Open `left` in a browser

Questions / Help
,
1

Wenn I run a test which assert html_response(conn, 200) =~ something but fails I get the HTML code of the left side of the test displayed in the terminal. But since it can be a very long on complex webpage that often doesn’t help me a lot (very hard to read through it in the terminal).

Is there a way to fire up a web browser with that code or to put it in the clipboard?

$ mix test
.....

  1) test GET / (FeriendatenWeb.VacationSlugControllerTest)
     test/feriendaten_web/controllers/vacation_slug_controller_test.exs:6
     Assertion with =~ failed
     code:  assert html_response(conn, 200) =~ "Sommerferien 2029"
     left:  "<!DOCTYPE html>\n<html lang=\"de\">\n  <head>\n    <meta charset=\"utf-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n    <meta name=\"csrf-token\" content=\"I1VVFRFvKAE4TFEOGgwHPDQJPF46AD8Hm1aEs0oWVt4yic4cG0Y4V1Pj\">\n    <title>\nSommerferien Hessen\n    </title> [...]
2 Likes
2

Yeah, that would be nice to have. I remember how the screenshot helpers would often come in handy when testing Ruby on Rails apps.

To copy it your clipbaord, you could do something like this:

describe "index" do
  test "lists all posts", %{conn: conn} do
    conn = get(conn, ~p"/posts")

    port = Port.open({:spawn, "pbcopy"}, []) # pbcopy for mac, xsel for linux, etc.
    true = Port.command(port, html_response(conn, 200))
    true = Port.close(port)

    # assert html_response(conn, 200) =~ "Listing Posts"
  end
end
2 Likes
3

LiveView has open_browser function. You cannot use it directly, because it expects a view or element as an input, not an HTML string, but perhaps you can use it as an inspiration to write your custom browser opening function.

This is also why I’m not exactly a fan of this kind of testing - checking if X is a substring of a very long HTML string. Perhaps it’s better to parse the string with Floki and look for an exact element. Then you would at least know if the problem is that the element does not exist or maybe it exists, but has a different value.

5 Likes