[Webkit-unassigned] [Bug 17374] Inspector should support tab completion while editing CSS

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=17374


Joseph Pecoraro <joepeck at webkit.org> changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
                 CC|                            |joepeck at webkit.org




--- Comment #2 from Joseph Pecoraro <joepeck at webkit.org>  2010-04-10 17:30:42 PST ---
I see someone is interested in working on this (on Twitter). I'm going to put
some pointers here to help them out. You don't necessarily have to follow my
advice, but just so you aren't lost in the code!

1. The list of all CSS Properties that WebKit supports can be found in ".in"
files spread throughout WebKit's source. You want a similar list in the
inspector to use for auto-completion. Some approaches are:

  - You can dynamically compute this list when the inspector launches
    (using something like getComputedStyle(document.body). This is a
    very future proof approach, so as new properties are added, they
    may automatically be available to autocompletion.

  - Use an existing computed list of all properties. There is such a
    list available in SourceCSSTokenizer.js [1]. It appears that this
    list contains some differences to the getComputedStyle approach.
    I've attached a diff of comparatively sorted lists.

  - Some combination of the above two options!

2. For the autocompletion you want to be as consistent as possible. The Console
already includes autocompletion, and the way it does it has already been
factored out to a generic class. Minor changes may be needed. See TextPrompt.js
[2] and how it is used in ConsoleView.js [3].

3. Editing style properties happens on WebInspector.StylePropertyTreeElement in
StylesSidebarPane.js [4]. It uses inspector.js' [5] generic editing. It might
be useful to add a hook for an autocompletion controller/handler in this.

4. This ahead! Autocompletion is useful all over the inspector. Style
Properties, style values, style selectors, element tag names / attributes!
Editing of all of these is currently possible, and is all done the same way
(through WebInspector.startEditing). Approach this with a solution that can be
replicated for all of the above cases.


[1]:
http://trac.webkit.org/browser/trunk/WebCore/inspector/front-end/SourceCSSTokenizer.js#L48
[2]:
http://trac.webkit.org/browser/trunk/WebCore/inspector/front-end/TextPrompt.js
[3]:
http://trac.webkit.org/browser/trunk/WebCore/inspector/front-end/ConsoleView.js#L334
[4]:
http://trac.webkit.org/browser/trunk/WebCore/inspector/front-end/StylesSidebarPane.js#L1283
[5]:
http://trac.webkit.org/browser/trunk/WebCore/inspector/front-end/inspector.js#L1816

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.