search

hotwired / turbo

The speed of a single-page web application without having to write any JavaScript
https://turbo.hotwired.dev
MIT License
6.69k stars 423 forks source link

Turbo Frame reload - no morphing possible? #1127

Open coorasse opened 8 months ago

coorasse commented 8 months ago

I have some turbo frames that are eager/lazy loaded (i.e. they have a src attribute). These frames can be reloaded. The "problem" is that I cannot replace the content using idiomorph, but the frame content is always swapped with a new one. I believe this is intentional or not planned at the moment, but I'd like to know if this is something that can/should be achieved differently. Our need is basically to keep the "reloading" mechanism, but be able to swap the content using idiomorph.

coorasse commented 8 months ago

I think what would be interesting would be also to have a "frame_refreshes" kind of feature. Likewise the page_refreshes, but to signal clients that they should reload the frames.

willcosgrove commented 8 months ago

@coorasse have you tried adding the refresh="morph" attribute on to your Turbo Frame? It looks like it is reloaded with a morph if it has that attribute:

https://github.com/hotwired/turbo/blob/5902f3bfd684686713a93b4d1653a724ba967c55/src/core/drive/morph_renderer.js#L80-L82

Here's the relevant commit with a message describing the feature: https://github.com/hotwired/turbo/commit/9ff6e16da631f5d58d467bceea7e42e40df02a3a

krschacht commented 8 months ago

@coorasse and @willcosgrove I have this same issue, and I tried the solution that you proposed, Will. Unfortunately, it doesn't work. Specifically, I put refresh="morph" on my frame and then use a link to trigger: <a onclick="document.getElementById('frame').reload(); return false;" href="#">reload frame</a> and the frame reloads but it still re-writes the whole thing.

Based on reading the PR and testing it, it only does a morph of the frame when the full page is doing a morphing refresh. I just asked a clarifying question on the PR to see if this was an oversight: https://github.com/hotwired/turbo/pull/1068

In the meantime, I'm hunting for a workaround...

seanpdoyle commented 1 week ago

Now that #1192 has been merged and FrameElement.reload() will utilize morphing when the [refresh="morph"] attribute is set, can this issue be resolved?