1 year ago
#367134
sandre89
Links inside a turbo frame with data-turbo-action="replace" (for instance: pagination links) are triggering 'turbo:load' on the page
Picture a very common use-case described in the official Handbook: a <turbo-frame>
that contains pagination links.
So, turbo supports (encourages?) annotating these pagination links with data-turbo-action="replace"
, and the resulting experience is very nice: browser URL gets updated, a page reload will load the correct pagination and the browser back button will show the last page loaded correcly. 🎉
However, as soon as you add data-turbo-action="replace"
on any link, they start firing a turbo:load
event on the page when clicked, even tough they are inside a <turbo-frame>
; in my mind, turbo:load
should be analogous to a DOMContentLoaded
event, and it should fire only ONCE per page loaded; if a turbo frame is being navigated by pagination, I don't want my event handlers designed for the page that contains the turbo-frame
to be fired again and again each time a frame within the page paginates.
Note that this ONLY happens if data-turbo-action
is present; otherwise, the links inside the turbo-frame will not trigger a turbo:load
on the page.
Lastly, the turbo:load
event being fired is indistinguishable from the one on the first page load or from a full turbo visit outside the turbo-frame; it's target
is the page's root html
element, so I can't even detect it was a turbo:load
coming from a turbo-frame.
So, how to avoid links clicked inside a <turbo-frame>
that were marked with data-turbo-action="replace"
to trigger turbo:load
on the page, or at least distinguish these events from the sole turbo:load
fired as soon as the page loads for the first time?
ruby-on-rails
turbo
turbo-rails
0 Answers
Your Answer