Any recommendation/suggestion on best practice to develop app using PhoneGap for Android or iOS? - webkit

Also, is there a way to test those webapp in a webkit based browser such as chrome (with phonegap plug-in maybe) on a PC first before compiling it to test on a device or emulator?
The key reason is that trouble shooting mal-formed html, javascript code is very difficult on a device or emulator. You can not view the js console to see all error. The Weinre is great, but it can not spits out the error browser complains when initially loading the page.
It will be great if we can validate the html, js, css app first before diving deeper into testing on Android device. i.e. a way to weed out some simple problems before getting into more complicated deeper problems.
Any experience/suggestions/ideas/pointers are greatly appreciated.
Paul> Seems promising. Will try and report back. It seems knowledgeable in phoneGap mob dev. What are the key steps would you go through to dev a phoneGap mob web-app?

Ripple is a Chrome plug-in that includes a PhoneGap mode.
For JavaScript static validation, the PhoneGap Android Eclipse AppLaud plug-in includes a JSLint mode.

I would recommend you use Safari. In your Safari (on Mac) go to Settings (on PC) goto preferences -> Advanced -> check on "Show Develop in Menu bar".
Now you'll find in the Menu "Develop" "User Agent". There you can change the UserAgent identification, that will be send to the server. You can then change it to iPhone.
This way you can at least test it for iOS.
Hope that helps somewhat.

Related

Vue Native - Debugging

Recently I switched from Ionic framework to vue-native (vue.js wrapper around react-native), everything seems to be cool, development is fast and easy, but I have some real issues with debugging those apps. With Ionic Framework (Cordova) I was able to open an app in web browser and could easily manage Vuex state (for example) from Chrome Console. It doesn't seems so easy and trivial in react native world. Is it possible to have similar debugging experience in vue-native? When my app starts to grow and gets complicated it's really hard to handle it other way around. Any help appreciated.
Basically all my problems gone away when I ported my apps to Expo (which allows for JS remote debugging) and grabbed React Native Debugger - https://github.com/jhen0409/react-native-debugger.
Important part is having simulator installed on your developer machine (like iphone simulator) because debugger doesn't play nicely with real machines.
Inside debugger hit cmd+t to open a new window and set port to 19001 (because of Expo using this port). Now start expo with npm start command and in Expo panel hit 'Run in simulator' button.
In simulator make a shake gesture (ctrl+cmd+z) and allow remote debugging in developer menu.
Done. Pleasant experience similar to one known from Cordova. You have a js console, you can inspect elements and change styles live. Expo comes with live reload to make things smoother.
More info here: https://docs.expo.io/versions/latest/workflow/debugging/
Unfortunately, you cannot debug script parts in the VUE files in Chrome Dev Tools (you can put the breakpoints, but they are not working well), but if you put the methods to a separate JS file, it works like a charm. I know, it's a workaround, but not a big pain, and working well.
See my TODO app for example: https://github.com/TheBojda/VueNativeTodo

React Native debug

I’m doing a React Native project. It has a bug.
The bug make the APP just exit(it can functional run a while, but suddenly...just gone). So it dose not report error. How can I find out where the problem is?
My APP used react-native-bluetooth-serial.
My code on Github
Are you running it on you simulator.
If that is so you have to use real device for testing it as simulators do not have access to bluetooth peripherals.
Hope this helps.
You can use Genymotion or real device to use bluetooth enabled app. To test your bug you can also use "Debug JS remotely" feature of react native dev tools.
To enable dev tools in your real device, shake your device and dev menu will appear. In emulator you can press Ctrl + M to enable dev menu. then you can choose "Debug JS remotely" which will open in chrome. If you are familiar with web development then you might have used "Inspect element" feature which will open dev tools.
The answers are right. You might be using a simulator which doesn't support bluetooth.
To know more about the crash you can check the logs natively. For android just run this inside your android folder
adb logcat
Or you can use
react-native log-ios
react-native log-android

How to disable phonegap autoreload (At least during dev)

Here is my issue:
I've installed phonegap and phonegap desktop.
http://code.riffzone.net/phonegap-install-msw/
Now, when I'm working on my application (Jquery Mobile), I'm testing it on a browser, but the application is reloading again and again after every 2 seconds and I can't even write something in the form input, reloading to fast..
I don't understand where this is coming from?
Here is the screen shot of my browser and the firebug console where you can see the page reloading over and over (1) and the api_auto_reload in the console (2).
Thanks a lot :)
The reload should be triggered only when some of your source files is changed. For some reason it does detect change on your files constantly. That reason is quite hard to find out without debugging more. You can, though, turn the auto reload off with --no-autoreload switch for phonegap serve like this
phonegap serve --no-autoreload
It was phonegap desktop beta (the minimalist server) and not phonegap (command line) which was causing this bug.
If you have the same issue, make sure you are not using it.

Titanium app immediate crash on BB10.2

I've been developing an app with Titanium, and I've got the app up and running on both iOS and Android.
Today I set up the Blackberry 10 environment to be used with Titanium and tried to compile and deploy to the simulator... It worked! But alas, after a brief peek at the appcelerator splash screen, the app crashes; all without any errors, warnings, or logs of any kind.
I've used telnet to see if there were any logs in the '1000' directory, and the logfile was empty for my app.
From what I've read in appcelerator's documentation and what I've discovered in the Titanium Studio software, Blackberry debugging support is not included.
Further information: I'm using the Parse JS library (not as a titanium module, just as a JS import) and my main window contains a TabGroup.
If anyone has any experience in Titanium for BB10 or insight as to what may point me in the right direction, that would be amazing.

Automated user interface testing in Titanium

How can I create automated user interface tests for a Titanium app? Does the framework include something for this? Are there any helpful third party tools?
Have you looked at titanium-jasmine?
I have never personally used it but ive heard its pretty useful for this type of thing. I'm not sure about its abilities to test actually visual elements.
EDIT:
For testing the user interface and simulating touch events on the simulator or device, just use UIAutomation with the native workflow! Since every Titanium project compiles to an XCode project (which can and should be at least profiled for memory leaks using the native workflow before release to the app store), you can just follow the steps here to write your own tests in Javascript.
As a first step, run your app in the simulator, then got to PROJECT_HOME/build/ and open up the xcodeproj file. Once inside XCode, hold down the "Run" button, click "Profile", which will open up "Instruments" and add the "Automation" widget like in the link I provided!
This is not titanium specific, it can be used for any iOS app and seems like a great tool for every iOS developer, along with Allocators and Memory Leak widgets inside of instruments.
Possibly a better alternative is using Gorilla Logic's free MonkeyTalk. It is a bit more straightforward if your not very experienced with XCode, and it has the benefit of (theoretically) being able to test iOS and Android.