Fixing iOS web app bug

[JiiHu]

When tabby was used in iPhone fullscreen web app, clicking the tab would open the new tab in Safari as a web page instead of keeping it in the web app itself. This is fixed now: tabs work as they used to, but they also work in web app.

Tested on iPhone7, running iOS 10.3.1. Web app was created with Rails 5.0.1.

[cferdinandi]

This behavior has always struck me as a bug in Apple's design model. I don't think it's realistic or scalable to patch-fix every JavaScript plugin that's affected by it.

A better solution, in my opinion, is to bolt-in the desired behavior at the app level, via something like this:

var eventHandler = function (event) {
    // Only run for iOS full screen apps
    if (('standalone' in window.navigator) && window.navigator.standalone) {
        // Only run if link is an anchor and points to the current page
        if ( event.target.tagName.toLowerCase() !== 'a' || event.target.hostname !== window.location.hostname || event.target.pathname !== window.location.pathname || !/#/.test(event.target.href) ) return;

        // Open link in same tab
        event.preventDefault();
        window.location = event.target.href;
    }
}
window.addEventListener('click', eventHandler, false);

This code above should get you same effect (and also fix any other similarly structured plugins with the same issue) without modifying the core code. And if Apple ever fixes this absurd behavior, you can just rip it out.

[JiiHu]

Sounds better than my patch. Thanks :)

[cferdinandi]

You're welcome! By the way, if you use this in your app and find it doesn't work, please let me know and I'll revisit.

Cheers!