Web Inspector should highlight when clicking a node's closing tag

• Component: Web Inspector (Deprecated)
• Status: RESOLVED FIXED

[Matt Lilek]

Right now, in the web inspector, if you click an element's closing tag in the tree list, nothing happens. We should at least select or point to the opening tag for it, but it would be awesome if we did some kind of spiffy highlighting or something - maybe like XCode 3 does? http://developer.apple.com/documentation/DeveloperTools/Conceptual/XcodeUserGuide/Contents/Resources/en.lproj/art/code_focus.jpg

[Timothy Hatcher]

I think jumping to the open tag would be good. We would need to not do this when arrowing through the tree.

[Adam Roben (:aroben)]

<rdar://problem/5712871>

[Eric Fields]

Bump.

This specifically references Inspect > Elements.

To reiterate, clicking on a closing tag should have the exact same behavior to clicking on the opening tag: highlight, get all applied CSS styles, DOM path…

[Alexander Pavlov (apavlov)]

Created attachment 51430 [details]
[PATCH] Proposed solution

The closing tag itself is selected when clicked/keyboard-traversed.

[Alexander Pavlov (apavlov)]

Created attachment 51524 [details]
[PATCH] Merged conflicting changes

[Alexander Pavlov (apavlov)]

Created attachment 51630 [details]
[PATCH] Fixed test failure

[Pavel Feldman]

Comment on attachment 51630 [details]
[PATCH] Fixed test failure

As we agreed verbally, let us remove the singleOrPairedTreeElements method. It would simplify code a lot, while the only thing we would lose is highlighting closing tag as a part of search results.

[Alexander Pavlov (apavlov)]

Created attachment 51740 [details]
[PATCH] Removed an odd method

[Pavel Feldman]

Comment on attachment 51740 [details]
[PATCH] Removed an odd method

> +WebInspector.ElementsTreeElement = function(node, elementCloseTag)

Please merge it carefully with Joe's changes.


>  {
> -    var hasChildrenOverride = node.hasChildNodes() && !this._showInlineText(node);
> +    this.elementCloseTag = elementCloseTag;

Private?

> -        if (this._expandedChildrenLimit === x)
> +        if (this._expandedChildrenLimit === x || this.elementCloseTag)

Why this change?

[Alexander Pavlov (apavlov)]

Code merged, comments addressed.

Committing to http://svn.webkit.org/repository/webkit/trunk ...
        M       LayoutTests/ChangeLog
        M       LayoutTests/inspector/elements-panel-limited-children.html
        M       WebCore/ChangeLog
        M       WebCore/inspector/front-end/ElementsTreeOutline.js
Committed r56727