Authenticating and testing LiveViews

[travisf]

I’m having trouble testing a LiveView with my Guardian plug.

I have a store that shows a list of products but only to authenticated users. The products are on a LiveView page.
I’ve set up a simple LiveView test (I’ve never written LiveView tests before so I’m not 100% sure this is how you would set it up).

defmodule StoreWeb.PartLiveTest do
  @moduledoc false

  use StoreWeb.ConnCase
  import PacksizeNow.Factory
  import Phoenix.LiveViewTest
  alias StoreWeb.PartLive.Index
  
  test "Returns the live-path to edit an item", %{conn: conn} do

    html = live(conn, "/live/store")
   #assertions to follow below

  end
end

This results in an error:

{:error,
 {:redirect,
  %{
    flash: "SVMNNTY.g2gDdGGGAAACBuBgCPpiwbdwFiAAFRgA.mpLMgb29Cm12wj8XthKTuSFnIu6pD5lffBSfZWJM",
    to: "/sign-in"
  }}}

Which I would expect because this page is piped through a Guardian plug.

In controller tests, we use a method called to_authenticated to authenticate users.

def to_authenticated(%Conn{} = conn, %{} = user), do: GuardianPlug.sign_in(conn, user)

But adding this to my test does not authenticate the user, I still get the same error message. It seems like the LiveView is traversing a different path than the controllers and that sign_in/2 does not work the same way in these tests.

What is the best way to authenticate a session for LiveView tests? Has anyone else used Guardian for authentication and tested LiveViews?

[Exadra37]

@travisf

(I’ve never written LiveView tests before so I’m not 100% sure this is how you would set it up).

I cannot help your directly with your question, but I can point you to some resources:

Searching for a blogpost about testing live view

This one is pretty basic, yet might be helpful:

Searching for a blogpost about testing live view

there’s also a talk from the same author (German Velasco) that’s already pointed to above, see here: https://www.youtube.com/watch?v=h8NURVLysrk And he has another blog post https://www.germanvelasco.com/blog/using-has-element-for-better-liveviewtest-assertions Another thing that could help you is this: https://github.com/dashbitco/bytepack_archive/tree/main/apps/bytepack_web/test/bytepack_web/live The source code behind bytepack from the ‘makers’ themselves AFAICS it’s not usin…

Or this upcoming course by @germsvel:

Testing LiveView

[travisf]

Thanks @Exadra37, there are definitely good LiveView resources out there but nothing on how to Authenticate the conn with Guardian before running the tests.

[rjk]

There’s an example in the sense of example code inside the bytepack source code repo linked above, but this is for phx.gen.auth and not specifically for guardian. (but i think it should be possible to adapt it yourself to guardian) The exact file/test can be seen here: https://github.com/dashbitco/bytepack_archive/blob/main/apps/bytepack_web/test/bytepack_web/live/admin/seller_live_test.exs

Then you have the pragmaticstudio.com phoenix paid course which also explains testing a live-view with phx.gen.auth in lesson 29 but it’s very short / not that much material, mostly because it’s also pretty short to do. (But it has a pretty thorough walkthrough of using phx.gen.auth of about 30 mins before it (lesson 28) if you would like to switch over )

Lastly, I did a github.com wide code search given this query: guardian "Phoenix.LiveViewTest" language:elixir and only one repo/commit came up namely the following: https://github.com/NicFisher/elixir-todo/blob/master/test/todo_web/live_views/live_view_board_test.exs
This is actually a test mixing authenticating live view and guardian, so all these combined should put you well on your way forward hopefully! If not, you could always post some minimal repo example and people are better able to help through code.

Happy coding!

[travisf]

Thanks @rjk,
NicFisher’s Todo had the answer:

Plug.Test.init_test_session(conn, guardian_default_token: conn.private.guardian_default_token)

was the missing link!