One common issue is finding out issues with an application you have converted to mobiles.
Intel XDK actually does offer debugging tools to help out with this problem.
Their configuration and usage might be a bit "silly" at first, so here is a walkthrough to get started.
Note: We are talking about a debugging like mentioned in the tutorial on how to check for errors in browsers, not the actual C2 debugger.
It means you will have to use the browser plugin to log most of the informations you will need and see them displayed during execution. Still it is a valuable debugging tool to have.
Plug your device to your computer
You will indeed need to plug your Android device to your computer through USB.
Only Android 4.0+ devices will work with that process.
This page from Intel XDK's documentation should be of help in the process of setting things up.
° Be sure to install the Android Debug Bridge (ADB) USB Driver on your computer as indicated in the documentation page.
° Enable USB debugging on your Android device as indicated in the documentation page.
° Install "App Preview" on your Android device.
° Confirm that you can see your Android device using Chrome desktop browser by going to the URL chrome://inspect (specific to Chrome's browser, will be required later).
Once you have done all those steps, and that connecting your device to your computer does work as intended (your computer has the drivers to see it, connecting USB is set on the device) the rest happens in Intel XDK.
Intel XDK
Execute Intel XDK and go to the "Debug" tab of any project you have previously set up.
If you need help on how to setup a project for Intel XDK, you may want to check this other tutorial out first.
If you haven't yet connected your device through USB, you should see a schema that invites you to do so with help buttons on how to plug either an Android or iOS device.
At this point normally we've set everything up correctly so go ahead and connect your device.
According to the plugins present in your XDK project, a debug module will have to be created. This is an automated process, all you have to do is press the "Start" button and wait for XDK to create that module, copy it on your computer and your Android device.
Execution time for this (and later features) depends on your internet connection and the how busy Intel's build server is.
Be patient and let it go through.
If ever the process seems to freeze, don't hesitate to exit XDK and start it again, it should take back from where it froze.
The best being to let it go all at once.
Once the debug module is created and set on the computer and device, you will be allowed to start the debugging session.
To do so you have two possible icons.
The bug icon (left, representing an insect with a cross on it) will send out the project files and acts as a sort of compiler.
When it is the first time you execute a project or that you have made some modifications to it, start our debugging with that icon. When executing, the Debug Tab should change to a view of the app and the browser (Chrome) console to the right.
This can require to have a Chrome windows running in the background set to the chrome://inspect URL we talked about earlier.
The "preview" icon (middle, representing a circle with a triangle in it) is just to start a debugging session with the current set project files. The session should start quicker than when first "compiled" with the bug icon. The difference is also that the Debug tab in XDK won't change.
Clicking on any of those two icons will have as an effect of executing "App Preview" on your Android device and starting up your project in it.
The third icon (right, representing a mobile with a "Close" sign on it) enables itself (white highlight) when you are executing the debug session. This icon allows you to stop the session, shutting down your application execution in App Preview (placing it in the background) and frees the "Debug" Tab as well.
The last icon to the extreme right, representing a mobile with a paint brush on it is there to remove the debug module. When you do so, next time you'll want to debug your application you will have to create again this module. Nevertheless it can be useful in case where you have to modify the cordova plugin used and other.
So basically, to execute your debug session you likely want to use the "Debug" icon and Chrome's console.
Debugging
In your Construct 2 code, be sure to add the Browser plugin and use the "Log" action to notify you important informations (like variables values) or keep track of your code's execution.
Was such event executed or not ? Know it by a log letting you know the event has been executed. If the log appears in the console, it means that the log action has been executed, so the events conditions were true.
It also means that the following actions of this very event are supposed to be executed as well.
That's a good way to keep trace of where a bug in your code may be, by eliminating level by level the faulty execution.
Moreover the console does also log "higher level" (understand engine level) errors.
If a texture is missing for example, it's likely a red error with a 404 number will be logged, stating the exact name of the missing file and even the URL it would be expected to be found at.
That's good information to keep an eye on as well and that can give you clue sometimes when the whole execution seems to fail.
You can even find out more informations by not minifying your project when you export it out of Construct 2, it can end up allow you to read through the JavaScript code of your application and get further error messages in the console.