Environment
- Elixir version (elixir -v): 1.18.3
- Phoenix version (mix deps): 1.8.0
- Phoenix LiveView version (mix deps): 1.1.3
- Operating system: MacOS
- Browsers you attempted to reproduce this bug on (the more the merrier): Chrome/Safari
- Does the problem persist after removing "assets/node_modules" and trying again? Yes
Actual behavior
We've been having some issues with a complicated scenario in our main code base. I've managed to reproduce it in a simpler way in a smaller repo.
In summary...
we have a single live view with a multiselect (page.ex). We render a live_component for each item in the multiselect (item.ex). Each of these renders a live_component (item_header.ex) which async assigns a fixed value and has a loading state.
when we render the page, the loading state shows very briefly, followed by the loaded state... then shortly after (im using a process.sleep at the moment to make this more visible) it reverts to a loading state and remains stuck there
at the same time there are 2 other contributing factors, a JS hook that on mount just sends a message to the liveview, and another assign_async in item.ex that is never used
note that this is not reproducible in liveview 0.20!
Here's a video
and here's the minimal repro, just run mix phx.server
https://github.com/danturn/hook_bug_repro/tree/main
Expected behavior
Loading state should show before the assign async finishes, and once finished, the html should remain in the loaded state
Environment
Actual behavior
We've been having some issues with a complicated scenario in our main code base. I've managed to reproduce it in a simpler way in a smaller repo.
In summary...
we have a single live view with a multiselect (page.ex). We render a live_component for each item in the multiselect (item.ex). Each of these renders a live_component (item_header.ex) which async assigns a fixed value and has a loading state.
when we render the page, the loading state shows very briefly, followed by the loaded state... then shortly after (im using a process.sleep at the moment to make this more visible) it reverts to a loading state and remains stuck there
at the same time there are 2 other contributing factors, a JS hook that on mount just sends a message to the liveview, and another assign_async in item.ex that is never used
note that this is not reproducible in liveview 0.20!
Here's a video
and here's the minimal repro, just run
mix phx.serverhttps://github.com/danturn/hook_bug_repro/tree/main
Expected behavior
Loading state should show before the assign async finishes, and once finished, the html should remain in the loaded state