Title: [211608] trunk/Source/WebInspectorUI
Revision
211608
Author
commit-qu...@webkit.org
Date
2017-02-02 16:22:49 -0800 (Thu, 02 Feb 2017)

Log Message

Web Inspector: can't jump from Search Tab result to see resource in other tabs (Resource, Debugger, Network)
https://bugs.webkit.org/show_bug.cgi?id=167072

Patch by Devin Rousso <dcrousso+web...@gmail.com> on 2017-02-02
Reviewed by Timothy Hatcher.

* UserInterface/Base/Main.js:
(WebInspector.tabContentViewForRepresentedObject):
(WebInspector.showRepresentedObject):
(WebInspector.showMainFrameDOMTree):
(WebInspector.showSourceCodeForFrame):
(WebInspector.showSourceCode):
(WebInspector.showSourceCodeLocation):
(WebInspector.showOriginalUnformattedSourceCodeLocation):
(WebInspector.showOriginalOrFormattedSourceCodeLocation):
(WebInspector.showOriginalOrFormattedSourceCodeTextRange):
(WebInspector.showResourceRequest):
Rework parameters to add optional `options` dictionary that can be used to indicate
additional functionality.

* UserInterface/Views/TabBrowser.js:
(WebInspector.TabBrowser.prototype.bestTabContentViewForRepresentedObject):
Ignore instances of SearchTabContentView as it can display content views for all types of
searchable data.  Determined by a newly added optional `options` parameter.

* UserInterface/Base/Utilities.js:
(Object.shallowMerge):
Merges the keys of two objects into a new one.

* UserInterface/Views/ComputedStyleDetailsPanel.js:
(WebInspector.ComputedStyleDetailsPanel.prototype._goToRegionFlowArrowWasClicked):
(WebInspector.ComputedStyleDetailsPanel.prototype._goToContentFlowArrowWasClicked):

* UserInterface/Views/SearchSidebarPanel.js:
(WebInspector.SearchSidebarPanel.prototype.performSearch.createTreeElementForMatchObject):
(WebInspector.SearchSidebarPanel.prototype.performSearch.resourceCallback):
(WebInspector.SearchSidebarPanel.prototype.performSearch.resourcesCallback):
(WebInspector.SearchSidebarPanel.prototype.performSearch.searchScripts.scriptCallback):
(WebInspector.SearchSidebarPanel.prototype.performSearch.searchScripts):
(WebInspector.SearchSidebarPanel.prototype.performSearch.domSearchResults):
(WebInspector.SearchSidebarPanel.prototype.performSearch.domCallback):
(WebInspector.SearchSidebarPanel.prototype.performSearch):
(WebInspector.SearchSidebarPanel.prototype._treeElementDoubleClick):
* UserInterface/Views/TreeElement.js:
(WebInspector.TreeElement.treeElementDoubleClicked):
Add an event dispatch whenever a TreeElement is double clicked via the `dblclick` event.

Modified Paths

Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (211607 => 211608)


