Remotely debug a mobile web app

jsconsole.com is a simple JavaScript command line tool. However, it also provides the ability to bridge across to other browser windows to remotely control and debug that window - be it in another browser or another device altogether.

In fact, mobile web app debugging is so damn tricky, that I gave up, and decided to build this very tool instead. See the videos examples if you'd rather see this in action now.

Creating a session

To create a new session, in the jsconsole prompt, simply run:

:listen

This will yield a unique key along the lines of FAE031CD-74A0-46D3-AE36-757BAB262BEA. Now using this unique key, include a <script> in the body element (not in the head) of your web app that you wish to debug:

<script src="http://jsconsole.com/remote.js?FAE031CD-74A0-46D3-AE36-757BAB262BEA" ></script>

Now any calls to console.log from your web app will display the result in the jsconsole session that is listening to your key. Equally, if you run a command in the jsconsole session, the code will injected in to your web app and the result returned to jsconsole.

In addition to generating a new code with :listen, you can also ask jsconsole to listen to a predefined code (but for your own security, try to chose something unique that only you know):

:listen FAE031CD-74A0-46D3-AE36-757BAB262BEA

Now I can use the same remote key in my web app to avoid having to regenerate a new code each time. Note that only the last remote client (i.e. your web app) to connect to jsconsole will recieve remote debug calls - previous windows will be ignored.

Read more: jsconsole.com

Posted via email from Jasper-net