Does iOS 16 break SVG icons in Ionic/Cordova mobile apps?

Ionic Framework ionic-v3
1

Sorry for the partial repost but I’m going crazy on this bug.

https://stackoverflow.com/questions/73923428/does-ios-16-break-svg-icons-in-ionic-cordova-mobile-apps

We have a very old mobile app for iOS made in Ionic 3 with Cordova 5.

Before iOS 16 everything works well, but now I have a very strange behaviour for SVG icons.

Browsing the app’s pages, the SVG icons sometimes are not completely rendered.

  1. When executed as web application or runned in the XCode simulator the problem does not appear. It is only shown in the iOS device.
  2. Same web app executed inside Safari in iOS 16 device shows well the SVG images. So I think the problem is related to the particular format of SVG inside Ionic/Cordova app.
  3. I’ve used a very simple SVG image that didn’t have problem in iOS 16 native app. So something in the SVG format breaks Ionic/Cordova view.
  4. when executed in XCode (on the device) I see this error (but I think isn’t related): BUG IN CLIENT OF UIKIT: Setting UIDevice.orientation is not supported. Please use UIWindowScene.requestGeometryUpdate

I think it’s a problem of the <ion-card> or <ion-grid> refresh. I tried to change some background to understand better and sometime the refresh problem is evident.

Please look at the post on Stackoverflow for the code and images that show better the behaviour.

thx

3

Any idea? Someone had same problem on new iOS 16?

4

you are several versions behind on ionic, angular and cordova, you are going to have all types of problems. Thus it will be to time consuming trying to debug your code.

Your best bet is to update your project to the latest versions.

5

Yep, you are right but I cannot upgrade to latest version. This will be a huge work to solve a bug.

thx

1 Like
6

1 suggestion is to use font awesome icons and import them to your project. Maybe this is the quickest way?

7

This could be an interesting extrema ratio!

Do you think is only needed to use ion-icon tag with the reference to this page?

thx a lot

8

Nope, I tried with predefined Icon and sometimes the bug is there again. I finally converted all the SVGs in PNG and solved for now the problem. But sure I have to upgrade or change platform

thx

9

Here another link where they talk about the problem

I have noticed after add the link. Author of problem is the same. But in Stackoverflow there are more information