Weinre is a tool that allows remote debugging of mobile web apps by inserting custom JavaScript into the target app and connecting a client. It works by having the target generate debug events that are sent to and evaluated by the server, which then sends responses back to update the client's WebKit Inspector. While Weinre is useful for mobile environments, running a local server can be inconvenient, so services like debug.phonegap.com and built-in browser tools are better alternatives.

1. Debugging Mobile Web
Apps Remotely
James Thomas

2. Why do people like
developing applications
for the web?

3. Debugging Tools

4. Firefox

5. Chrome

6. ?
Mobile Platforms

7. Mobile Platforms

8. Web Inspector Remote

9. > GOTO DEMO

10. How does it work?

11. Weinre
Debug Target Client
Server

12. Insert custom JS into
target
Weinre
Debug Target Client
Server
<script src="http://server:8080/target/target-script-min.js"/>

13. Connect to client
Weinre
Debug Target Client
Server

14. Client generates debug
events
Weinre
Debug Target Client
Server
{"args":["alert("hello")","console",true,"442489609::27"...

15. Target evaluates and
sends response
Weinre
Debug Target Client
Server
{"interface":"WeinreTargetCommands","method":"sendCli
entCallback".....

16. WebKit Inspector
updated with response
Weinre
Debug Target Client
Server

17. Running a server
locally? Ugh :(

18. debug.phonegap.com

19. What are the other
alternatives?

20. JS Console

21. WebKit Remote Debug
Text
Text
Chromium --remote-debugging-port=9222

22. Summary

23. Summary
• Weinre is a great solution for mobile
environments...

24. Summary
• Weinre is a great solution for mobile
environments...
• ...but hopefully a temporary one!

25. Summary
• Weinre is a great solution for mobile
environments...
• ...but hopefully a temporary one!
• Not finished, follow the progress on Github

26. Thank you &
Questions?