Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

iOS network activity indicator keeps spinning in web app added to home screen


2nd update, March 2014: Apple closed the bug saying they don't have enough information, but my project is a big PHP application that I can't (and won't) fully send to Apple for them to reproduce this problem. If anyone has a shareable, simple, pure HTML app that exhibits this problem as well, please let me know and I'll submit it to re-open the bug hoping they'll look into it.


1st update: as more users are reporting this issue and nobody has a clue, I have filed a bug report at Apple. If anything useful comes out of that which is not under NDA, I will post it here.


After installing a (jQuery Mobile) web app I am developing to the home screen of my iOS 6 device (iPhone 5), the network activity indicator in the status bar at the top of the screen keeps spinning even after the page is loaded completely. The behavior shows only when the page is opened through the web app; surfing to the same page in Safari on the same device doesn't show the infinitely spinning activity indicator.

Removing all AJAX calls and page content doesn't make a difference; the problem persists even when the web app consists only of an empty page like this:

<html>
    <head></head>
    <body><br/></body>
</html>
like image 225
Wilbo Baggins Avatar asked Jan 28 '13 22:01

Wilbo Baggins


1 Answers

The issue was solved by deleting the web app from the home screen, surfing to the page in Safari and re-adding it to the home screen as a new web app.

My guess is that the problem lies in the meta data that iOS stores at the moment a web app is added to the home screen (such as the values in the apple-mobile-web-app-capable and apple-touch-startup-image meta tags).

At least some of that information does not seem to get refreshed when accessing the page as a web app, even when it starts serving completely different content (such as the empty page shown in the question). I know this is true for the apple-mobile-web-app-capable meta tag; adding that tag to a site that has already been installed to the home screen does not suddenly make it a native-looking web app; the tag has to be present at the moment of adding the web app to the home screen.

I think I must have installed the initial web app at a stage of development where the page referred to a non-existent resource (such as an image, CSS or JS file), resulting in a web app that keeps looking for non-existent content even though the current web page is no longer referring to it, possibly explaining the infinite activity indicator behavior.

I am not certain that that is the cause, but it does seem the most likely explanation for this issue.

If you encounter this; check that all resources your page refers to exist, then delete and re-add the web app to the screen to see if it fixes the issue.

like image 166
Wilbo Baggins Avatar answered Sep 29 '22 15:09

Wilbo Baggins