Debugging Cordova (PhoneGap) code on iOS - ios

I'm working on an app I want to host in iOS via Cordova (PhoneGap). I've run into some problem when I try to access the device.platform and device.version properties. I'm not sure what the problem is. Either way, I can't figure out how to peek into the code to get a better idea of what's going on.
I thought I could just fire up the .html in the desktop version of Safari, however, that didn't provide any insights. In short:
How do I debug code running inside of Cordova?
Any ideas why I can't just do a "alert(device.platform);"?
Thank you!

Since iOS 6 you can just enable the Develop menu in Safari and use Safari Web Inspector to remotely debug Cordova app in either iOS Simulator or USB attached devices. If you've used Chrome's debugger you'll feel right at home.

as well as Weinre, there is also iWebInspector which is useful and perhaps better on ios.
http://www.mobilexweb.com/blog/debugging-web-safari-phonegap-iphone-ipad
I think it maybe only applies to the simulator but thats fine for most cases anyway. It is more Xcode and iOs debugging solution in my opinion .

I use nifty debugging tool called Weinre, which is a lifesaver when debugging cordova( phonegap) apps. It basically is a remote debugging tool resembling usual webkit developer tools available in Chrome and some other browsers.
Make sure that Cordova is loaded before you try to call device.platform. Cordova is loaded when deviceready js event is triggered.

Related

Is it possible to Debug iOS app on Windows/Linux?

is there a way how to debug an iOS mobile app on Windows or Linux (Ubuntu)?
I have an application which runs fine on Android, but it has some flaws on iOS. For Android debugging, I always used the Chrome device inspector and I am wondering if it’s possible for iOS too?
The Webkit Adapter I found (https://github.com/RemoteDebug/remotedebug-ios-webkit-adapter) works for debugging websites opened on iPhone via SAFARI browser, but not for the mobile app. Any ideas?
Thanks a lot for any suggestions.
Yes, you can develop your own lldb to support debugging non-jailbroken iOS device on Window, like this

Can I debug installed hybrid ios app from windows

My phonegap app is crashing randomly in some ios devices, not happening from phonegap client.
Is there a way to debug an installed ios app with a windows pc ?
Debug a Cordova app is a pain. Since the app is running inside a browser-like, all native debuggers are unuseful. In you specific case, I can suggest you to use Weinre, a remote tool able to show you something as the app is running and you can maybe catch the bug you're seeking.
You can start reading this link or this link and maybe google WEINRE.
Since your iOS app is crashing, most probably the issue will be with the Native Code.
BTW, you can try checking this tool - GapDebug

Debugging PhoneGap on Device

Normally I'm a JEE guy but these days I'm working on a mobile app. I chose PhoneGap because there are not so many needs to UI and I thought this would be the easiest way to serve the app on many platforms.
I'm wondering if my setup is good and if it's possible to get console output when running on the device. I'm working on MacOS and iPhone6.
I installed PhoneGap and Cordova via npm and serving the files with phonegap serve.
For local debugging I'm using the chrome plugin "Ripple".
For debugging on the device I'm using the PhoneGap Developer App from the AppStore, together with weinre on my Laptop to get some debugging data. In weinre I can see everything except console outputs. Is this normal? Or any idea how I could get the console to weinre, too?
I also found some tutorials on the web using XCode and some native iPhone emulator but didn't get this working yet. Which way is the more preferable way of debugging on device?
You don't need any tool for debugging cordova app. For iOS just start the app in stimulator and start safari. In safari go to Develop > 'your pc name' > ios simulator.
http://webdesign.tutsplus.com/articles/quick-tip-using-web-inspector-to-debug-mobile-safari--webdesign-8787
For Android run the app in your device and in the chrome go to http://chrome://inspect/#devices
Weinre is quite old and should not be be used anymore, instead, you want to use the remote debugging tools in your browser. For iOS, you can use Safari to debug your Cordova app. I've got a full article here, https://dzone.com/articles/overview-mobile-debugging, but the process involves doing one setting on your mobile device, and then simply opening up Safari and going to the debug menu. You can also do this with Chrome and Android apps.
Another option is GapDebug (https://www.genuitec.com/products/gapdebug/) which lets you do iOS and Android together in one Chrome tab.

Enable iPhone (with iOS7) debug console from Windows

I'm trying to debug my website, but Apple are douches. What do I do to enable the debug console if I don't have a Mac?
I installed Safari and the latest iTunes, but my iPhone doesn't show up in Safari developer thing.
You can try option of using Telerik AppBuilder (Windows client) as a replacement on Windows for Safari debugger on Mac when remote debugging. There's a nice blog post about the steps to do it in link below. I'd rather not repost the info as there are also screenshots and it's a lot of text. But essentially, you install app, open it, connect device via USB, then you can find it in the app and open up the developer tools/debugger for it. For non-public websites, you'll have to open up port 80 with some firewall configs documented in the post.
http://blog.falafel.com/Blogs/josh-eastburn/2014/03/04/ios-web-inspector-on-windows-with-telerik-appbuilder
The tool requires a license or you can use the trial, which becomes a basic edition afterwards. I think the basic edition will still allow you to do the debugging. I'm going to try it out myself.
You can also try these iOS apps too, you can find them in the iTunes App store. They give you a built in developer tools feature (right on iOS no remote debug) that mobile Safari doesn't offer.
MIH Tool - basic edition
https://itunes.apple.com/us/app/mihtool/id584739126?ls=1&mt=8
HTTPWatch Basic
https://itunes.apple.com/us/app/httpwatch-basic-http-sniffer/id658886056?mt=8
I gave them a try and they're at least better than the mobile Safari you get on iOS, unless one needs to target full mobile Safari compatibility. I'm guessing the pro/paid editions of those apps give you more/better features.
iOS Debugging with Safari is a featuere of the new Safari. As Safari for Windows is a outdated Version of Safari, debugging is not Implemented.
So debugging with Safari is only possible on a mac!
min requirements are: OS X 10.8 iOS 6
More Infos:
Safari Remote Debugging on Windows
Since that Question was asked i found another neat way to debug stuff on a not accessible Platform:
http://people.apache.org/~pmuellr/weinre-docs/latest/
It works like this:
You add the weinre.js to your project
You set up weinre on your main platform (pc)
Starting your project results in sending the Debug Information from your project to your Platform
It's not that easy to run and understand, but once it works its pretty nice.
Did you set up your phone to allow remote webview inspection?
http://moduscreate.com/enable-remote-web-inspector-in-ios-6/
As an alternative to Weinre, you can try Vanamco's Ghostlab as well, it supports JS console and parallel testing on multiple device.

Debug a PhoneGap app running in Emulator using WebStorm

Is there a way to debug the javaScript of a PhoneGap based iOS app within WebStorm while the app is running in the iOS emulator? The problem is that some of the events (like 'deviceready') need to be fired to enter certain code paths that I want to debug.
It is all described here in great detail:
http://www.tricedesigns.com/2013/01/18/my-workflow-for-developing-phonegap-applications/
It is a great article that every phonegap starter should read, as it describes how you can set up your development environment.
I have many options:
Phonegap simulator
iOS emulator remote debugger
remote debugging on the actual device
It won't integrate with webstorm but the debugging tools described above are much more powerful anyway.

Resources