--- trunk/Source/WebInspectorUI/ChangeLog	2017-02-03 00:15:18 UTC (rev 211607)
+++ trunk/Source/WebInspectorUI/ChangeLog	2017-02-03 00:22:49 UTC (rev 211608)
@@ -1,3 +1,51 @@
+2017-02-02  Devin Rousso  <dcrousso+web...@gmail.com>
+
+        Web Inspector: can't jump from Search Tab result to see resource in other tabs (Resource, Debugger, Network)
+        https://bugs.webkit.org/show_bug.cgi?id=167072
+
+        Reviewed by Timothy Hatcher.
+
+        * UserInterface/Base/Main.js:
+        (WebInspector.tabContentViewForRepresentedObject):
+        (WebInspector.showRepresentedObject):
+        (WebInspector.showMainFrameDOMTree):
+        (WebInspector.showSourceCodeForFrame):
+        (WebInspector.showSourceCode):
+        (WebInspector.showSourceCodeLocation):
+        (WebInspector.showOriginalUnformattedSourceCodeLocation):
+        (WebInspector.showOriginalOrFormattedSourceCodeLocation):
+        (WebInspector.showOriginalOrFormattedSourceCodeTextRange):
+        (WebInspector.showResourceRequest):
+        Rework parameters to add optional `options` dictionary that can be used to indicate
+        additional functionality.
+
+        * UserInterface/Views/TabBrowser.js:
+        (WebInspector.TabBrowser.prototype.bestTabContentViewForRepresentedObject):
+        Ignore instances of SearchTabContentView as it can display content views for all types of
+        searchable data.  Determined by a newly added optional `options` parameter.
+
+        * UserInterface/Base/Utilities.js:
+        (Object.shallowMerge):
+        Merges the keys of two objects into a new one.
+
+        * UserInterface/Views/ComputedStyleDetailsPanel.js:
+        (WebInspector.ComputedStyleDetailsPanel.prototype._goToRegionFlowArrowWasClicked):
+        (WebInspector.ComputedStyleDetailsPanel.prototype._goToContentFlowArrowWasClicked):
+
+        * UserInterface/Views/SearchSidebarPanel.js:
+        (WebInspector.SearchSidebarPanel.prototype.performSearch.createTreeElementForMatchObject):
+        (WebInspector.SearchSidebarPanel.prototype.performSearch.resourceCallback):
+        (WebInspector.SearchSidebarPanel.prototype.performSearch.resourcesCallback):
+        (WebInspector.SearchSidebarPanel.prototype.performSearch.searchScripts.scriptCallback):
+        (WebInspector.SearchSidebarPanel.prototype.performSearch.searchScripts):
+        (WebInspector.SearchSidebarPanel.prototype.performSearch.domSearchResults):
+        (WebInspector.SearchSidebarPanel.prototype.performSearch.domCallback):
+        (WebInspector.SearchSidebarPanel.prototype.performSearch):
+        (WebInspector.SearchSidebarPanel.prototype._treeElementDoubleClick):
+        * UserInterface/Views/TreeElement.js:
+        (WebInspector.TreeElement.treeElementDoubleClicked):
+        Add an event dispatch whenever a TreeElement is double clicked via the `dblclick` event.
+
 2017-02-01  Yusuke Suzuki  <utatane....@gmail.com>
 
         Web Inspector: Upgrade Esprima to the latest one to support dynamic import

Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Main.js (211607 => 211608)


--- trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2017-02-03 00:15:18 UTC (rev 211607)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2017-02-03 00:22:49 UTC (rev 211608)
@@ -1133,9 +1133,9 @@
     return null;
 };
 
-WebInspector.tabContentViewForRepresentedObject = function(representedObject)
+WebInspector.tabContentViewForRepresentedObject = function(representedObject, options = {})
 {
-    var tabContentView = this.tabBrowser.bestTabContentViewForRepresentedObject(representedObject);
+    let tabContentView = this.tabBrowser.bestTabContentViewForRepresentedObject(representedObject, options);
     if (tabContentView)
         return tabContentView;
 
@@ -1152,9 +1152,9 @@
     return tabContentView;
 };
 
-WebInspector.showRepresentedObject = function(representedObject, cookie)
+WebInspector.showRepresentedObject = function(representedObject, cookie, options = {})
 {
-    var tabContentView = this.tabContentViewForRepresentedObject(representedObject);
+    let tabContentView = this.tabContentViewForRepresentedObject(representedObject, options);
     console.assert(tabContentView);
     if (!tabContentView)
         return;
@@ -1163,21 +1163,16 @@
     tabContentView.showRepresentedObject(representedObject, cookie);
 };
 
-WebInspector.showMainFrameDOMTree = function(nodeToSelect)
+WebInspector.showMainFrameDOMTree = function(nodeToSelect, options = {})
 {
     console.assert(WebInspector.frameResourceManager.mainFrame);
     if (!WebInspector.frameResourceManager.mainFrame)
         return;
-    this.showRepresentedObject(WebInspector.frameResourceManager.mainFrame.domTree, {nodeToSelect});
+    this.showRepresentedObject(WebInspector.frameResourceManager.mainFrame.domTree, {nodeToSelect}, options);
 };
 
