Testing forms with inputs outside the form element

[Munksgaard]

Environment

• Elixir version (elixir -v): Elixir 1.16.1 (compiled with Erlang/OTP 25)
• Phoenix version (mix deps): 1.7.11
• Phoenix LiveView version (mix deps): 0.20.9
• Operating system: NixOS

Actual behavior

I have a form with an input outside, looking something like this:

      <.form
        phx-target={@myself}
        for={@form}
        id="my-form"
        phx-change="validate"
        phx-submit="save"
      >
      </.form>
      ...
      <.input
        field={@form[:name]}
        form="my-form"
        phx-target={@myself}
      />

I want to test the behavior of this form, so I wrote up the following using form/3 in a test:

      assert lv
             |> form("#my-form", %{"form" => %{"name" => "asdf"}})
             |> render_change() =~ "can't be blank"

Unfortunately, running this test gives me the following error:

1) test my test (MyAppWeb.FooTest)
     test/my_app_web/live/foo_live_test.exs:148
     ** (ArgumentError) could not find non-disabled input, select or textarea with name "form[name]" within:


     code: |> render_change() =~ "can't be blank"
     stacktrace:
       (phoenix_live_view 0.20.9) lib/phoenix_live_view/test/live_view_test.ex:1102: Phoenix.LiveViewTest.call/2
       test/my_app_web/live/foo_live_test.exs:184: (test)

Expected behavior

form/3 let's me set values on inputs not directly nested within the form element.

[josevalim]

A pull request is welcome. If we can't find a name under the form, perhaps we should fallback to checking if the form has an ID and, if so, lookup for an element with matching name (and ID).