Debugging web applications in iOS simulator.

I love Firebug and Chrome Webtools but their functionality is limited to your desktop development. What are you going to do when you discover that your carefully crafted web application starts acting pesky on iOS? Where is the magic button that enables debugging in Safari on your ipad? The answer is simple – there is none. Don’t panic. The solution to this problem by Apple is elegant and simple. Here is the recipe:

1) Install XCode (if you haven’t installed it already). It is free and it comes with iOS Simulator that allows you to test your applications in iOS. Get it from the AppStore.
2) Enable Develop menu in Safari by checking the box in Preferences->Advanced:

3) Open iOS Simulator and start Safari on it. Open Safari on your desktop. Open your web application in Safari on the iOS Simulator.
4) Choose iOS Simulator from the Develop menu on your desktop Safari:

You can now inspect your web application, displayed in Safari on iOS in the Web Inspector of your desktop browser.

Have a nice day!