Tutorial hero
Lesson icon

Genuitec Release EPIC Debugger 'GapDebug' for PhoneGap Apps

Originally published August 17, 2014 Time 4 mins

Fulfilling my daily quota of procrastination I happened upon a new discussion in the PhoneGap LinkedIn group (go ahead and join it if you haven’t already). Jason O’Keefe, Senior Marketing Manager at Genuitec, announced the release of GapDebug – “an always free debugger – for hybrid mobile apps designed on top of the Cordova/PhoneGap SDK”.

Sounded interesting enough to check out so I went to their website to download it and give it a shot. Within minutes of installing it I was absolutely blown away, this is the tool I’ve wanted for so very long.

Debugging PhoneGap Build applications has always been difficult. I’ve written previously about using weinre to debug a PhoneGap Build application and while it’s useful it often misses the mark. It seems to display only a limited amount of debugging information and a lot of the time I don’t even bother with it. GapDebug integrates the Safari Webkit Inspector and Chrome Developer Tools to create an integrated debugging experience for OS X and Windows. Although I must admit I am yet to extensively try debugging with it, first impressions are that it blows the weinre approach out of the water.

The debugging isn’t even my favourite thing about GapDebug though, I don’t even have to use iTunes anymore. Unless I’m using Hydration every time I want to install an app on my iOS device to test I would have to connect my iPhone, wait for iTunes to open…

Waiting to sync…

Backing up…

After several frustrating minutes I’m able to access the clunky iTunes menu, which likes to freeze on me for random periods of time, and finally manage to install the application on my device.

With GapDebug, I connect my device, open up GapDebug, drag and drop my .ipa into the sidebar, it installs itself on my device and I’m done – debugger ready to go.

 

Gap Debug Screenshot

 

I didn’t even know you could install an app on an iOS device without iTunes – this is going to improve my workflow a lot. Of course, it’s not just for iOS applications though, Android applications can be installed the same way.

GapDebug is just recently out of its private beta, so there will be further development but it is completely useable as of right now. Currently it does not support Android versions older than 4.4, but this may be on the roadmap for the future:

[The development team] looked into supporting older versions of Android months ago but turns out it would be a very large development effort with high risk; as a workaround [they are] investigating a weinre-like fallback capability.Jason O'Keefe

Installing & Using GapDebug

Fortunately, getting set up with GapDebug is super simple. Just head over to the website and click ‘Get GapDebug’. Choose the appropriate download for your OS and follow the prompts to install. Once installed follow these steps:

  1. Open up GapDebug (you should also find it available from your system tray)
  2. Connect your device to your computer
  3. On an iOS device make sure to hit ‘Trust’ when the option pops up and on an Android make sure USB Debugging is enabled
  4. Either upload your .ipa or .apk file through GapDebug or just drag and drop it onto the left hand side
  5. Wait a couple seconds and you’re ready to start debugging!

The process is so smooth and the UI clean and intuitive, this is definitely becoming my default debugging tool. Let me know what you think below.

Learn to build modern Angular apps with my course