browser javascript traceback, theory: large live_component & additional event

[ltd]

live_view 0.10.0

I'm getting this traceback in chrome, I believe it's when a "heavy" live_component is being rendered and an event comes in midstream. "heavy" means a trip to the database and a couple 100k of html generated.

phoenix_live_view.js:445 Uncaught TypeError: Cannot read property '0' of undefined at Object.toOutputBuffer (phoenix_live_view.js:445) at Object.dynamicToBuffer (phoenix_live_view.js:458) at Object.toOutputBuffer (phoenix_live_view.js:447) at Object.toString (phoenix_live_view.js:420) at e.value (phoenix_live_view.js:1671) at eval (phoenix_live_view.js:1712) at Array.forEach () at e.value (phoenix_live_view.js:1708) at eval (phoenix_live_view.js:2008) at Object.eval [as callback] (phoenix_live_view.js:1865)

[chrismccord]

Did you ensure that you are really on the 0.10 js client (ie you ran rm -rf assets/node_modules/phoenix_live_view and `npm install --prefix assets) ? If you can provide a minimal example that reproduces this, that would be extremely helpful. Without it, it is unlikely we will be able to track this down. Thanks!

[ltd]

yes, on 0.10.0 , let me see if I can whitte down to a short example.

certifi 2.5.1 cowboy 2.7.0 cowlib 2.8.0 datex 1.0.0 email_checker 0.1.3 file_system 0.2.8 floki 0.26.0 gettext 0.17.4 hackney 1.15.2 html_entities 0.5.1 httpoison 1.6.2 idna 6.0.0 jason 1.2.0 metrics 1.0.1 mime 1.3.1 mimerl 1.2.0 parse_trans 3.3.0 phoenix 1.4.16 phoenix_html 2.14.0 phoenix_live_reload 1.2.1 phoenix_live_view 0.10.0 phoenix_pubsub 1.1.2 plug 1.9.0 plug_cowboy 2.1.2 plug_crypto 1.1.2 ranch 1.7.1 socket 0.3.13 ssl_verify_fun 1.1.5 telemetry 0.4.1 tzdata 1.0.3 unicode_util_compat 0.4.1

[ltd]

Just a note, that it's always being triggered by a live_patch inside a live_component in my app. I'm not see it happen in my small example as of yet.

[josevalim]

Ping. Any news on a way to reproduce this? :)

[ltd]

yes, by making all my live_components stateful the error disappeared. Here's a quick test that will reproduce it. clicking testa, then testb, then testa will produce the javascript error. Adding an id: to testa fixes.

defmodule DsfeWeb.TestLive do use Phoenix.LiveView

def render(assigns) do ~L"""

<%= live_patch "testa", to: "/testa" %> <%= live_patch "testb", to: "/testb" %> <%= live_patch "testc", to: "/testc" %> <%= case @live_action do :la_a -> live_component @socket, DsfeWeb.TestComponent , content: "A" :la_b -> live_component @socket, DsfeWeb.TestComponent , id: :b, content: "B" :la_c -> live_component @socket, DsfeWeb.TestComponent , id: :c, content: "C" _ -> nil end %>

"""

end def handle_params(_params, _uri, socket) do {:noreply, socket} end

def mount(_params, _session, socket) do {:ok, socket} end end

defmodule DsfeWeb.TestComponent do use Phoenix.LiveComponent

def render(assigns) do ~L"""

<%= @content %>

"""

end

def update(assigns, socket) do {:ok, assign(socket, content: assigns.content) } end

def mount(socket) do {:ok, socket} end end

routes

live "/testa", TestLive, :la_a live "/testb", TestLive, :la_b live "/testc", TestLive, :la_c

[josevalim]

Fixed on master! It was the same as #976 and it was fixed by #950.