azazel75
Testing LiveView that uses `send_update`
Hello,
I’m developing an application using LiveView and as a way to update
the status of inner LiveComponents I started using send_update the
same way it was pioneered by surface here:
Surface but without the
“reactivesque” bits.
Now i want to test the components (together with one of the views that
uses them) but I’m facing some issues because of how the send_update
works. For example, when I delete an item from a list I want to show a
confirmation dialog to the user, which means really to switch the CSS
class of a “dialog” HTML fragment. Here is how the the Dialog
component is used in the parent LiveView:
<%= live_component @socket, Journey.Manage.Components.Dialog,
id: "delete-confirm" do %>
<%= gettext("Are you sure you want to delete this item?") %>
<% end %>
then, when the delete button is clicked, the event event handler on
parent view shows the dialog like this:
def handle_event("item-delete-pre", %{"id" => rec_id},
%{assigns: %{live_action: :index}} = socket) do
Dialog.show("delete-confirm",
actions: [yes: gettext("yes"), no: gettext("no")])
{:noreply, assign(socket, ask_confirm_id: rec_id)}
end
Then the execution of the Dialog.show() functions runs a send_update()
that internally uses a send() to do the perform the update
asynchronously.
And this asynchronicity is the source of the problem… i think. The
test creates the view and sends the event to the main LiveView:
{:ok, view, html} = live(conn, "/region")
assert html =~ ~r/<div class="modal.*hidden"/
assert render_click(view, "item-delete-pre",
%{"id" => "A"}) =~ ~r/<div class="modal.*shown"/
… but the check fails because the update is not there yet!
Any idea of something (a workaround) to make it testable? Or am I not
seeing a solution that is there already?
Marked As Solved
chrismccord
Calling render after your click should be all you need ![]()
{:ok, view, html} = live(conn, "/region")
assert html =~ ~r/<div class="modal.*hidden"/
render_click(view, "item-delete-pre", %{"id" => "A"})
assert render(view) =~ ~r/<div class="modal.*shown"/
Popular in Questions
Other popular topics
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #elixirconf-us
- #advent-of-code
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #hex









