DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
Refcards Trend Reports Events Over 2 million developers have joined DZone. Join Today! Thanks for visiting DZone today,
Edit Profile Manage Email Subscriptions Moderation Admin Console How to Post to DZone Article Submission Guidelines
View Profile
Sign Out
Refcards
Trend Reports
Events
Zones
Culture and Methodologies Agile Career Development Methodologies Team Management
Data Engineering AI/ML Big Data Data Databases IoT
Software Design and Architecture Cloud Architecture Containers Integration Microservices Performance Security
Coding Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Partner Zones AWS Cloud
by AWS Developer Relations
Culture and Methodologies
Agile Career Development Methodologies Team Management
Data Engineering
AI/ML Big Data Data Databases IoT
Software Design and Architecture
Cloud Architecture Containers Integration Microservices Performance Security
Coding
Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance
Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Partner Zones
AWS Cloud
by AWS Developer Relations
  1. DZone
  2. Testing, Deployment, and Maintenance
  3. Deployment
  4. Setting up Console Debugging for PhoneGap and Android

Setting up Console Debugging for PhoneGap and Android

Raymond Camden user avatar by
Raymond Camden
·
May. 18, 12 · Interview
Like (0)
Save
Tweet
Share
15.48K Views

Join the DZone community and get the full member experience.

Join For Free

In case you haven't figured it out yet, debugging in mobile is "sub-optimal". (Whatever you do - don't do a Google Images search on sub-optimal.) Brian Leroux has an epic presentation on the topic and I highly encourage taking a look through it. I thought I'd share how I'm debugging in PhoneGap and Android right now.

To be clear - this is a sucky way of doing it. "Sub-optimal" is being too nice. Whenever possible I do as much work as I can on the desktop. But when I get desperate and need to test something on a device, I end up resorting to console.log messages. I know this is only one step better than a bunch of alerts, but I thought it might be useful to show how this is done with Android and some tips to make it a bit more palatable.

First - I assume that you are actually using the Android SDK to create your APK files and install. What I'm going to show will work if you use Build to generate your APK, but the tool comes from the SDK. Open up your SDK folder, go into the tools subdirectory, and run "ddms". This stands for "Dalvik Debug Monitor." Here's a screen shot. Notice it has my device in the upper left hand corner.

You will also notice an ungodly amount of messages in the main log panel. This is everything your device is doing. Everything. We'll filter that in a second.

So start up your application, and you should notice the process is now listed below the device. My application had an ID of com.camden.bare, and this is what shows up when I run it.

The first thing you want to do is create a filter. In order to actually see your messages in all the noise your device is generating, you need to create a filter by hitting the pretty little green plus sign.

In the form that pops up, give it any name you want, but be sure to use the 'by Log Tag' field and specify "Web Console":

Ok, at this point, you can now see messages when your application makes use of console.log. Consider this simple PhoneGap/Camera application:

<!DOCTYPE html>
<html>
<head>
<script src="cordova-1.7.0.js"></script>
<script src="jquery.min.js"></script>
<script>
"use strict";
function init() {
	console.log("init...");
	document.addEventListener("deviceready", startUp, false);
}

function startUp() {
	console.log("startup");

	$("#takePictureButton").on("touchstart", function(e) {
		navigator.camera.getPicture(camSuccess, camError, {quality: 25, destinationType: Camera.DestinationType.FILE_URI});
	});	

	function camError(e) {
		console.log("Camera Error");
		console.log(JSON.stringify(e));
	}

	function camSuccess(picuri) {
		console.log("Camera Success");
		console.log(picuri);
		$("#result").attr("src", picuri);
	}
}
</script>
</head>

<body onload="init()">

<h1>Camera Test</h1>

<button id="takePictureButton">Take a Picture</button>

<img id="result">

</body>
</html>

I've got a few console messages for my events. They aren't incredibly helpful, but they let me know things are progressing as I expect. Here's a quick example:

 

What's cool is that it will also log unexpected errors for you. I wish I could say I planned this, but I did make a mistake in my "simple" little application and I saw it immediately in ddms:

 

In general, that's it, but here are a few more tips to keep in mind:

1) I find that I have to click on my filter to 'refresh' the list view. Remember that if you don't see the panel updating.

2) console.dir "works" in that it prints out to the log, but it's not a nice interactive tree like you see in Firebug. If you use that on a complex object, or even console.log, you pretty much end up with [object Object]. Instead, use JSON: console.log(JSON.stringif(something));

3) If you make use of the tip above and find that log message is super long and hard to read, then mouse over the log line and wait. A tooltip will appear with the message in a smaller, easier to read format.

I hope this helps. Again - I'm not putting this out as a great way to debug. It "works" now but could certainly be a heck of a lot better.

Android (robot) Console (video game CLI) mobile app

Published at DZone with permission of Raymond Camden, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

Popular on DZone

  • How To Handle Secrets in Docker
  • HTTP vs Messaging for Microservices Communications
  • Fargate vs. Lambda: The Battle of the Future
  • Reliability Is Slowing You Down

Comments

Partner Resources

X

ABOUT US

  • About DZone
  • Send feedback
  • Careers
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 600 Park Offices Drive
  • Suite 300
  • Durham, NC 27709
  • support@dzone.com
  • +1 (919) 678-0300

Let's be friends: