

More Web Inspector Updates - alexbosworth
http://webkit.org/blog/1091/more-web-inspector-updates/?utm_source=twitterfeed&utm_medium=twitter

======
fortybillion
I love where this is going. I now use Chrome's Dev channel or a WebKit nightly
for development, and only launch Firefox/Firebug to do compatibility testing.

Although I still have a ton of respect for Firefox's rendering engine, the
browser just feels wrong on the Mac -- not to mention it's slow launch times.
The Inspector Panel has caught up to Firebug's functionality in many areas and
is now starting to surpass it.

What kills me is launching IE in a VM and discovering how archaic its
developer tools are.

~~~
DrJokepu
I would be the last one to defend IE in general but have you had a look at the
Developer Tools of IE8? I think it's pretty decent stuff.

~~~
fortybillion
I haven't, I will test those out for sure.

IE8, of course, is the least troublesome but it's good to have options.

~~~
oomkiller
It has IE7 "Mode", so you can use the IE8 dev tools to debug IE7 issues.

~~~
fortybillion
IE7 mode seems to catch 95% of the cases, but I have had issues crop up in
"real" IE7 that were not present when tested under IE8.

------
yesimahuman
I've gotten more used to the inspector, but I absolutely hate the style
inspector. Firebug got it right with making it look like your own CSS. Also I
often times can't edit a style rule, and I'm not sure why that is.

I hope those things change and improve. It doesn't seem like they want to go
the Firebug route with the CSS style inspector.

~~~
jeff18
Could you be more specific? Is it just a font thing?

~~~
yesimahuman
For my dislike of it? No, it's that I love firebug's way of displaying your
CSS entries, and the webkit inspectors way is just less enjoyable to me. I
like that in Firebug you inspect your CSS like you would normal CSS, but in
inspector it's presented differently. It also has a lot of quirks (try
changing a color, it will bork on whitespace in a strange way).

~~~
jeff18
I see this complaint leveraged at the web inspector a lot, but I don't really
understand it. It seems like the differences are very subtle.

<http://i.imgur.com/amWMy.png> vs. <http://i.imgur.com/ysH0a.png>

(As an aside, note that FireBug doesn't know that the font color has been
overridden by the font tag.)

I'm curious what changes specifically you would make to improve it?

~~~
aboodman
The difference is that the rules are rendered using actual CSS syntax, rather
than the section heading control.

This makes it very easy to scan because as a web developer, your brain is
already trained to parse CSS syntax easily.

The controls in the webkit UI may seem richer, but they aren't actually as
efficient as the simple code view that Firebug uses.

------
stevelosh
Most infuriating thing about the Inspector in Safari: the shortcut to open the
inspector won't also close it.

~~~
some1else
Also, no shortcut for going straight into DOM selection in the page. Right-
clicking to inspect an element is a valid, but a robust approach, compared to
seeking the right element out with the looking glass.

