Unauthorised live_redirect error with LiveView 0.16

I’m migrating an application with a mix of controllers and LiveViews to version 0.16.

I have a bunch of pages that keep reloading indefinitely with following error (from liveSocket.enabledDebug()):

[Log] global-search error: unauthorized live_redirect. Falling back to page request -  – {reason: "stale"} (index.js, line 43703)
[Log] phx-Fq4A3rWM0mU8b2OH destroyed: the child has been removed from the parent -  – undefined (index.js, line 43703)
[Log] phx-Fq4A3rWM0mU8b2OH join: encountered 8 consecutive reloads -  – undefined (index.js, line 43703)
[Log] phx-Fq4A3rWM0mU8b2OH error: view crashed -  – undefined (index.js, line 43703)

A big part of the app is using boring controllers for rendering stuff but still have to render LiveViews using live_render/4 for interactive and complex UX widgets.

For example, some controller will render the GlobalSearchLive LiveView from a template:

<div class="navbar-start">
  <div class="navbar-item">
    <%= live_render(@conn, GitGud.Web.GlobalSearchLive, container: {:div, id: "global-search", class: "search"}) %>

I’ve tried to wrap my routes (root LiveViews and controller actions) with live_session/4 without success (still getting this kind of errors).

Edit: The log error is hard to understand because I do not use live_redirect anywhere in GlobalSearchLive, the error happen before mount/3 so before any interaction with the LiveView which could possibly lead to a live_redirect.

Any help welcome :nerd_face:

Ok, after a bit of debugging, I think I found it :face_with_raised_eyebrow:. In my previous post, you can see that I pass an ID in the :container option. By removing the container ID, I get rid of the errors.

Now when reading from the docs, this should be an acceptable behaviour:

When a LiveView is rendered, its contents are wrapped in a container. By default, said container is a div tag with a handful of LiveView specific attributes.

The container can be customized in different ways:

  • You can change the default container on use Phoenix.LiveView:
use Phoenix.LiveView, container: {:tr, id: "foo-bar"}
  • You can override the container tag and pass extra attributes when calling live_render (as well as > on your live call in your router):
live_render socket, MyLiveView, container: {:tr, class: "highlight"}

Phoenix.LiveView.Helpers — Phoenix LiveView v0.16.3

But settings an ID for the container (I’d like to give the DOM container an id) seems to break things we verifying static parts in the LiveView Session:

This seems like a bug to me :face_with_monocle:. Or at least docs should be clear about this.

Please open up a bug report. It may be that setting the ID is not really allowed.

1 Like

I’ve opened issue #1673.