Menkir
Strange behaviour of Live-View rendering
Hello guys. I’ve experienced a strange behaviour of Live-View:
I have a table like this (leex):
<table>
<thead>
<%= live_render(:Toolbar, container: {:tr, []}) %> # render <th> entries inside <tr> container
</thead>
<tbody>
<%= live_render(:Data) %>
</tbody>
</table>
As soon as i render the table the tag inside getting rendered within the first second and then disappear immediately.
To be clear:
The html output is first:
<table>
<thead>
<tr class=phoenix-connected etc...>
<th>
entry1
</th>
<th>
entry2
</th>
</tr>
</thead>
<tbody>
...
</tbody>
</table>
And then it transforms like this:
<table>
<thead>
<tr class=phoenix-connected etc...>
"entry1"
"entry2"
</tr>
</thead>
<tbody>
...
</tbody>
</table>
Off course the view get’s messed up and nothing works properly. The thing is, that it works weeks before. Looks like an Update messes everything up. But i don’t know which module.
Did some experienced something similar and have a workaround or solution?
edit: Could it be that the render engine detects the tags as useless because it make no sense in a separate context (outside of <tr> because the engine does not know if it is part of it)?
Most Liked
Menkir
I checked in Wireshark the http response and the html contains the <th> tag. By excluding step-by-step the javascript libraries which could be responsible for this bug it seems like live_view itself is causing this issue. I downgraded lv from 3730628ec1404d8a6fa61ed6b10fc52554bf067e to 09b792ad9f85331968cfbc43f8564d6c97495832 and the issue was gone. But it’s only a workaround ![]()
Menkir
I’ve created a Bug Report on Github. For those of you who want to be up to date: Live View Javascript Bug: Forget tags in rendering · Issue #282 · phoenixframework/phoenix_live_view · GitHub
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
- #advent-of-code
- #elixirconf-us
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #performance









