Chapter 12: Testing and Debugging
268
Industrial Strength Debugging with Drosera
If you recall from Chapter 1 , Safari is built on top of the open source WebKit browser engine. Drosera is a
high - powered JavaScript debugger that is included with the WebKit nightly builds, but is not part of
Safari itself. However, if you are running Mac OS X, you can download the latest nightly build of WebKit
at
www.webkit.org
and take advantage of using Drosera. At the time of this writing, Drosera is not
available on Microsoft Windows platforms. Refer to
www.webkit.org
for the latest compatibility
information.
As you would expect from a full - fledged debugger, Drosera enables you to set breakpoints, step into/
out/over functions, and view variable state at a point of execution.
Preparing Drosera for Safari
After downloading the latest nightly WebKit build and installing it to your Applications folder, you first
need to prepare your environment. Drosera works by attaching itself to a running WebKit browser.
However, by default, it does not recognize Safari. Therefore, follow these instructions to enable it:
1.
Be sure Safari, WebKit, and Drosera are all closed.
2.
Enter the following into a terminal window:

defaults write com.apple.Safari WebKitScriptDebuggerEnabled -bool true
3.
Launch Safari and navigate to your application URL.
4.
Launch Drosera.
5.
In the Attach dialog box, select Safari from the list and click Attach.

Figure 12-8: Inspecting the current state of an element in a debugging session
Simulating Mobile Safari on Your Desktop
In addition to using the debugging tools available for Safari for Mac and Safari for Windows, you can
also simulate running Mobile Safari on your desktop. This will enable you to look at the UI as it will look
in Mobile Safari as well as test to see how a Web application or site responds when it identifies the
browser as Mobile Safari. You can either customize the desktop version of Safari or you can use a free
tool named iPhoney.
Using Safari for Mac or Windows
Because Mobile Safari is closely related to its Mac and Windows desktop counterparts, you can perform
initial testing and debugging right on your desktop. However, before doing so, you will want to turn
Safari into an iPhone simulator by performing two actions — change the user agent string and resize the
browser window.
c12.indd 271c12.indd 271 12/7/07 3:00:36 PM12/7/07 3:00:36 PM
Chapter 12: Testing and Debugging
272
Changing Safari ’ s User Agent String
Safari allows you to set the user agent provided by the browser through the Debug User Agent list. At
the time of this writing, Safari 3.0 does not display Mobile Safari on its preset user agent list. However,
you can specify a
CustomUserAgent
in Safari ’ s preferences file to provide this custom string.
To do so on a Mac, navigate to the
com.apple.Safari.plist
in your
/Users/[Username]/Library/
Preferences
folder. Double - click it to open the Properties List editor.
Next, add a new
CustomUserAgent
property in these files and give it the following value: