Is There a Real Solution to Debug Cordova Apps

Is there a real solution to debug cordova apps

NOTICE

This answer is old (January 2014) many new debugging solutions are available since then.

---

I finally got it working! using weinre and cordova (no Phonegap build) and to save hassle for future devs, who may face the same problem, I made a YouTube tutorial ;)

How to debug cordova/phonegap app in windows phone emulator

It's very easy to debug a Windows Cordova/Phonegap app from Visual Studio. When you create your project and then add the Windows platform:

cordova create hello com.example.hello HelloWorld
cd hello
cordova platform add windows

Cordova will create a CordovaApp.sln file in the hello\platforms\windows directory. Open that up in Visual Studio 2013 (or open CordovaApp.vs2012.sln if you have Visual Studio 2012), select the project you want to debug in the Solution Explorer pane, select the emulator you want to run it in in the toolbar (or select Device to run it on an actual device), and then hit F5 to start debugging. You can set breakpoints in your Javascript code just like you would in C# or VB.

Visual Studio 2015 RTM Cordova project won't debug/deploy to Android, Windows, Windows Phone

Looks like a library is corrupted from the upgrade. Please give this a try:

1. Close all VS instances
2. cd %appdata%\Local\Microsoft\Phone Tools”
3. rename CoreCon folder
4. Launch VS again.

Let us know if this resolves your issue.
Thanks for using VS 2015 and Tools for Apache Cordova.

Soak.

Unable to receive debug messages for crashing cordova app on windows 8.1 phone device

I think it was because you got a native exception which cannot be captured by current debugger type. In classic windows phone project like c# and winjs project, we can set the debugger type to support both managed and native. I think it's worth to try if you can get more info by enable native debugger.

By default, for Cordova project, the default debugger type is Script only. We can find it out by enable Diagnostic build log: Tools->Options->Projects and Solutions -> change "MSBuild project build output verbosity" to Diagnostic.

Then let's take an example to show what we can find:

1. Create a new black cordova project.

2. Change Solution Platform to Windows Phone (Universal) and select "Emulator 8.1 WVGA 4 inch 512MB".

3. Build the solution. Then let's check the build log in output window.

When searching "debuggertype" in output window, we will be able to find the following info:

DebuggerFlavor = PhoneEmulator81Wvga4512
DebuggerType = Script
DebugSymbols = false
DebugSymbolsProjectOutputGroupDependsOn =
DefaultContentType = Default
DefaultReferenceGroup = Implicit (Apache Cordova)
DefineCommonReferenceSchemas =
DefineExplicitDefaults = true

We can see the DebuggerType was set to Script. This is inherited from globle settings in MSBuild. You will be able to find what the file is from the Diagnostic build output log as well.

Then let's see how we can change it to capture native exceptions. Go to your project folder and open .jsproj.user file. We can find the following setting:

  <PropertyGroup Condition="'$(Configuration)|$(Platform)'=='Debug|Windows Phone (Universal)'">
    <DebuggerFlavor>PhoneEmulator81Wvga4512</DebuggerFlavor>
  </PropertyGroup>

Now, change it to the following will change the debugger type, you can verify that in build log.

  <PropertyGroup Condition="'$(Configuration)|$(Platform)'=='Debug|Windows Phone (Universal)'">
    <DebuggerType>Mixed</DebuggerType>
    <DebuggerFlavor>PhoneEmulator81Wvga4512</DebuggerFlavor>
  </PropertyGroup>

Then you can run your app again to see if it will get any info in your visual studio output windows.

How to view Visual Studio 2015 Javascript Console after debugging mode stops?

this is the only way i've figured ;

1. Ensure JS console button "Clear on navigate" is not set
2. Start the app so that the errors appear albeit momentarily
3. Remove plugins and associated code one by one until your app doesn't crash
4. View original error messages in the JS console from previous sessions

What possibilities are around to debug Cordova apps (with native plugins)?

You can debug Android native code in Android Studio, iOS code - in XCode (on OSX).

Windows plugins code is best to debug in Visual Studio.

Visual Studio Code editor is handy to debugging the app (js) code (it also supports livereload if you have Ionic installed).

VS Community 2015 - No Windows Phone Emulator Installed

Thanks for upgrading to the RTM VS 2015. Unfortunately, you do require VS2013 for Windows 8 emulators to be installed. They aren't available on VS 2015 or there is no stand-alone installer for the emulators. But you should be able to deploy your Windows 8 application on Windows 8.1 emulators, if that helps.

---

Related Topics