Comments on: WebKit Inspector wish list http://lensco.be/2010/04/15/webkit-inspector-wish-list/ Thoughts on web design and all that jazz Mon, 03 Oct 2011 19:35:18 +0000 hourly 1 http://wordpress.org/?v=3.2.1 By: Brian Grinstead » Blog Archive » Chrome Developer Tools Colorpicker Concept http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-388 Brian Grinstead » Blog Archive » Chrome Developer Tools Colorpicker Concept Mon, 03 Oct 2011 19:35:18 +0000 http://lensco.be/?p=339#comment-388 [...] I always thought it would be awesome to have a colorpicker in browser developer tools. Who wants to guess at hex colors or open up a separate program just to get a color code? Apparently I’m not the only one who thinks a colorpicker inside the developer toolbar would be nice. [...] [...] I always thought it would be awesome to have a colorpicker in browser developer tools. Who wants to guess at hex colors or open up a separate program just to get a color code? Apparently I’m not the only one who thinks a colorpicker inside the developer toolbar would be nice. [...]

]]> By: Mathias Bynens http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-340 Mathias Bynens Sun, 12 Sep 2010 12:01:39 +0000 http://lensco.be/?p=339#comment-340 Something I’d like to add to the wish list: Firebug’s console output is much better than the Web Inspector’s. There’s a bug for that here: <a href="https://bugs.webkit.org/show_bug.cgi?id=44766" rel="nofollow">Web Inspector: color-code property values in object notation</a>. Something I’d like to add to the wish list: Firebug’s console output is much better than the Web Inspector’s. There’s a bug for that here: Web Inspector: color-code property values in object notation.

]]> By: Bram http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-307 Bram Sat, 17 Apr 2010 12:25:13 +0000 http://lensco.be/?p=339#comment-307 @pfeldman Awesome, that looks much more friendly to my eyes. Interface elements being in the way of the actual content have stopped me from using the webkit inspector up till today - and I want to bail out of firefox so badly right now. About displaying the browser style sheet or not: when we develop our css files (outside the browser) this is something we have to override by creating new styles. If you want to enable plain text editing of styles in the future, wouldn't it make sense to display the browser stylesheet seperately as well? We have to develop independant of the browser anyway. @pfeldman Awesome, that looks much more friendly to my eyes. Interface elements being in the way of the actual content have stopped me from using the webkit inspector up till today – and I want to bail out of firefox so badly right now.

About displaying the browser style sheet or not: when we develop our css files (outside the browser) this is something we have to override by creating new styles. If you want to enable plain text editing of styles in the future, wouldn’t it make sense to display the browser stylesheet seperately as well? We have to develop independant of the browser anyway.

]]> By: Jose http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-305 Jose Fri, 16 Apr 2010 20:26:19 +0000 http://lensco.be/?p=339#comment-305 "What Firebug doesn’t have either, but which I’d deem very useful, is an integrated color picker. Both for sampling colors on the web page, and for selecting colors for properties." You might want to try Firepicker, a simple color picker plugin for Firebug. It does that job so nicely I can't believe it took me so long to discover (just about a month ago) Best part is, after discovering Firepicker and realizing that there are now plugins for Firebug, I went on the search. There are a couple more than those I listed below, but they weren't something I needed. - FireDiff (track changes in Firebug) - FireQuery (jQuery enhancements for Firebug) “What Firebug doesn’t have either, but which I’d deem very useful, is an integrated color picker. Both for sampling colors on the web page, and for selecting colors for properties.”

You might want to try Firepicker, a simple color picker plugin for Firebug. It does that job so nicely I can’t believe it took me so long to discover (just about a month ago)

Best part is, after discovering Firepicker and realizing that there are now plugins for Firebug, I went on the search. There are a couple more than those I listed below, but they weren’t something I needed.

– FireDiff (track changes in Firebug)
– FireQuery (jQuery enhancements for Firebug)

]]> By: pfeldman http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-304 pfeldman Fri, 16 Apr 2010 18:59:03 +0000 http://lensco.be/?p=339#comment-304 Thanks for putting this together. I think we can address most items if not all. - I have a patch that reduces clutter: https://bug-36747-attachments.webkit.org/attachment.cgi?id=51948. Tell me if you like it. - Showing subset of inherited styles is a tough one. We'd like to move to editing CSS as text at some point. And it is great when the snippet being edited matches the source code. We need to think on how to solve this. - Autocompletion - let's just do it - Adding CSS Properties - see Joe's comments above - Highlight color - same as autocompletion. Let's just fix - Disable/enable to the left is tough due to expandable shorthands - We should just take color picker from closure of something. Thanks for putting this together. I think we can address most items if not all.