-WebInspector.showContentFlowDOMTree = function(contentFlow, nodeToSelect)
+WebInspector.showSourceCodeForFrame = function(frameIdentifier, options = {})
 {
-    this.showRepresentedObject(contentFlow, {nodeToSelect});
-};
-
-WebInspector.showSourceCodeForFrame = function(frameIdentifier)
-{
     var frame = WebInspector.frameResourceManager.frameForIdentifier(frameIdentifier);
     if (!frame) {
         this._frameIdentifierToShowSourceCodeWhenAvailable = frameIdentifier;
@@ -1186,11 +1181,13 @@
 
     this._frameIdentifierToShowSourceCodeWhenAvailable = undefined;
 
-    this.showRepresentedObject(frame);
+    this.showRepresentedObject(frame, null, options);
 };
 
-WebInspector.showSourceCode = function(sourceCode, positionToReveal, textRangeToSelect, forceUnformatted)
+WebInspector.showSourceCode = function(sourceCode, options = {})
 {
+    const positionToReveal = options.positionToReveal;
+
     console.assert(!positionToReveal || positionToReveal instanceof WebInspector.SourceCodePosition, positionToReveal);
     var representedObject = sourceCode;
 
@@ -1200,33 +1197,43 @@
     }
 
     var cookie = positionToReveal ? {lineNumber: positionToReveal.lineNumber, columnNumber: positionToReveal.columnNumber} : {};
-    this.showRepresentedObject(representedObject, cookie);
+    this.showRepresentedObject(representedObject, cookie, options);
 };
 
-WebInspector.showSourceCodeLocation = function(sourceCodeLocation)
+WebInspector.showSourceCodeLocation = function(sourceCodeLocation, options = {})
 {
-    this.showSourceCode(sourceCodeLocation.displaySourceCode, sourceCodeLocation.displayPosition());
+    this.showSourceCode(sourceCodeLocation.displaySourceCode, Object.shallowMerge(options, {
+        positionToReveal: sourceCodeLocation.displayPosition()
+    }));
 };
 
-WebInspector.showOriginalUnformattedSourceCodeLocation = function(sourceCodeLocation)
+WebInspector.showOriginalUnformattedSourceCodeLocation = function(sourceCodeLocation, options = {})
 {
-    this.showSourceCode(sourceCodeLocation.sourceCode, sourceCodeLocation.position(), null, true);
+    this.showSourceCode(sourceCodeLocation.sourceCode, Object.shallowMerge(options, {
+        positionToReveal: sourceCodeLocation.position(),
+        forceUnformatted: true
+    }));
 };
 
-WebInspector.showOriginalOrFormattedSourceCodeLocation = function(sourceCodeLocation)
+WebInspector.showOriginalOrFormattedSourceCodeLocation = function(sourceCodeLocation, options = {})
 {
-    this.showSourceCode(sourceCodeLocation.sourceCode, sourceCodeLocation.formattedPosition());
+    this.showSourceCode(sourceCodeLocation.sourceCode, Object.shallowMerge(options, {
+        positionToReveal: sourceCodeLocation.formattedPosition()
+    }));
 };
 
-WebInspector.showOriginalOrFormattedSourceCodeTextRange = function(sourceCodeTextRange)
+WebInspector.showOriginalOrFormattedSourceCodeTextRange = function(sourceCodeTextRange, options = {})
 {
     var textRangeToSelect = sourceCodeTextRange.formattedTextRange;
-    this.showSourceCode(sourceCodeTextRange.sourceCode, textRangeToSelect.startPosition(), textRangeToSelect);
+    this.showSourceCode(sourceCodeTextRange.sourceCode, Object.shallowMerge(options, {
+        positionToReveal: textRangeToSelect.startPosition(),
+        textRangeToSelect
+    }));
 };
 
-WebInspector.showResourceRequest = function(resource)
+WebInspector.showResourceRequest = function(resource, options = {})
 {
-    this.showRepresentedObject(resource, {[WebInspector.ResourceClusterContentView.ContentViewIdentifierCookieKey]: WebInspector.ResourceClusterContentView.RequestIdentifier});
+    this.showRepresentedObject(resource, {[WebInspector.ResourceClusterContentView.ContentViewIdentifierCookieKey]: WebInspector.ResourceClusterContentView.RequestIdentifier}, options);
 };
 
 WebInspector.debuggerToggleBreakpoints = function(event)

Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js (211607 => 211608)


--- trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js	2017-02-03 00:15:18 UTC (rev 211607)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js	2017-02-03 00:22:49 UTC (rev 211608)
@@ -85,6 +85,20 @@
     }
 });
 
