Skip to content

render_async issues with container_id and turbolinks : not reloading or JS not firing on new visit depending on configuration #136

@dbs-ced

Description

@dbs-ced

Hi !

I'm trying to handle more than one render_async in a single page and my site works with Turbolinks.
My render_async renderer have a container_id set as "render_async_{id}" to refresh them using javascript.

Extract from my html file :
<%= render_async my_path(id), container_id: "render_async_#{id}", replace_container: false %>

In Javascript I do the following to refresh one given render_async :

let container = document.getElementById("render_async_<%= @id %>");
let asyncEvent = new Event('refresh');
container.dispatchEvent(asyncEvent);

When the page loads for the first time, everythings works fine, all my lists are loaded asynchronously and when I make an action changing one of the items of those lists, it is correctly refreshed.

But when I load the same page a second time without refreshing the page, just with navigation through turbolinks visits, all my lists are blank, no asynchronous action is launched.

I tried to remove the container_id from my render_async and the lists are correctly refreshed on turbolinks navigation, so I think the issue is related to container_id - not being properly used to refresh render_async blocks ?

Here is my config file :

RenderAsync.configure do |config|
config.jquery = true
config.turbolinks = true
end

I'm using turbolinks 5.2 and render_async 2.1.8.
Did you already encoutered this issue, and/or did I miss something ?
Thanks in advance !

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions