Testing LiveView with JS Commands

I’m having trouble figuring out how to test LiveViews that contain JS commands. Is this even possible? My mental model is a bit lacking here in terms of how browserless LiveView tests work. There doesn’t seem to be any mention of testing JS commands in the docs though would be happy to add them if I can figure this out.

My scenario:

def some_button(assigns) do
  ~H"""
  <a href="#"
    data-test-id="button"
    phx-click={Phoenix.LiveView.JS.add_class("some-class", to: "body")}>click me</a>
  """
end

…the test:

test "click it", %{conn: conn} do
  {:ok, view, _html} = live(conn, "/")

assert view
       |> element("[data-test-id=button]")
       |> render_click() =~ "resulting html"  # Right side of the assertion isn't important since it never makes it here
end

I get the following error: (ArgumentError) no push command found within JS commands

Any insight would be much appreciated!

1 Like

I just want to give this a bump I still can’t figure it out and it’s driving me a little nuts. Can anyone at least answer if writing LiveViewTests for LiveViews with JS commands in them is even possible? I can always use Wallaby but I’m trying to hold off on that until I get into heavier system tests.

TIA!

1 Like

My understanding is that, using the functions in Phoenix.LiveViewTest, you can only test the server-side part of the LiveView, i.e. the LiveView process. As far as I know, no JS client is started during the test, and this precludes testing of JS commands.

Awesome, thanks for your response! It’s what I figured I just couldn’t find anywhere that explicitly stated they wouldn’t work. I’ll see if I can update the docs in some way that makes sense.

1 Like