+Object.defineProperty(Object, "shallowMerge",
+{
+    value(a, b)
+    {
+        let result = Object.shallowCopy(a);
+        let keys = Object.keys(b);
+        for (let i = 0; i < keys.length; ++i) {
+            console.assert(!result.hasOwnProperty(keys[i]) || result[keys[i]] === b[keys[i]], keys[i]);
+            result[keys[i]] = b[keys[i]];
+        }
+        return result;
+    }
+});
+
 Object.defineProperty(Object.prototype, "valueForCaseInsensitiveKey",
 {
     value: function(key)

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleDetailsPanel.js (211607 => 211608)


--- trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleDetailsPanel.js	2017-02-03 00:15:18 UTC (rev 211607)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleDetailsPanel.js	2017-02-03 00:22:49 UTC (rev 211608)
@@ -278,12 +278,12 @@
 
     _goToRegionFlowArrowWasClicked()
     {
-        WebInspector.showContentFlowDOMTree(this._regionFlow);
+        WebInspector.showRepresentedObject(this._regionFlow);
     }
 
     _goToContentFlowArrowWasClicked()
     {
-        WebInspector.showContentFlowDOMTree(this._contentFlow, this.nodeStyles.node);
+        WebInspector.showRepresentedObject(this._contentFlow, {nodeToSelect: this.nodeStyles.node});
     }
 };
 

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.js (211607 => 211608)


--- trunk/Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.js	2017-02-03 00:15:18 UTC (rev 211607)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SearchSidebarPanel.js	2017-02-03 00:22:49 UTC (rev 211608)
@@ -95,6 +95,17 @@
 
         var updateEmptyContentPlaceholderTimeout = null;
 
+        function createTreeElementForMatchObject(matchObject, parentTreeElement)
+        {
+            let matchTreeElement = new WebInspector.SearchResultTreeElement(matchObject);
+            matchTreeElement.addEventListener(WebInspector.TreeElement.Event.DoubleClick, this._treeElementDoubleClick, this);
+
+            parentTreeElement.appendChild(matchTreeElement);
+
+            if (!this.contentTreeOutline.selectedTreeElement)
+                matchTreeElement.revealAndSelect(false, true);
+        }
+
         function updateEmptyContentPlaceholderSoon()
         {
             if (updateEmptyContentPlaceholderTimeout)
@@ -146,13 +157,10 @@
 
                 for (var i = 0; i < resourceMatches.length; ++i) {
                     var match = resourceMatches[i];
-                    forEachMatch(searchQuery, match.lineContent, function(lineMatch, lastIndex) {
+                    forEachMatch(searchQuery, match.lineContent, (lineMatch, lastIndex) => {
                         var matchObject = new WebInspector.SourceCodeSearchMatchObject(resource, match.lineContent, searchQuery, new WebInspector.TextRange(match.lineNumber, lineMatch.index, match.lineNumber, lastIndex));
-                        var matchTreeElement = new WebInspector.SearchResultTreeElement(matchObject);
-                        resourceTreeElement.appendChild(matchTreeElement);
-                        if (!this.contentTreeOutline.selectedTreeElement)
-                            matchTreeElement.revealAndSelect(false, true);
-                    }.bind(this));
+                        createTreeElementForMatchObject.call(this, matchObject, resourceTreeElement);
+                    });
                 }
 
                 updateEmptyContentPlaceholder.call(this);
@@ -186,13 +194,10 @@
 
                 for (var i = 0; i < scriptMatches.length; ++i) {
                     var match = scriptMatches[i];
-                    forEachMatch(searchQuery, match.lineContent, function(lineMatch, lastIndex) {
+                    forEachMatch(searchQuery, match.lineContent, (lineMatch, lastIndex) => {
                         var matchObject = new WebInspector.SourceCodeSearchMatchObject(script, match.lineContent, searchQuery, new WebInspector.TextRange(match.lineNumber, lineMatch.index, match.lineNumber, lastIndex));
-                        var matchTreeElement = new WebInspector.SearchResultTreeElement(matchObject);
-                        scriptTreeElement.appendChild(matchTreeElement);
-                        if (!this.contentTreeOutline.selectedTreeElement)
-                            matchTreeElement.revealAndSelect(false, true);
-                    }.bind(this));
+                        createTreeElementForMatchObject.call(this, matchObject, scriptTreeElement);
+                    });
                 }
 
                 updateEmptyContentPlaceholder.call(this);
@@ -243,22 +248,16 @@
 
                     // Textual matches.
                     var didFindTextualMatch = false;
-                    forEachMatch(searchQuery, domNodeTitle, function(lineMatch, lastIndex) {
+                    forEachMatch(searchQuery, domNodeTitle, (lineMatch, lastIndex) => {
                         var matchObject = new WebInspector.DOMSearchMatchObject(resource, domNode, domNodeTitle, searchQuery, new WebInspector.TextRange(0, lineMatch.index, 0, lastIndex));
-                        var matchTreeElement = new WebInspector.SearchResultTreeElement(matchObject);
-                        resourceTreeElement.appendChild(matchTreeElement);
-                        if (!this.contentTreeOutline.selectedTreeElement)
-                            matchTreeElement.revealAndSelect(false, true);
+                        createTreeElementForMatchObject.call(this, matchObject, resourceTreeElement);
                         didFindTextualMatch = true;
-                    }.bind(this));
+                    });
 
                     // Non-textual matches are CSS Selector or XPath matches. In such cases, display the node entirely highlighted.
                     if (!didFindTextualMatch) {
                         var matchObject = new WebInspector.DOMSearchMatchObject(resource, domNode, domNodeTitle, domNodeTitle, new WebInspector.TextRange(0, 0, 0, domNodeTitle.length));
-                        var matchTreeElement = new WebInspector.SearchResultTreeElement(matchObject);
-                        resourceTreeElement.appendChild(matchTreeElement);
-                        if (!this.contentTreeOutline.selectedTreeElement)
-                            matchTreeElement.revealAndSelect(false, true);
+                        createTreeElementForMatchObject.call(this, matchObject, resourceTreeElement);
                     }
 
                     updateEmptyContentPlaceholder.call(this);
@@ -370,4 +369,17 @@
         else if (treeElement.representedObject instanceof WebInspector.SourceCodeSearchMatchObject)
             WebInspector.showOriginalOrFormattedSourceCodeTextRange(treeElement.representedObject.sourceCodeTextRange);
     }
+
+    _treeElementDoubleClick(event)
+    {
+        let treeElement = event.target;
+        if (!treeElement)
+            return;
+
+        const options = {ignoreSearchTab: true};
+        if (treeElement.representedObject instanceof WebInspector.DOMSearchMatchObject)
+            WebInspector.showMainFrameDOMTree(treeElement.representedObject.domNode, options);
+        else if (treeElement.representedObject instanceof WebInspector.SourceCodeSearchMatchObject)
+            WebInspector.showOriginalOrFormattedSourceCodeTextRange(treeElement.representedObject.sourceCodeTextRange, options);
+    }
 };

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TabBrowser.js (211607 => 211608)


