Mobile Dev Environment Setup - quality-manager/onboarding GitHub Wiki

Dev Environment Setup

Browser Setup

Worklight requires certain featues of Java applets which were dropped from Chrome in version 44. To use this environment, you’ll need to install an older version of Chrome. Also, you’ll need to disable Chrome’s auto-update feature so that it doesn’t immediately upgrade you when you start up Chrome 43. ​

1. Download and Install Chrome 43

Local Copy: google-chrome-43-0-2357-134-multi-mac-1.dmg ​

2. Disable Auto-Update

In order to stay on the older version of Chrome and avoid updating in the background, just run the below command from the terminal and you are good to go. Note: this needs to be done only once, immediately after installing Chrome.

defaults write com.google.Keystone.Agent checkInterval 0

​

3. Disabling Chrome’s Web Security

In order to communicate with QM test severs you’ll need to disable web security in Chrome. This can be done by opening the Chrome app with the —disable-web-security argument (as below). This is how Chrome should be opened each time the simulator is used.

open -a "/Applications/Google Chrome.app” —args —disable-web-security

​ NOTE: Visiting the About Chrome page will cause Chrome to immediately upgrade, so stay away from that page. ​

4. Enable NPAPI

Even though Chrome 43 supports NPAPI, it is not enabled by default.

  1. visit chrome://flags/ in your browser
  2. find NPAPI
  3. enable it
  4. restart Chrome
  5. visit chrome://plugins/
  6. set Java as allowed to run

Note: This also should only need to be done once, after installing Chrome. ​

5. Start the Worklight Server and the QM Mobile Client

  1. Right-click on RQMOffile
  2. Click Run-As >> Run on Worklight Development Server
    ​

6. Connecting to Worklight's Emulator

Worklight's Android emulator is accessible through your browser. You can reach it by navigating to the below URL. Remember to update the RQM version number (6.0.1, 6.0.2) to the current version. ​ http://localhost:10080/_MobileBrowserSimulator/index.html?webpage=/QMMobile/apps/services/preview/RQMOffline/android/6.0.1/&platform=android

​ Troubleshooting

Worklight sucks at working, so it is very likely you are going to see some of the below problems. Here are solutions that sometimes work.
​

Emulator Starts, but Screen is Blank

This can happen for a couple of reasons. First, check to make sure that Java is actually enabled.

  1. Did you enable NPAPI in chrome://flags/ ?
  2. Did you enable Java in chrome://plugins/ ?
  3. Check your address bar, there might be an icon that looks like a puzzle piece with an X on it indicating that the app was blocked

It is also possible that your app is running, but when it requested the first page (RQMOffline.html) the server didn’t response and returned a 404.

  1. Make sure that the QM app is actually deployed on the worklight server (check console for “Deployed Successfully to all Environments” message)
  2. Make sure that you have the right URL (sometimes the version number changes)

Another possibility is that the page was loaded successfully from the server, but Javascript errors are preventing it from rendering.

  1. Check your Chrome console for errors ​

WL and/or WLJQ are not Defined

This error sometimes appears in your Chrome console when trying to connect to the mobile app. It has something to do with Worklight not building your app correctly.
​1. Try a clean build of your whole workspace
2. Check this out: http://stackoverflow.com/questions/20606629/ibm-worklight-6-1-uncaught-referenceerrors-wljq-is-not-defined-wl-is-not-def
​

Cross-Site Scripting Warning

This probably means that you forgot to start the browser with web security disabled. It can also mean that you are using a version of Chrome that is newer than v43. ​ Unit Tests

Location

The unit tests for the mobile project can be found in the apps/common/js-test directory. The directory strucutre from that point should mirror the strucure in apps/common/js. ​ Naming Convention

Tests are generally named with the same name as the file they are testing followed by the suffix "Test". ​

Example

ConnectionSettingsRepository
ConnectionSettingsRepositoryTest

​ Setup

1. Install Dependencies

The unit tests are implemented using a couple of libraries that are not stored in the QM source repository. If you have Note.js installed, you can easily get these dependencies by running the command npm install from the directory that contains the package.json file. ​

2. Tweak the Karma-Jasmine Plug-in

The unit tests in this project are setup to run via Karma. The problem is that Karma's Jasmine plugin doesn't seem to play well with Dojo Loader. So, we'll need to tweak it slightly to get everything working. ​

karma-jasmine/adapter.js

In this file we'll want to replace the implementaiton of createStartFn() with the below implementation. ​

function createStartFn(karma, jasmineEnv) {
  // This function will be assigned to `window.__karma__.start`:
  return function () {
    require([
      "dojo/ready"
    ], function(ready) {
      ready(function() {
        jasmineEnv = jasmineEnv || window.jasmine.getEnv();
​
        jasmineEnv.addReporter(new KarmaReporter(karma, jasmineEnv));
        jasmineEnv.execute();
      });
    });
  };
}

This will ensure that Dojo Loader has finished loading and is ready before the Karma-Jasmine adapter tries to run any tests. ​ Run the Tests

To run the unit tests, just run the command karma start from the director that contains the karma.conf.js file.