Skip to main content
Version: v11.11.5

Debugging Mobile Apps

WaveMaker uses Cordova platform to build hybrid mobile apps. While Cordova handles the native JavaScript API binding, WaveMaker handles the core app logic and UI. A mobile app built using WaveMaker runs in a web view (equivalent to a web browser). How to debug the web view layer is explained below.

Debugging on Android​

Requirements​

  • Android Mobile
  • An App (to debug) built on Cordova
  • Desktop/laptop with chrome browser

Enable USB debugging in Android (one-time setup)​

  • On your android mobile, go to Settings > Security. Enable ‘Unknown sources: Allow installation of apps from unknown sources’

  • Go to Settings > About Phone. In ‘About Phone’ page, click on build number for 7 times to enable developer options.

  • Go to Settings > Developer Options. Enable USB debugging.

Debugging mobile app​

  • Open the app on mobile and connect mobile to a desktop with a USB cable.
  • On the desktop, open a chrome browser and go to ‘chrome://inspect#devices’. All available apps for debugging are shown on that page.

  • Click on inspect link that appears below to your app.Chrome debugging tools will open and you can debug the app.

Debugging on IOS​

Requirements​

  • iPhone
  • Mobile app built on Cordova
  • MacBook (or Mac Pro or Mac Mini) with safari browser

Enable Safari Web Inspector (one-time setup)​

On iPhone​

  • Open Settings and Tap on Safari

  • In Safari Settings, Tap on Advanced

  • Turn on Web Inspector.

On MacBook​

  • Open Safari browser > preferences

  • Go to Advanced and check on ‘Show Develop Menu in menu bar’

Debugging Mobile App​

  • Open the app to debug on iPhone.
  • Connect iPhone to a MacBook with a USB cable.
  • Open Safari in a MacBook, and click on ‘Develop’ menu.

  • Under Develop menu, all connected devices (iPhone) are listed.Under each Device sub-menu, all apps available to debug in that device are listed.

  • Click on the app’s page to open the debugger.