Website debugging in Firefox and Safari

7 Oct 2008

Although for day-to-day browsing I use Apple’s Safari, for web site development I use Firefox, as the excellent Firebug plugin makes it a no brainer. Firebug lets you inspect and edit a web page’s DOM tree, gives you a Javascript console, and shows you page element download times and status messages in a nice GUI.

Today I managed to write some Javascript that broke in Safari, but worked in Firefox, so needed something other than Firebug, and I was pleased to find that Safari has quite a bit of built in developer support. There is a developer view that shows you similar things to a lot of what Firebug will give you (though it’s not quite as extensive and easy to use as Firebug), and the Apple have also made some nice debugging Javascripts to add to your Safari toolbar to help working out what the page layout is made up of. And it looks like it’s set to get even better support over time (ta to Garry for the link to that).

Incase you’re wondering what the bug was, Firefox’s Javascript engine will let you have Javascript keywords as the element names in objects, and Safari won’t.

Now I just need to brave IE compatibility…