Changeset 259738 in webkit

Timestamp:

Apr 8, 2020, 11:53:10 AM (6 years ago)

Author:

Devin Rousso

Message:

Web Inspector: Sources: support copying selected call frame(s) in the Call Stack
​https://bugs.webkit.org/show_bug.cgi?id=210172

Reviewed by Timothy Hatcher.

• UserInterface/Views/SourcesTabContentView.js:

(WI.SourcesTabContentView.prototype.handleCopyEvent): Added.

• UserInterface/Views/SourcesNavigationSidebarPanel.js:

(WI.SourcesNavigationSidebarPanel):
(WI.SourcesNavigationSidebarPanel.prototype.handleCopyEvent): Added.
Copy the function name and source location for each selected call frame. If the selected
call frames span an async boundary, include the async boundary in the form --- <name> ---
where name is the reason for the async behavior (e.g. addEventListener). If the selected
call frames span multiple threads (e.g. Worker), include the thread name and indent all
of the call frames for that thread.

• UserInterface/Views/CallFrameTreeElement.js:

(WI.CallFrameTreeElement):
(WI.CallFrameTreeElement.prototype.get isAsyncBoundaryCallFrame): Added.

Location:

trunk/Source/WebInspectorUI

Files:

• ChangeLog (modified) (1 diff)
• UserInterface/Views/CallFrameTreeElement.js (modified) (2 diffs)
• UserInterface/Views/SourcesNavigationSidebarPanel.js (modified) (2 diffs)
• UserInterface/Views/SourcesTabContentView.js (modified) (1 diff)

trunk/Source/WebInspectorUI/ChangeLog

@@ +1 @@
+2020-04-08  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Sources: support copying selected call frame(s) in the Call Stack
+        https://bugs.webkit.org/show_bug.cgi?id=210172
+
+        Reviewed by Timothy Hatcher.
+
+        * UserInterface/Views/SourcesTabContentView.js:
+        (WI.SourcesTabContentView.prototype.handleCopyEvent): Added.
+        * UserInterface/Views/SourcesNavigationSidebarPanel.js:
+        (WI.SourcesNavigationSidebarPanel):
+        (WI.SourcesNavigationSidebarPanel.prototype.handleCopyEvent): Added.
+        Copy the function name and source location for each selected call frame. If the selected
+        call frames span an async boundary, include the async boundary in the form `--- <name> ---`
+        where name is the reason for the async behavior (e.g. `addEventListener`). If the selected
+        call frames span multiple threads (e.g. `Worker`), include the thread name and indent all
+        of the call frames for that thread.
+
+        * UserInterface/Views/CallFrameTreeElement.js:
+        (WI.CallFrameTreeElement):
+        (WI.CallFrameTreeElement.prototype.get isAsyncBoundaryCallFrame): Added.
+
 2020-04-07  Nikita Vasilyev  <nvasilyev@apple.com>
 

trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.js

@@ -38 +38 @@
         this._isActiveCallFrame = false;
 
-         if (isAsyncBoundaryCallFrame) {
+        this._isAsyncBoundaryCallFrame = isAsyncBoundaryCallFrame;
+         if (this._isAsyncBoundaryCallFrame) {
             this.addClassName("async-boundary");
             this.selectable = false;
@@ -67 +68 @@
 
     get callFrame() { return this._callFrame; }
-    get isActiveCallFrame() { return this._isActiveCallFrame; }
+    get isAsyncBoundaryCallFrame() { return this._isAsyncBoundaryCallFrame; }
+
+    get isActiveCallFrame()
+    {
+        return this._isActiveCallFrame;
+    }
 
     set isActiveCallFrame(x)

trunk/Source/WebInspectorUI/UserInterface/Views/SourcesNavigationSidebarPanel.js

@@ -123 +123 @@
 
         this._callStackTreeOutline = this.createContentTreeOutline({suppressFiltering: true});
+        this._callStackTreeOutline.allowsMultipleSelection = true;
         this._callStackTreeOutline.addEventListener(WI.TreeOutline.Event.SelectionDidChange, this._handleTreeSelectionDidChange, this);
+        this._callStackTreeOutline.populateContextMenu = (contextMenu, event, treeElement) => {
+            if (this._callStackTreeOutline.selectedTreeElements.length) {
+                contextMenu.appendItem(WI.UIString("Copy"), () => {
+                    this.handleCopyEvent(event);
+                });
+
+                contextMenu.appendSeparator();
+            }
+
+            WI.TreeOutline.prototype.populateContextMenu(contextMenu, event, treeElement);
+        };
 
         let callStackRow = new WI.DetailsSectionRow;
@@ -581 +593 @@
         console.assert(false, "Didn't find a TreeElement for representedObject", representedObject);
         return null;
+    }
+
+    handleCopyEvent(event)
+    {
+        let selectedTreeElements = new Set(this._callStackTreeOutline.selectedTreeElements);
+        if (!selectedTreeElements.size)
+            return;
+
+        let treeElement = this._callStackTreeOutline.children[0];
+
+        const ignoreHidden = true;
+        const skipUnrevealed = true;
+        const stayWithin = null;
+        const dontPopulate = true;
+        while (!treeElement.revealed(ignoreHidden))
+            treeElement = treeElement.traverseNextTreeElement(skipUnrevealed, stayWithin, dontPopulate);
+
+        let indentString = WI.indentString();
+        let threads = [];
+        let asyncBoundary = null;
+
+        while (treeElement) {
+            if (treeElement instanceof WI.ThreadTreeElement) {
+                threads.push({
+                    name: treeElement.mainTitle,
+                    frames: [],
+                });
+
+                asyncBoundary = null;
+            } else if (treeElement instanceof WI.CallFrameTreeElement) {
+                if (treeElement.isAsyncBoundaryCallFrame) {
+                    asyncBoundary = treeElement.mainTitle;
+                } else if (selectedTreeElements.has(treeElement)) {
+                    if (asyncBoundary) {
+                        threads.lastValue.frames.push("--- " + asyncBoundary + " ---");
+                        asyncBoundary = null;
+                    }
+
+                    let line = treeElement.mainTitle;
+
+                    let sourceCodeLocation = treeElement.callFrame.sourceCodeLocation;
+                    if (sourceCodeLocation)
+                        line += " (" + sourceCodeLocation.displayLocationString() + ")";
+
+                    threads.lastValue.frames.push(line);
+                }
+            }
+
+            treeElement = treeElement.traverseNextTreeElement(skipUnrevealed, stayWithin, dontPopulate);
+        }
+
+        let multipleFramesSelected = threads.filter(({frames}) => frames.length).length > 1;
+
+        let lines = [];
+        for (let {name, frames} of threads) {
+            if (multipleFramesSelected)
+                lines.push(name);
+
+            for (let frame of frames) {
+                let prefix = "";
+                if (multipleFramesSelected)
+                    prefix = indentString;
+                lines.push(prefix + frame);
+            }
+        }
+        if (!lines.length)
+            return;
+
+        setTimeout(() => {
+            InspectorFrontendHost.copyText(lines.join("\n"));
+        });
+
+        event.stop();
     }
 

trunk/Source/WebInspectorUI/UserInterface/Views/SourcesTabContentView.js

@@ -109 +109 @@
     }
 
+    handleCopyEvent(event)
+    {
+        if (this.navigationSidebarPanel.element.contains(WI.currentFocusElement))
+            this.navigationSidebarPanel.handleCopyEvent(event);
+    }
+
     // Private