Question/Bug: iOS link clicks in full screen web app trigger new webview

[erikbelusic]

Not sure if this is a bug or works as intended

When using the meta tag for fullscreen/pwa web app <meta name="apple-mobile-web-app-capable" content="yes"> clicking turbo drive enabled links opens a nested webview (like opening external links inside native apps)

Landing page

After clicking turbo enabled link

[estebanutz]

@erikbelusic Did you ever find a solution, that's definitely not the expected behavior. I've been troubleshooting the same issue on a rails app running turbo-rails and I can't figure out what's causing that. At this point, I'm not sure if it's something I need to fix on the swift side or rails side.

I know the behavior is supposed to be like that when linking to an external site. I checked the generated URLs on those internal links and they are all relative. Hopefully, you found a solution for it :). Thanks!

[erikbelusic]

@estebanutz No, I did not. This was for a side project that fell to the wayside, so I haven't touched it in a while. - I opened a thread on the dicourse also, but got no traction - https://discuss.hotwired.dev/t/ios-full-screen-app-opening-new-windows/3591

For me, it couldn't have been on the Swift side, as I was using the website/webapp along with the "full screen app" meta tags and saving it to the home screen - it was not a packaged app via the app store.

I had some thoughts that I never got to dig into fully:

• ios safari issue (if its this - it may never get resolved)
• however the ajax request is made via turbo is triggering this behavior - possibly missing a prevent default on some bubbling up event - I started digging through the turbo code - and it didn't seem like this though.

It could be a combination of the two - as if you use pre-jquery style ajax code to fetch and insert the content - it works as expected. i think turbo is using fetch or some newer api? i cant remember as its been a while since i read the source

[estebanutz]

@erikbelusic Thanks for responding. I posted my issue on the turbo-ios repo to see if somebody else could help. To me, the strange thing is that it was working as expected, but while trying to incorporate omniauth to work on both my rails app and ios, somehow I discovered the new behavior, I reverted back to previous versions of my app and my swift project without any luck. It is very strange. I'm not sure if some other library is conflicting with turbo but it is very strange indeed.

Interestingly enough the demo for turbo-ios works fine, it only opens links in Safari when you set target="_blank". I'll keep digging. Thanks again!

[erikbelusic]

I think we may be experiencing similar things but possibly for a different reason. I know there was at some point some differences on how forms were handled via turbo vs regular links - so it could be the form postings in your scenario are not utilizing turbo? My issue was even normal get requests were opening like normal link clicks and not behaving like the SPA like behavior when trying to run a turbo enabled website in a "full screen app" like way

[estebanutz]

@erikbelusic The forms are working as expected. The problem I have is with regular links, get requests.

[givemetraffic]

@erikbelusic @estebanutz have you ever found the way to solve this issue guys?

The only way I see is to wrap entire layout in <%= turbo_frame_tag 'content' %> and navigate within it, but that requires everything to be wrapped with this frame. So looking for better solution

[estebanutz]

@givemetraffic my issue was related to google analytics GA4 and its "Enhanced Measurement"

My app does not need "Enhanced Measurement" so I disabled it and fixed the issue temporarily. See the link below:
hotwired/turbo-ios#77 (comment)

[erikbelusic]

I never ended up resolving this. The project was sadly abandoned and it was still an issue when that decision was made.

[noliv]

Hi! I may give false hope but… isn't that solved by providing a "PWA" manifest.json that declares the scope of the web app? I'm not very experienced in this specific and am looking for something similar in the context of using a friend's web app on the home screen. I don't have access to the code I need to fix right now for testing that solution… but I think it's what we are all looking for… just sharing this potential solution before closing this window ;)

Edit: https://web.dev/add-manifest/

[wrydere]

For anyone finding this thread, one thing to check for is redirects, especially in minor cases like capitalization or trailing slashes. I noticed that if a URL was formatted like /ACME123/ but the server resolved to /acme123/, it would trigger a safari webview, whereas using the correct capitalization in the original link kept the navigation "inside" the PWA, even when doing a full page refresh.