How to set up the environment and debug application while creating mobile version

APP

  1. run chosen OpenLMIS module, for example stock-management (in project directory):

sudo docker-compose run --service-ports stockmanagement-ui npm i grunt grunt build --serve --openlmisServerURL=https://uat.openlmis.org --noTest

ANDROID STUDIO

  1. Download Android Studio

  2. Create new empty project

  3. Choose existing emulator or create a new one (emulator must have play store icon)

  4. Run emulator

  5. Open chrome app

  6. Navigate to 10.0.2.2:9000

  7. Choose ‘webapp’ directory

  8. Click the three dots on right upper corner of chrome app, choose ‘Add to home screen’ → ‘Add’ → ‘Add to home screen’

  9. OpenLMIS app should appear on the screen (it can take a few seconds)

10. Open OpenLMIS app, choose ‘webapp’ directory

11. Mobile app should be displayed

 

DEBUGGING

  1. Navigate to chrome://inspect/#devices on your PC

  2. Emulator device should be visible (if it is not, please make sure that you have opened OpenLMIS app on your emulator)

  3. Click ‘inspect’ under your device

  4. Window with DevTools should open with access to all developer tools

 

OpenLMIS: the global initiative for powerful LMIS software