Turbo 8 Morph interfering with Turbo Frame

Hi,

In Turbo 8, I have a turbo-frame that gets updated when a form is submitted. That form updates the frame using data: { turbo_frame: :object_grid }`.

I’ve added <% turbo_refreshes_with method: :morph %> to my application.html.erb.

Now, the frame gets updated but then i get a full page refresh and the scroll reverts to the top.

I COULD preserve the scroll in the turbo_refreshes_with option above, but I don’t want that apart from when the action comes from the form submssion. In any case, the page refreshes and i don’t want that either.

I did try removing the turbo-frame and just letting morph deal with updating the grid of items below my filter form, but i can’t figure out how to allow the scroll position to be preserved BUT ONLY when a page refresh stems from the submission of my filter form and nowhere else.

Can anyone help me out here?

Thanks

2 Likes

I am running into the same issue. I was using turbo stream action and turbo frame before and now with turbo_refreshes_with morph, I expect it to not refresh and do partial page update, but it refreshes the whole page.

Did you find a solution? Is anyone able to help?

I could not. I did go back to Turbo 7 in the meantime.

Anyone have a solution here.

Let me try to explain the issue fresh:

I wish to morph changes. This works fine on normal page refreshes. On one page I have a set of filters. When a filter is set, the list of items in the grid below gets updated to reflect the filter selected.

Obviously turbo is seeing this as a page refresh. In this case I want to preserve the scroll. I can’t add preserve scroll to the application layout because that’s not the experience I want. I can’t add it solyely to that one page as I ONLY want the scroll to be preserved if the user sets a filter. Just that.

Does anyone have any fixes to this? Surely there’s a way?

I’ve also just noticed that Turbo 8 is breaking my existing turbo frame. The form has a data-turbo_frame attribute with the id of a frame that wrap my object grid below. When a filter in the form was set, it used to just update the contents of the frame, but now the contents update but I also get moved back to the top of the page.

I’m running into the same issue. Think of the app slack. I have a very similar chat app. On the left side I have a list of conversations. Then when you click the conversation it loads on the right. Right now I’m using a turbo frame for the conversation. When you click a conversation on the left it triggers the conversation turbo frame. Since upgrading to Turbo 8 with morph. Whenever I click into a conversation it causes full reload and the conversation list loses scroll position.