Search code examples
cordovavisual-studio-2015uwpsencha-touchwindows-10-universal

onDeviceReady not firing in Cordova Windows 10 app only in Release mode


I have a Sencha Touch app which worked without issues until the Windows 10 Anniversary update is launched. With the new SDK, my app's onDeviceReady event is not fired after I build the store packages. But it works perfectly in debug mode.

I believe this has something to do with the .NET Native Tool Chain. But I am still lost after 3 days of troubleshooting and lots and lots of Googling. Here's what I have tried already:

  • Re-generated Sencha Touch app using latest Sencha CMD version.
  • Removed and added latest versions of cordova, platforms, and plugins from scratch.
  • Kept the index.html file as minimal as possible to see if it is something to do with the code in this file.

Below is the list of plugins I have installed.

com.phonegap.plugins.PushPlugin 2.5.0 "PushPlugin"
com.verso.cordova.clipboard 0.1.0 "Clipboard"
cordova-plugin-camera 2.3.0 "Camera"
cordova-plugin-compat 1.1.0 "Compat"
cordova-plugin-contacts 2.2.0 "Contacts"
cordova-plugin-device 1.1.3 "Device"
cordova-plugin-device-orientation 1.0.4 "Device Orientation"
cordova-plugin-file 4.3.0 "File"
cordova-plugin-geolocation 2.4.0 "Geolocation"
cordova-plugin-inappbrowser 1.5.0 "InAppBrowser"
cordova-plugin-media 2.4.0 "Media"
cordova-plugin-network-information 1.3.0 "Network Information"
cordova-plugin-screen-orientation 1.4.2 "Screen Orientation"
cordova-plugin-statusbar 2.2.0 "StatusBar"
cordova-plugin-whitelist 1.3.0 "Whitelist"
cordova-sms-plugin 0.1.11 "Cordova SMS Plugin"
cordova.plugins.navbar 1.0.0 "NavBar"
phonegap-plugin-push 1.9.0 "PushPlugin"

I had a doubt if the body onload event is not getting fired. Therefore, I called onLoad() function inside the script tag inside html body also. No luck.

index.html body

<body onload="onLoad()">
    <div id="appLoadingIndicator"></div>
    <script type="text/javascript">
        onLoad();
        var apploading = document.getElementById('appLoadingIndicator');
        apploading.style.lineHeight = document.body.clientHeight + 'px';
        var img = document.createElement('img');
        img.setAttribute('src', resourceURL + '/loading/logo-splash.png');
        apploading.appendChild(img);
    </script>
</body>

onLoad function definition

function onLoad() {
    console.log('xxxxxx addEventListener onDeviceReady');
    document.addEventListener("deviceready", onDeviceReady, false);
    document.addEventListener("resume", onDeviceResume, false);
}

Has anyone come across any similar issues? Any hint on this will be very helpful.


Solution

  • I have found that the onDeviceReady was actually firing, but only after 5+ seconds. Sencha Touch app was loading before the onDeviceReady is fired and the app was accessing device object during launch, which was undefined. This caused the app to crash. Therefore, triggering app launch inside the onDeviceReady handler did the trick.

    onDeviceReady() in index.html

    function onDeviceReady() {
        if (Ext.os.is.Phone) {
            myApp.app.launchPhone();
        } else {
            myApp.app.launchTablet();
        }
        ...
    }
    

    launch() in app.js

    launch: function() {
       // left empty intentionally
    }