--- trunk/Source/WebInspectorUI/UserInterface/Views/TabBrowser.js	2017-02-03 00:15:18 UTC (rev 211607)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TabBrowser.js	2017-02-03 00:22:49 UTC (rev 211608)
@@ -107,11 +107,14 @@
         return null;
     }
 
-    bestTabContentViewForRepresentedObject(representedObject)
+    bestTabContentViewForRepresentedObject(representedObject, options = {})
     {
         console.assert(!this.selectedTabContentView || this.selectedTabContentView === this._recentTabContentViews[0]);
 
         for (var tabContentView of this._recentTabContentViews) {
+            if (options.ignoreSearchTab && tabContentView instanceof WebInspector.SearchTabContentView)
+                continue;
+
             if (tabContentView.canShowRepresentedObject(representedObject))
                 return tabContentView;
         }

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js (211607 => 211608)


--- trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js	2017-02-03 00:15:18 UTC (rev 211607)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js	2017-02-03 00:22:49 UTC (rev 211608)
@@ -310,6 +310,9 @@
         if (element.treeElement.isEventWithinDisclosureTriangle(event))
             return;
 
+        if (element.treeElement.dispatchEventToListeners(WebInspector.TreeElement.Event.DoubleClick))
+            return;
+
         if (element.treeElement.ondblclick)
             element.treeElement.ondblclick.call(element.treeElement, event);
         else if (element.treeElement.hasChildren && !element.treeElement.expanded)
@@ -620,3 +623,7 @@
         }
     }
 };
+
+WebInspector.TreeElement.Event = {
+    DoubleClick: "tree-element-double-click",
+};
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to