Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Debugging Mobile Web   Apps Remotely       James Thomas
Why do people likedeveloping applications     for the web?
Debugging Tools
Firefox
Chrome
?Mobile Platforms
Mobile Platforms
Web Inspector Remote
> GOTO DEMO
How does it work?
WeinreDebug Target            Client               Server
Insert custom JS into               target                            Weinre      Debug Target                            ...
Connect to client               WeinreDebug Target            Client               Server
Client generates debug            events                           Weinre     Debug Target                             Cli...
Target evaluates and         sends response                        Weinre     Debug Target                        Client  ...
WebKit Inspectorupdated with response               WeinreDebug Target            Client               Server
Running a server locally? Ugh :(
debug.phonegap.com
What are the other  alternatives?
JS Console
WebKit Remote Debug                Text                 TextChromium --remote-debugging-port=9222
Summary
Summary• Weinre is a great solution for mobile  environments...
Summary• Weinre is a great solution for mobile  environments...• ...but hopefully a temporary one!
Summary• Weinre is a great solution for mobile  environments...• ...but hopefully a temporary one!• Not finished, follow th...
Thank you & Questions?
Upcoming SlideShare
Loading in …5
×

Debugging mobile apps

1,400 views

Published on

London AJAX Mini Conference talk about Weinre in July 2011.

Published in: Technology, Business
  • Be the first to comment

Debugging mobile apps

  1. 1. Debugging Mobile Web Apps Remotely James Thomas
  2. 2. Why do people likedeveloping applications for the web?
  3. 3. Debugging Tools
  4. 4. Firefox
  5. 5. Chrome
  6. 6. ?Mobile Platforms
  7. 7. Mobile Platforms
  8. 8. Web Inspector Remote
  9. 9. > GOTO DEMO
  10. 10. How does it work?
  11. 11. WeinreDebug Target Client Server
  12. 12. Insert custom JS into target Weinre Debug Target Client Server<script src="http://server:8080/target/target-script-min.js"/>
  13. 13. Connect to client WeinreDebug Target Client Server
  14. 14. Client generates debug events Weinre Debug Target Client Server{"args":["alert("hello")","console",true,"442489609::27"...
  15. 15. Target evaluates and sends response Weinre Debug Target Client Server{"interface":"WeinreTargetCommands","method":"sendClientCallback".....
  16. 16. WebKit Inspectorupdated with response WeinreDebug Target Client Server
  17. 17. Running a server locally? Ugh :(
  18. 18. debug.phonegap.com
  19. 19. What are the other alternatives?
  20. 20. JS Console
  21. 21. WebKit Remote Debug Text TextChromium --remote-debugging-port=9222
  22. 22. Summary
  23. 23. Summary• Weinre is a great solution for mobile environments...
  24. 24. Summary• Weinre is a great solution for mobile environments...• ...but hopefully a temporary one!
  25. 25. Summary• Weinre is a great solution for mobile environments...• ...but hopefully a temporary one!• Not finished, follow the progress on Github
  26. 26. Thank you & Questions?

×