DevTools Future Planning

This is a document based on mockups created by Paul Rouget. Notes taken to synthesize bugs from features and hopefully, features from bugs.

Possible Visual Design

Here is a possible aesthetic for the interface by Faaborg: [1]

create toolbar for developer tools
migrate command line to developer tools toolbar
- Some interesting challenges with this, will possibly need additional bugs around popping up doorhangers for output, including output in the commandline itself, what happens with positioning the console in other locations, etc.
create API for registering tools with main developer toolbar
create API for adding badges to toolbar buttons
create "Web Developer" toolbar button
- popup menu that derives its contents from the Web Developer menu

(codeword minotaur on bugzilla)

Inspector Toolbar bug 666650
Dockable* HTML panel bug 650794 bug 672002
Dockable* Style inspectors bug not sure we need this for a first release
Style Inspector redesign bug 672005
Style Inspector linked to CSS Editor bug 585563
create highlighter infobar for selected node bug 663833
Expand/collapse HTML+Style panels. bug 672002
Create breadcrumb nodepath selection tool bug 672006
togglable classes bug 672003
CSS Editor bug 583041
Layout Information bug 663778
- highlight parent element
- Layout info in the inspector toolbar
- Layout box in the highlighter (margins, borders and paddings)
Annotations
- Inspector toolbar button
- Doorhanger style editor for entering code to evaluate
- Highlighter display of annotations on selected node
multiple highlighting
querySelector search box
Highlighter background controls
- Grids
- Light
- Dark
- Checkerboard