0

I've nested turbo frames as follows:

<%= turbo_frame_tag("main_container") do %>
  ...
  <%= turbo_frame_tag("nested_container", src: "/path/to/articles", loading: "lazy") do %>

    <% 
      # Here is the turbo-rendered content that will be eventually loaded
      # including links like this:
      # 
      # link_to(
      #   "Article title",
      #   "/path/to/article/1",
      #   :'data-turbo-frame' => "_top"
      # )
    %>

  <% end %>
<% end %>

Turbo frame rendering works as expected.

However, when I click a link_to then it loads/visits the linked page but doesn't position the view at the beginning/top of that loaded/visited page i.e. the loaded/visited page results scrolled almost to the bottom or, maybe (I cannot verify this), at the same vertical height of the link that triggered the page loading/visit. Even if I set the data-turbo-frame="_top" on the main_container and nested_container too, link_to loads/visits the linked page but the rendered page results scrolled.

Note: This strange behaviour seems to happen only in the Firefox browser. Tested in Firefox, Chrome, Safari, and Edge.

Am I missing something? How to make the clicked links in the nested turbo frame to load/visit the linked page without having that page scrolled?

Backo
  • 18,291
  • 27
  • 103
  • 170

0 Answers0