Mobile applications Development - Lecture 9
LAB
PhoneGap Development Environment
Debugging PhoneGap Applications
This presentation has been developed in the context of the Mobile Applications Development course at the Computer Science Department of the University of L’Aquila (Italy).
http://www.di.univaq.it/malavolta
5. My testing/debugging process
1. Code & test in the Desktop browser
– This works for functionalities not relying on
PhoneGap
– You may use PhoneGap shimmers here
2. Run in the simulator & test in the Desktop
browser
– Very handy & accurate
3. Run on the device & debug in the Desktop
browser
– Complete control & confidence
6. Desktop Browser
+ very quick
+ very handy functions
see Chrome’s Web Development Tools
+ direct
+ Breakpoints
- cannot test user agent metadata
agent’s
- browsers’ small differences and bugs
- cannot test all PhoneGap specific functionalities
PhoneGap’s
- you need PhoneGap shims
7. Chrome Security Restriction
If you need to test your JSON calls from a local web
app, you need to relax Chrome’s security policies with
respect to local files access and cross-domain
resources access
OSX
open -a Google Chrome.app --args “
--disable-web-security“
Windows
chrome.exe --disable-web-security
DO IT ONLY FOR DEBUGGING!!!
9. PhoneGap Desktop
1. Choose a webkit browser
2. Copy debugdata.json into the root www folder
of your app’s project
3. Use phonegap-desktop.js in place of the
standard phonegap library
4. modify debugdata.json to your specific needs
11. Simulator
+ you use the device’s browser
device’s
+ very handy functions
+ see Chrome’s Web Development Tools
+ direct
+ breakpoints
- device’s performance is not considered
evice’s
this is iOS-specific
- performances may be biased
usually you need some kind of hook within your app
- device’s capabilities are only simulated
device’s
13. on Device
+ accurate
+ still handy
+ accurate performance tests
+ accurate browser tests
browser’s
- You need to deploy the app to a real device
- No breakpoints
14. onDevice - Tools
Weinre
http://people.apache.org/~pmuellr/weinre/docs/latest/
3 main components:
components:
• Debug Server the HTTP server that’s used by the
Server:
Debug Client and Debug Target
• Debug Client the Web Inspector user interface
Client:
• Debug Target the (web) app you are debugging
Target:
19. .. A final consideration
… these are MY development environment and
the debugging tools I use
Consider them as a starting point
& feel free to use others