How can i test live view form with external input?

I had to separate an input from the form for some reasons.
something like this.

<form id="foo" phx-change="validate">
   <input hidden name="idx" value="0"/>
</form>
<input type="text" form="foo" id="foo_val" name="data[val]" />
<input type="text" form="foo" id="foo_val2" name="data[val2]" />

with handle_event("validate", params, socket) it works as i intended.

but while testing the live_view using Phoenix.LiveViewTest.form(view, selector, form_data \\ %{}) doesn’t work well with this kind of approach

how should i test such cases?

How are you writing the test using the form function and what is the error?

The function form/3 may fail because it validates the params you’re trying to send:

view
|> form(“#foo”, %{“foo” => %{“field1” => “val1”, “field2” => “val2”}})
|> render_submit()

If you write it this way and it fails you could send the values using the render_submit/2 instead:

view
|> form(“#foo”)
|> render_submit(%{“foo” => %{“field1” => “val1”, “field2” => “val2”}})

This way you can send any attribute and value you want.

Wrote it on the phone so code might not be exact, please check the linked docs that have more details!

2 Likes

my bad. I forgot to post the full test code and error message.

as you suspected, i used the former

view 
|> form(“#foo”, %{“foo” => %{“field1” => “val1”, “field2” => “val2”}}) 
|> render_change()

and got error saying

** (ArgumentError) could not find non-disabled input, select or textarea with name "foo[field1]" within:

With your suggestion. I could solve the issue.
Thanks for answering this poor question