How to fill in datetime-local inputs

[nTraum]

Just in case someone else is stumbling upon this and biting their nails:

When attempting to fill in a datetime into a datetime-local input field the expected string format is not obvious.

<form>
  <input
    type="datetime-local"
    id="meeting-time"
    name="meeting-time"
   />
</form>

At least with Chrome/Chromedriver, the datetime must not be formatted in ISO8601 or alike, but instead as if one would fill the input manually by keyboard, so:

So ~N[2023-01-01T12:00:00] becomes:

0 1 0 1 2 0 2 3 TAB 1 2 0 0 P M

Notice the TAB to switch from the date part to the time part in the input.

With a small helper function this can become a bit more elegant:

@doc """
Returns the datetime as a formatted string suitable to fill into a
datetime-local form input.

## Examples
    iex> chrome_datetime_local(~N[2023-01-01T12:00:00])
    "01012023\t1200PM"
"""
@spec chrome_datetime_local(NaiveDateTime.t()) :: String.t()
def chrome_datetime_local(%NaiveDateTime{} = dt) do
  Calendar.strftime(dt, "%m%d%Y\t%I%M%p")
end

And then use it in the test:

session
|> visit("/")
|> click(@add_batch_button)
|> find(@batch_form, fn form ->
  form
  |> fill_in(@batch_name_field, with: "My batch")
  |> fill_in(@batch_start_date_field,
    with: ~N[2023-01-01T12:00:00] |> chrome_datetime_local()
  )
  |> click(@save_button)
end)
|> assert_text(gettext("Added a new batch"))