iPad and iPhone HTML debugging

  • Article

With Update 1, UAG officially supports iPads and iPhones***. There might come a time when you might need to do some debugging and troubleshooting on these devices. Unfortunately, this may not be so simple, because you can’t just install NetMon or HTTPWatch on these devices. Hopefully, someday there will be apps that do this well, but until then, here are some techniques you can use to debug stuff on these platforms.

The simplest technique is based on FireBug, which is multi-platform web development and debug tool by Joe Hewitt. To install FireBug on an iPad, you can create a special bookmark that will launch the tool when you need it to. To do so, follow these steps:

1. Create a bookmark for some page on your device. You will edit the content of this bookmark later, and it will be used to launch FireBug, so you can bookmark any page you want – it doesn’t matter.

2. Rename the bookmark to “firebug”, or some other text that will remind you what it is

3. Tap on an empty area in this table cell (so as to select the code, but not run it):

javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');

4. Tab it again to invoke the content menu, and tap Copy

5. Go to your bookmarks, and tap Edit on the bottom left of the screen

6. Tap on the bookmark you created in step 1.

7. Tap the line with the URL, and tap the X to clear it

8. Tap the empty area to invoke the edit options and tap Paste to fill it with the script from above.

9. Tap bookmarks to go back (which saves your changes) and tap Done

Now, when viewing any page, you can launch your new bookmark. It won’t “go” anywhere, but rather open a frame at the bottom of the page, which allows you to see the source of the page:

image

 

For more advanced troubleshooting, it’s also possible to do full captures by configuring iPad to use another computer as a proxy, and then logging the traffic on the computer using Fiddler. Here’s an article that discussed this technique.

Happy troubleshooting!

 

*** Not all UAG features and scenarios are supported. For more information, visit System requirements for Forefront UAG client devices