JS not working for Phoenix

Phoenix Forum Questions / Help
, ,
1

Any JS command, push_patch etc are not working and giving the following error:

live_socket.js:377 Uncaught TypeError: Cannot read properties of null (reading 'el')
    at LiveSocket.replaceMain (live_socket.js:377:60)
    at live_socket.js:748:12
    at LiveSocket.withPageLoading (live_socket.js:718:23)
    at LiveSocket.historyRedirect (live_socket.js:747:10)
    at Object.exec_navigate (js.js:58:21)
    at js.js:17:22
    at Array.forEach (<anonymous>)
    at js.js:16:40
    at Array.forEach (<anonymous>)
    at Object.exec (js.js:12:14)

I’m having the following error when I try to apply push_patch.

** (ArgumentError) cannot push_patch/2 to 
%URI{authority: nil, fragment: nil, host: "localhost", path: "/events/de98359c-9b32-4197-82f0-fa7b2e283646", port: 4000, query: nil, scheme: "http", userinfo: nil}
because the given path does not point to the current root view APIWeb.Ev.Index`

Relevant handle_event code:

 @impl true
  def handle_event("debug", %{"event" => event_guid} = _params, socket) do
    socket
    |> push_patch(to: "/events/#{event_guid}")
    |> noreply_socket()
  end

push_navigate works but it takes 10 seconds while normal anchor tag just works instantaneously.

What can I try here ?

LiveView Version: 0.18.16
Phoenix Version: 1.16

1 Like
2

Here are the rules around LiveView navigation:

  1. Patch is only for modifying the URL and staying on the current LiveView process. It only works for links to the current LiveView.

  2. Navigate is to move between routes in the same live_session block in your Router. It can also be used to tear down the current LiveView process and start a new one.

Note that if you do not have any explicit live_session blocks in your Router then all live routes are in the default live session.

  1. Href is for everything else.

The slowness you are experiencing with navigate is all of the extra round-trips the client must do because the server returns errors on the invalid navigate call.

Edit: early submit :slight_smile:

4 Likes
3

Hi @mcrumm
Thanks a lot for your reply :blush:

Yes, both the live_views are in same route in same block in same live_session.

Even with errors it works after 10 seconds. I don’t see any exception as well. I see logs on console after 5-6 seconds.

I’ve also added the browser console error to the original question.

4

Someone reported a similar issue recently and it was resolved by making sure all dependencies were up-to-date, including making sure to rebuild client assets:

Does any of that advice apply in your case?

5

I nuked all the deps and reinstalled them and it fixed it.
Thanks a lot for your help :blush:

1 Like