Uncaught ReferenceError: WL is not defined in MobileFirst Migrated app

Question

I am in process of migrating the MFP app from V7.1 to V8.0. I ran the migration tool and it created the cordova project and then I migrated my code from common directory of MFP V7.1 project to the www of newly created cordova project. I made the changes mentioned in this page. I register my app on the server and then did mfpdev app pull and mfpdev app push then cordova prepare and then I ran the app preview using 'mfpdev app preview'. When the app opens on the browser, I am getting below error:

http://localhost:10081/android/assets/www/worklight/worklight.css Failed to load resource: the server responded with a status of 404 (Not Found)
AuthRealmChallangeProcesser.js:7 Uncaught ReferenceError: WL is not defined
jquery-2.1.1.js:8554 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
browser-sync-client.2.11.1.js:129 Uncaught TypeError: Cannot read property 'data1469206076574' of null
http://localhost:10081/android/assets/www/cordova.js Failed to load resource: the server responded with a status of 404 (Not Found)_mbs_cordova_sim_load_js @ cordova.js:2198
cordova.js:1186 Channel not fired: onPluginsReady
cordova.js:1186 Channel not fired: onCordovaReady

following are the files which are getting referenced in the index.html file in the script tag:

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="worklight/worklight.css">
    <link rel="stylesheet" href="css/main.css">
    <script type="text/javascript" src="cordova.js"></script>
    <script src="jqueryMobile/jquery-2.1.1.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?key=mykey"></script>
    <title>My App</title>
    <script src="jqueryMobile/jquery.mobile-1.4.2.js"></script>
    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
    <link rel="stylesheet" href="css/themes/jBlue/jBlue.css" />
    <link rel="stylesheet" href="css/themes/jBlue/jquery.mobile.icons.min.css">
    <link rel="stylesheet" href="jqueryMobile/jquery.mobile.structure-1.4.2.css" />
    <!-- Uncomment Below for default theme and change data-theme to "a"-->
    <link rel="stylesheet" href="jqueryMobile/jquery.mobile-1.4.2.css" />
    <script src="js/AuthRealmChallangeProcesser.js"></script>

Idan Adar Idan Adar · Accepted Answer · 2016-07-23T04:46:33

I register my app on the server and then did mfpdev app pull and mfpdev app push

You only do mfpdev app pull/push if you have existing configuration on the server that you want to take (pull) and use elsewhere (push). It has nothing to do with migrating your Hybrid application to a Cordova application.

http://localhost:10081/android/assets/www/worklight/worklight.css Failed to load resource: the server responded with a status of 404 (Not Found)

From the error it looks like you are referring to a non-existing file. Double-check that it is actually there.

http://localhost:10081/android/assets/www/cordova.js Failed to load resource: the server responded with a status of 404 (Not Found)_mbs_cordova_sim_load_js @ cordova.js:2198

Did you also copy this file? You should not. You should only reference it in the index.html file. Cordova takes care of this.

You also did not specify if you have followed the additional remaining steps, such as step 3.2. mentioned here: https://mobilefirstplatform.ibmcloud.com/tutorials/en/foundation/8.0/migration-cookbook/#migrating-applications

Uncaught ReferenceError: WL is not defined in MobileFirst Migrated app

1 Answers