Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
ryaa opened this issue Sep 11, 2024 · 1 comment
Open

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

ryaa opened this issue Sep 11, 2024 · 1 comment
Labels

Comments

@ryaa
Copy link

ryaa commented Sep 11, 2024

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

@ionitron-bot ionitron-bot bot added the triage label Sep 11, 2024
@singatias
Copy link

singatias commented Oct 3, 2024

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants