Ensure fullpage_redirect_to works with Turbo

[yourivdlans]

Hi!

After upgrading my app to use Turbo instead of Turbolinks the redirect to a charge (in case a user wants to upgrade their subscription / plan) stopped working.

I was doing this using some inline JS which would be rendered instead of an actual redirect which would call some AppBridge code to perform the redirect. See: Shopify/shopify_app#1287

Because the method fullpage_redirect_to relies on Turbolinks I was also not able to use this.

Therefore I came up with the following solution: Render a div which initialises a stimulus redirect controller which then uses the window.app (that also contains the host param) to dispatch a redirect request.

The code is based on:

• https://shopify.dev/apps/tools/app-bridge/actions#simple-actions
• https://github.com/Shopify/shopify_app/blob/master/app/assets/javascripts/shopify_app/app_bridge_redirect.js

[kirillplatonov]

Hey.

I've been trying to reproduce the issue but fullpage_redirect_to seems to work fine with Turbo. I tested the regular link, frame, and form submission. These are examples that I used: 9c4e7b0

Which use case do you have?

[yourivdlans]

Thanks for trying to reproduce the problem! This led me to find the actual problem. The partial shopify_app/shared/redirect.html.erb was rendered by fullpage_redirect_to but the JS included in that view was never executed.

Aparently this was caused due to data-turbo-track being set to reload, after removing this attribute everything started working.

- <%= javascript_include_tag "application", "data-turbo-track": "reload", defer: true %>
+ <%= javascript_include_tag "application" %>

One thing I did notice is that fullpage_redirect_to seems to still be using Shopify AppBridge 1.x.

See: https://github.com/Shopify/shopify_app/blob/3a75d14cfa2cc2e2cdb37e6479b61d9cc7145206/app/assets/javascripts/shopify_app/app_bridge_redirect.js#L1

[yourivdlans]

Oh one other thing that I found, if you would try to use fullpage_redirect_to from a method that was called using POST Turbo returns the following error: Error: Form responses must redirect to another location.

This can be fixed by manually setting response.status = :see_other right before calling fullpage_redirect_to.

[kirillplatonov]

Yeah, data-turbo-track is actually breaking a lot of things in embedded apps.

As for fullpage_redirect_to I suppose it makes sense to open a PR in shopify_app with an upgrade to AppBridge 2.0 and maybe set :see_other status for turbo frame POST responses automatically.

[yourivdlans]

As for fullpage_redirect_to I suppose it makes sense to open a PR in shopify_app with an upgrade to AppBridge 2.0 and maybe set :see_other status for turbo frame POST responses automatically.

Yeah good idea, I'll try and see if I can open a PR in shopify_app.