ionic-team/starters

Fix obsolete meta-tag "apple-mobile-web-app-capable"

Opened this issue · 1 comments

ryaa commented

Starter Type: ionic-angular
Starter Template: blank, tabs, etc.

Description:
The default project template has the following meta-tag in index.html:
<meta name="apple-mobile-web-app-capable" content="yes">

But that seems to have been deprecated since iOS 8 days (maybe earlier?)

Chrome is now nagging about this with the following warning:
<meta name="apple-mobile-web-app-capable" content="yes"> is deprecated. Please include <meta name="mobile-web-app-capable" content="yes">

We should do as Chrome says!

Some comments about apple-mobile-web-app-capable:

Caution

Warning: Before the web app manifest spec was defined, several browsers, including Safari on iOS/iPadOS and Chrome on Android, supported custom elements to describe the application experience, such as apple-mobile-web-app-capable. Do not use these elements today; it's no longer recommended, and may harm the installation experience when the browser can't load the manifest properly; the experience you get as a fallback may be different and unexpected. Source.

Caution

Warning: If Safari can't load the manifest, it will fall back to check if your PWA has some deprecated meta tags, such as apple-mobile-web-app-capable. You should not use these metatags. They provide a home screen app experience without essential attributes for your PWA, such as honoring the start_url or the scope attributes, making a terrible app experience. Source.

My ionic info:

Ionic:

   Ionic CLI                     : 7.2.0 (/Users/alexryltsov/.nvm/versions/node/v20.11.1/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 8.1.0
   @angular-devkit/build-angular : 17.3.6
   @angular-devkit/schematics    : 17.3.6
   @angular/cli                  : 17.3.6
   @ionic/angular-toolkit        : 11.0.1

Capacitor:

   Capacitor CLI      : 6.0.0
   @capacitor/android : 6.0.0
   @capacitor/core    : 6.0.0
   @capacitor/ios     : 6.0.0

Utility:

   cordova-res : not installed globally
   native-run  : 2.0.1

System:

   NodeJS : v20.11.1 (/Users/alexryltsov/.nvm/versions/node/v20.11.1/bin/node)
   npm    : 10.5.0
   OS     : macOS Unknown

Other Information:
https://web.dev/learn/html/metadata
https://stackoverflow.com/questions/24889100/ios-8-removed-minimal-ui-viewport-property-are-there-other-soft-fullscreen

singatias commented

This was starting to get annoying so I did a PR to address this. PR #1857.

  • 👍1