Liveview testing render changes before submitting form

Hello I am trying to test my liveview and I want to test the editing of a resource through liveview. So I have something like this:

{:ok, view, _html} = live(conn, ~p"/my_resource/#{id}/edit")

params = %{some_key:  "some value"}

{:ok, view, html} =
    view
    |> form("#my-form")
    |> render_change(params)
    |> render_submit()
    |> follow_redirect(conn, ~p"/my_redirect_route")

My problem is that the return type of render_change is not what render submit is expecting and it errors out on the render_submit() line. This is the error I get:

** (FunctionClauseError) no function clause matching in Phoenix.LiveViewTest.render_event/4
     
The following arguments were given to Phoenix.LiveViewTest.render_event/4:

# 1
"<div>my html string</div>"

# 2
:submit

# 3
%{}
     
# 4 
%{}

I have tried using the element/3 function and splitting this out into 2 steps but that failed also. Is there a way I can render some changes and then submit the form? I am sure there is I am just missing something… Thanks!

LiveViews are GenServer’s under the hood

source

render_change is modifying the state of the live_view process and returns rendered result as a string to assert on if needed.

Once we got view via

{:ok, view, _html} = live(conn, ~p"/my_resource/#{id}/edit")

we should be able to

# modify the view (this will also return the resulting html so we can assert on its content if needed)
html = 
  view
  |> form("#my-form")
  |> render_change(%{some_key:  "some value"})

# now the state of the `view` is modified, so we can submit the form and try to follow redirect
view
|> form("#my-form")
|> render_submit()
|> follow_redirect(conn, ~p"/my_redirect_route")
1 Like

Makes total sense! That worked. Thanks!

1 Like