- I have a patch that reduces clutter: https://bug-36747-attachments.webkit.org/attachment.cgi?id=51948. Tell me if you like it.
- Showing subset of inherited styles is a tough one. We’d like to move to editing CSS as text at some point. And it is great when the snippet being edited matches the source code. We need to think on how to solve this.
- Autocompletion – let’s just do it
- Adding CSS Properties – see Joe’s comments above
- Highlight color – same as autocompletion. Let’s just fix
- Disable/enable to the left is tough due to expandable shorthands
- We should just take color picker from closure of something.

]]> By: Bart http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-303 Bart Fri, 16 Apr 2010 18:29:03 +0000 http://lensco.be/?p=339#comment-303 I don't think WebKit will ever feel right to me until they fix the margin/padding coloring. Having it be all blue with borders around margin and padding just feels too confusing (is the border part of the border or the margin or the padding??). I don’t think WebKit will ever feel right to me until they fix the margin/padding coloring. Having it be all blue with borders around margin and padding just feels too confusing (is the border part of the border or the margin or the padding??).

]]> By: nate beaty http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-302 nate beaty Fri, 16 Apr 2010 17:07:30 +0000 http://lensco.be/?p=339#comment-302 Agree with all your points, especially how Firebug shows just the relevant styles by default, and also the handy color differences for margin/padding. This is probably 80% of what I use Firebug for, and it's unbelievably useful for quickly developing/debugging CSS. If all I ever had was WebKit inspector I'd probably be happy, but I've been spoiled by Firebug. I also find myself looking for a color picker often. It's one of the many things I love about TextMate, cmd-shift-c brings up the color in the picker, tweak it a bit and hit OK and it updates the CSS. Deluxe. Agree with all your points, especially how Firebug shows just the relevant styles by default, and also the handy color differences for margin/padding. This is probably 80% of what I use Firebug for, and it’s unbelievably useful for quickly developing/debugging CSS.

If all I ever had was WebKit inspector I’d probably be happy, but I’ve been spoiled by Firebug.

I also find myself looking for a color picker often. It’s one of the many things I love about TextMate, cmd-shift-c brings up the color in the picker, tweak it a bit and hit OK and it updates the CSS. Deluxe.

]]> By: Patrick Mueller http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-301 Patrick Mueller Fri, 16 Apr 2010 16:10:08 +0000 http://lensco.be/?p=339#comment-301 Even if you can't help out with the implementation of your wish-list items, you can help out by opening bugs for each of your wish-list items. To open a new bug against Web Inspector specifically, it's useful to use this link: http://webkit.org/new-inspector-bug Going through that link redirects you into Bugzilla with a bunch of stuff pre-filled for Web Inspector. Looking forward to seeing your bugs! Even if you can’t help out with the implementation of your wish-list items, you can help out by opening bugs for each of your wish-list items. To open a new bug against Web Inspector specifically, it’s useful to use this link:

http://webkit.org/new-inspector-bug

Going through that link redirects you into Bugzilla with a bunch of stuff pre-filled for Web Inspector.

Looking forward to seeing your bugs!

]]> By: Joseph Pecoraro http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-300 Joseph Pecoraro Fri, 16 Apr 2010 16:09:51 +0000 http://lensco.be/?p=339#comment-300 Inherited Styles - people seem to complain if we do have them and if we don't have them. Who knows what the best answer is! Autocompletion - is an open bug actively being worked on by a new contributor: https://bugs.webkit.org/show_bug.cgi?id=17374 Adding CSS Properties - Try pushing the Tab key. Try single click and pause. Try double clicking the white-space. Try editing the style attribute on the element. It works. We will need to improve discoverability in this area but for the most part the capability is there. Inherited Styles – people seem to complain if we do have them and if we don’t have them. Who knows what the best answer is!

Autocompletion – is an open bug actively being worked on by a new contributor:
https://bugs.webkit.org/show_bug.cgi?id=17374

Adding CSS Properties – Try pushing the Tab key. Try single click and pause. Try double clicking the white-space. Try editing the style attribute on the element. It works. We will need to improve discoverability in this area but for the most part the capability is there.

]]> By: junkiesxl http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-299 junkiesxl Thu, 15 Apr 2010 21:50:01 +0000 http://lensco.be/?p=339#comment-299 Don't agree completely, however you did point out a deal breaker I wasn't aware of: Not being able to add a CSS-style with a doubleclick seems strange (I always thought they added it, but the only way you can do it is to use the Gear menu and add a style, but that's not that clean a solution) . Thanks ! Don’t agree completely, however you did point out a deal breaker I wasn’t aware of:
Not being able to add a CSS-style with a doubleclick seems strange (I always thought they added it, but the only way you can do it is to use the Gear menu and add a style, but that’s not that clean a solution) .

Thanks !

]]> By: idleberg http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-297 idleberg Thu, 15 Apr 2010 21:05:55 +0000 http://lensco.be/?p=339#comment-297 i agree, the main reason i prefer firebug is the double-clicking to edit. what i dislike in firebug: it sometimes acts random. sometimes the console doesn't open or it lags, sometimes it's jumping between its tabs. btw, i have read that you'd be looking forward to switch entirely to safari. have you thought about chrome? there is firebug for chrome! i agree, the main reason i prefer firebug is the double-clicking to edit. what i dislike in firebug: it sometimes acts random. sometimes the console doesn’t open or it lags, sometimes it’s jumping between its tabs.

btw, i have read that you’d be looking forward to switch entirely to safari. have you thought about chrome? there is firebug for chrome!

]]>