JQM Flickering in Safari in standalone mode - jquery-mobile

Am having the following issue:
Created an ASP.NET MVC 4 HTML5 web application for a mobile web app. When running on an iPhone 4 in standalone mode (ie. when the web app is launched from a home screen button instead of browsed to in Safari) I notice an unwanted and annoying flickering when transitioning to most of my pages. This does not happen at all if I launch Safari and browse to the web URL. It only happens when launching the web app from a button on the home screen. This is running iOS 6.1.3. I certainly don't want my users having to see this flicker when using my web application. What is causing this annoying behavior and how can I correct it?
I have found similar threads discussing this issue and tried all solutions offered and none of them worked.

Related

iOS/Safari: "Back" button on FileDownload screen sometimes missing

Currently I'm facing a weird problem where I don't have any clue (because of this sorry for the very vague question). I've developed an Angular Web Application, that offers a file download. Now the weird part:
When testing on iOS (13.3, iPad, iPhone), basically everything is working. Then I did some variation of my test: I used the "Add to home screen" feature, where the web-app basically pretends to be a PWA, and iOS/Safari is opened without any browser UI.
In this mode, Safari handles file downloads a bit differently: When downloading a file, it shows a full-screen Overlay with the file name and some options, and some "Back/Done" button in the top bar (see screenshot below, where I download a test file "image.jpg").
The problem is that on some iOS devices on some test servers, exactly this button is missing in Safari, everything else is working.
Any idea what could trigger this behavior in iOS/Safari?
iOS PWAs have been really buggy with small issues like this because of certain new iOS features such as the Safari Download Manager in browser so Apple either hasn't realized or decided how they want to handle these bugs in PWAs.
I'd suggest to try out some different options to download your test files: https://forums.developer.apple.com/thread/95911

ios - Web App lauched as Homescreen switches to browser mode after page change

The Web App works great on Android, stays in homescreen mode while browsing pages.
For some reason on iPhone and iPad it switches itself to a browser mode after changing page.
I have tested in chrome application tab, and all icons, manifest and service worker are loading fine on all pages.
What could cause the web app to change to browser mode on iOS?
You can try to disable it using Javascript as provided in this post:
var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++)
{
a[i].onclick=function()
{
window.location=this.getAttribute("href");
return false
}
}
There's also a github forum which discusses this predicament.
Service workers are not yet supported in iOS devices. Unless the web app is programmed as a single-page application, I believe that it will always open it up in browser mode.

Webpage crashing on any web browser for iOS device

I am trying to access webpage on various browser on iOS Device, but it seems that after loading some part of the webpage, it redirects automatically and then crash the page and shows the webpage was reloaded because a problem occurred for 2 seconds, and then show A problem repeatedly occurred on "URL for page as below"
I tried this URL on a desktop and it was not behaving well. I don't know if it is there rotating image code, or the JavaScript code they have running the "design your shoe" features. But this site had weird stops and starts and mouse jumps when I tried it.
I don't have an iOS device handy, but I'm thinking it is not you, it's the site.
Try it on another device.

HTML5 web app not caching when added to home screen on iOS

I have web application ASP/MVC which uses application cache and it has to work as standalone application when added to home screen. It works fine, but on iOS10 it doesn't cache and doesn't work on offline mode. I don't have exact steps but it seems like it stops workign when i add this application for second/third time:
1 I add application to home screen and it works properly
2 I add this application to home screen again - it doesn't work
And all next installed applications doesn't work.
Also i wasn't able to reproduce it on one of the test servers.
I would try to clen cache (maybe it would help) but because of atandalone applications are opened not in Safary on iPhone - i don't know how to do this.
Also i found script to debug application cache
https://jonathanstark.com/blog/debugging-html-5-offline-application-cache?filename=2009/09/27/debugging-html-5-offline-application-cache/
But when i run application which doesn't work in offline mode - it simply doesn't enter in any of events handlers.
Found out what the problem was. There was redirecting on another page on my site and you could redirect even if application cache is still loading content so the caching stops and after redirecting back we on purpose setted manifest to empty string (it turned out like a feature that after redirecting back caching doesn't start being loaded). But on another OS caching started loading according to previous manifest, and only for iOS 10 if manifest turns out to empty string - caching doesn't start.

IOS Web App open links within web app

I am in the mist of creating a mobile web app and have both meta tags
I have an iphone 5 on 7.0.4
When I click on a regular link like the one below it, opens up a mobile safari window and leaves the webapp. I also tried setting the target to _self and same behavior.
Sign in
I then used my ipad which was on 7.0.3 and it worked as should, not opening mobile safari on links. I think proceeded to update my ipad to 7.0.4 and the same issue as I had on my ipad.
Anyone ran into this issue and or knows a fix ?
Thanks
Since iOS 7.0.4 all links in WebApps open in Safari. As a workaround you can use Javascript:
window.location.href='text.html'
But remember that these steps will not be captured in history (so there is no ability to use Javascript like history.back() ..).
Alternatively, if you are using a menu in your web app, try to combine iframe and Javascript, you can change the content of your iframe with this Javascipt:
document.getElementById("frame").src = new_content.html
This will prevent your WebApp to open up links in Safari and stay in WebApp view.

Resources