Comments on: Review of Safari 4’s Fresh Developer Tools

By: » Firefox 3.5 for Mac OS X

» Firefox 3.5 for Mac OS X — Wed, 08 Jul 2009 00:00:51 +0000

[…] first thing I noticed was speed. Since Safari 4 beta I’d been using that for its speed. But Safari’s developer tools, while much improved over 3.x, aren’t quite as good, and the extensibility isn’t in the […]

By: Santiago Perez

Santiago Perez — Mon, 15 Jun 2009 16:59:53 +0000

Actually, I’ve found a way to add new CSS rules, all you need to do is edit an existing one, and add a semicolon at the end and then add the new rule.

For instance, if you have
color: “white”
and change it to
color: “white”; background: “black”

once you unfocus a new line is added with that property set

By: Alexander Ljungberg

Alexander Ljungberg — Fri, 12 Jun 2009 14:50:51 +0000

Great catch about adding CSS rules. Thanks.

By: Andrew Jones

Andrew Jones — Fri, 12 Jun 2009 13:31:44 +0000

Okay, so there IS a way to add css. Double-click on the attribute, then add your new css after the semi-colon.

Still, no line numbering as far as I can tell.

By: Andrew Jones

Andrew Jones — Fri, 12 Jun 2009 13:28:13 +0000

I really wanted to be able to switch to Safari 4 from FF3, but the inability to add new css via the inspector is a total deal-breaker. I absolutely have to have that functionality.

Also, what’s up with the inspector not showing line numbers in the css?

By: Flat Iron

Flat Iron — Wed, 10 Jun 2009 18:23:09 +0000

Safari 4 is very helpful. I have been using Golive, this seems quite handy.

By: Alexander Ljungberg

Alexander Ljungberg — Wed, 10 Jun 2009 15:05:32 +0000

Yes, it does seem difficult to add new CSS rules. I tried what I usually do in FireBug which is to double click underneath an existing rule but no luck. My workaround so far has been to edit the HTML of the element instead and add a style=”…” attribute. This works so-so – sometimes when double clicking an element to edit it’s HTML I get a blank inspector view.

Regarding inspection of AJAX interaction and POST content, I hadn’t thought to look yet but you’re right. They don’t seem to be there. I have updated the post noting that. That’s a fairly serious shortcoming. Let me know if you find a workaround!

By: Vincent

Vincent — Wed, 10 Jun 2009 10:00:29 +0000

Nice review. I discovered Safari’s inspector recently and I was surprised to see how rich it is.

I usualy develop on Firefox using FireBug, and there is still 2 things missing on safari:
– you can not add css selectors and css properties in safari’s inspector, you can just modify existing ones.
– you can not see Post and Get parameters sent to outgoing request which is very very usefull for ajax debuging.

Those 2 things are really missing in Safari 4 … I don’t understand why they did not put those features in their so nice inspector. For me they are part of the things I need and use 100 times a day.

I’d really love to switch to Safari cause it’s so nice and fast :/
Did you find a solution about those 2 missing features ?