Cordova IOS app shows white screen in IOS 14

Question

Cordova IOS app shows white screen in IOS 14. But app is working below IOS 14 version. I updated my Xcode to Version 12.0. Cordova IOS platform version is 6.1.0. Cordova version is 10.0.0. Below are the plugin details and preferences in config.xml file.

<plugin name="cordova-plugin-whitelist" spec="1" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />

<platform name="ios">
    <allow-intent href="itms:*" />
    <allow-intent href="itms-apps:*" />
</platform>

<preference name="scheme" value="app" />
<preference name="hostname" value="localhost" />

<plugin name="cordova-plugin-network-information" spec="^2.0.2" />
<plugin name="cordova-plugin-statusbar" spec="^2.4.3" />
<plugin name="cordova-plugin-splashscreen" spec="^6.0.0" />
<plugin name="cordova-plugin-inappbrowser" spec="^4.0.0" />

<preference name="auto-hide-splash-screen" value="false" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="FadeSplashScreenDuration" value="0" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="2000" />
<preference name="FadeSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="AllowInlineMediaPlayback" value="true" />
<preference name="orientation" value="portrait" />
<preference name="DisallowOverscroll" value="true" />

I tried removing all plugins except whitelist. I removed preferences related to splashscreen and tried it. Still app shows white screen.

Please help me. Any help should be appreciated. Thanks in advance.

Answer 1

I found the answer.

I uninstalled splashscreen plugin. By default splashscreen available in Cordova IOS platform 6.1.0.

In project root folder, check for res folder. If res folder is not available we have to create a res folder path like this "res/screen/ios/" and upload the splash screen images in ios folder.

Then add this in your config.xml

<splash src="res/screen/ios/screen-ipad-landscape-2x.png" />
<splash src="res/screen/ios/screen-ipad-landscape.png" />
<splash src="res/screen/ios/screen-ipad-portrait-2x.png" />
<splash src="res/screen/ios/screen-ipad-portrait.png" />
<splash src="res/screen/ios/screen-iphone-landscape-2x.png" />
<splash src="res/screen/ios/screen-iphone-landscape.png" />
<splash src="res/screen/ios/screen-iphone-portrait-2x.png" />
<splash src="res/screen/ios/screen-iphone-portrait-568h-2x.png" />
<splash src="res/screen/ios/screen-iphone-portrait.png" />

Below are the edited config.xml code which worked for me.

<plugin name="cordova-plugin-whitelist" spec="1" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
    <allow-intent href="market:*" />
</platform>
<platform name="ios">
    <allow-intent href="itms:*" />
    <allow-intent href="itms-apps:*" />
    
    <splash src="res/screen/ios/screen-ipad-landscape-2x.png" />
    <splash src="res/screen/ios/screen-ipad-landscape.png" />
    <splash src="res/screen/ios/screen-ipad-portrait-2x.png" />
    <splash src="res/screen/ios/screen-ipad-portrait.png" />
    <splash src="res/screen/ios/screen-iphone-landscape-2x.png" />
    <splash src="res/screen/ios/screen-iphone-landscape.png" />
    <splash src="res/screen/ios/screen-iphone-portrait-2x.png" />
    <splash src="res/screen/ios/screen-iphone-portrait-568h-2x.png" />
    <splash src="res/screen/ios/screen-iphone-portrait.png" />
</platform>

<preference name="scheme" value="app" />
<preference name="hostname" value="localhost" />
<plugin name="cordova-plugin-network-information" spec="^2.0.2" />
<plugin name="cordova-plugin-statusbar" spec="^2.4.3" />
<plugin name="cordova-plugin-inappbrowser" spec="^4.0.0" />

Cheers.

Answer 2

I downgraded to [email protected].