Title: [272371] trunk
Revision
272371
Author
nvasil...@apple.com
Date
2021-02-04 09:16:03 -0800 (Thu, 04 Feb 2021)

Log Message

Web Inspector: Collapse blackboxed call frames in Sources
https://bugs.webkit.org/show_bug.cgi?id=216897

Reviewed by Devin Rousso.

Source/WebInspectorUI:

Stack traces often have dozens of blackboxed call frames when using blackboxing for JS-frameworks such as React.js.
It makes it hard to see more relevant non-framework code.

To improve this, introduce "Collapse blackboxed call frames" experimental setting, that collapses adjacent
blackboxed call frames into expandable items.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Base/Setting.js:
* UserInterface/Base/Utilities.js:
* UserInterface/Images/TypeIcons.svg:
* UserInterface/Main.html:
* UserInterface/Models/CallFrame.js:
(WI.CallFrame):
(WI.CallFrame.prototype.get blackboxed):
(WI.CallFrame.fromDebuggerPayload):
(WI.CallFrame.fromPayload):
* UserInterface/Views/BlackboxedGroupTreeElement.css: Added.
(.tree-outline .item.blackboxed-group):
(.tree-outline .item.blackboxed-group .icon):
(@media (prefers-color-scheme: dark) .tree-outline .item.blackboxed-group .icon):
* UserInterface/Views/BlackboxedGroupTreeElement.js: Added.
(WI.BlackboxedGroupTreeElement):
(WI.BlackboxedGroupTreeElement.prototype.expand):
* UserInterface/Views/CallFrameTreeElement.css:
(.tree-outline .item.call-frame.blackboxed:not(.selected)):
* UserInterface/Views/CallFrameView.css:
(.call-frame.blackboxed > .title,):
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
* UserInterface/Views/SourcesNavigationSidebarPanel.js:
(WI.SourcesNavigationSidebarPanel.prototype._handleTreeSelectionDidChange):
* UserInterface/Views/ThreadTreeElement.js:
(WI.ThreadTreeElement.prototype.refresh):
* UserInterface/Views/TreeElement.js:
(WI.TreeElement.treeElementToggled):
This is necessary since `WI.BlackboxedGroupTreeElement` removes itself when expanded.

* UserInterface/Views/Variables.css:
(:root):

LayoutTests:

Test Array.prototype.groupBy.

* inspector/unit-tests/array-utilities-expected.txt:
* inspector/unit-tests/array-utilities.html:

Modified Paths

Added Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (272370 => 272371)


--- trunk/LayoutTests/ChangeLog	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/LayoutTests/ChangeLog	2021-02-04 17:16:03 UTC (rev 272371)
@@ -1,3 +1,15 @@
+2021-02-04  Nikita Vasilyev  <nvasil...@apple.com>
+
+        Web Inspector: Collapse blackboxed call frames in Sources
+        https://bugs.webkit.org/show_bug.cgi?id=216897
+
+        Reviewed by Devin Rousso.
+
+        Test Array.prototype.groupBy.
+
+        * inspector/unit-tests/array-utilities-expected.txt:
+        * inspector/unit-tests/array-utilities.html:
+
 2021-02-04  Aditya Keerthi  <akeer...@apple.com>
 
         [macOS] Selecting a date on datetime-local inputs unexpectedly adds second and millisecond fields

Modified: trunk/LayoutTests/inspector/unit-tests/array-utilities-expected.txt (272370 => 272371)


--- trunk/LayoutTests/inspector/unit-tests/array-utilities-expected.txt	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/LayoutTests/inspector/unit-tests/array-utilities-expected.txt	2021-02-04 17:16:03 UTC (rev 272371)
@@ -105,6 +105,16 @@
 [1,2,3] => [[1,2],[2,3]]
 [1,2,3,4] => [[1,2],[2,3],[3,4]]
 
+-- Running test case: Array.prototype.groupBy
+[0,1,0,1,1,0,1,1,1,0] => [0,[1],0,[1,1],0,[1,1,1],0]
+[0,1,0,1,1,0,1,1,1,0] => [0,1,0,[1,1],0,[1,1,1],0]
+[0,1,0,1,1,0,1,1,1,0] => [0,1,0,1,1,0,[1,1,1],0]
+[0,1,0,1,1,0,1,1,1,0] => [0,1,0,1,1,0,1,1,1,0]
+[0,1,0,1,1,0,1,1,1] => [0,[1],0,[1,1],0,[1,1,1]]
+[0,1,0,1,1,0,1,1,1] => [0,1,0,[1,1],0,[1,1,1]]
+[0,1,0,1,1,0,1,1,1] => [0,1,0,1,1,0,[1,1,1]]
+[0,1,0,1,1,0,1,1,1] => [0,1,0,1,1,0,1,1,1]
+
 -- Running test case: Array.prototype.remove
 PASS: remove should return true when removing a value that exists.
 PASS: remove should only remove the first matching value.

Modified: trunk/LayoutTests/inspector/unit-tests/array-utilities.html (272370 => 272371)


--- trunk/LayoutTests/inspector/unit-tests/array-utilities.html	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/LayoutTests/inspector/unit-tests/array-utilities.html	2021-02-04 17:16:03 UTC (rev 272371)
@@ -220,6 +220,32 @@
     });
 
     suite.addTestCase({
+        name: "Array.prototype.groupBy",
+        test() {
+            function log(input, output) {
+                InspectorTest.log(JSON.stringify(input) + " => " + JSON.stringify(output));
+            }
+
+            let arr = [0, 1, 0, 1, 1, 0, 1, 1, 1, 0];
+            let isOne = (x) => { return x === 1 };
+
+            log(arr, arr.groupBy(isOne, 1));
+            log(arr, arr.groupBy(isOne, 2));
+            log(arr, arr.groupBy(isOne, 3));
+            log(arr, arr.groupBy(isOne, 4));
+
+            let arr2 = [0, 1, 0, 1, 1, 0, 1, 1, 1];
+
+            log(arr2, arr2.groupBy(isOne, 1));
+            log(arr2, arr2.groupBy(isOne, 2));
+            log(arr2, arr2.groupBy(isOne, 3));
+            log(arr2, arr2.groupBy(isOne, 4));
+
+            return true;
+        }
+    });
+
+    suite.addTestCase({
         name: "Array.prototype.remove",
         test() {
             let arr1 = [1, 2, 3, 1];

Modified: trunk/Source/WebInspectorUI/ChangeLog (272370 => 272371)


--- trunk/Source/WebInspectorUI/ChangeLog	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-02-04 17:16:03 UTC (rev 272371)
@@ -1,3 +1,50 @@
+2021-02-04  Nikita Vasilyev  <nvasil...@apple.com>
+
+        Web Inspector: Collapse blackboxed call frames in Sources
+        https://bugs.webkit.org/show_bug.cgi?id=216897
+
+        Reviewed by Devin Rousso.
+
+        Stack traces often have dozens of blackboxed call frames when using blackboxing for JS-frameworks such as React.js.
+        It makes it hard to see more relevant non-framework code.
+
+        To improve this, introduce "Collapse blackboxed call frames" experimental setting, that collapses adjacent
+        blackboxed call frames into expandable items.
+
+        * Localizations/en.lproj/localizedStrings.js:
+        * UserInterface/Base/Setting.js:
+        * UserInterface/Base/Utilities.js:
+        * UserInterface/Images/TypeIcons.svg:
+        * UserInterface/Main.html:
+        * UserInterface/Models/CallFrame.js:
+        (WI.CallFrame):
+        (WI.CallFrame.prototype.get blackboxed):
+        (WI.CallFrame.fromDebuggerPayload):
+        (WI.CallFrame.fromPayload):
+        * UserInterface/Views/BlackboxedGroupTreeElement.css: Added.
+        (.tree-outline .item.blackboxed-group):
+        (.tree-outline .item.blackboxed-group .icon):
+        (@media (prefers-color-scheme: dark) .tree-outline .item.blackboxed-group .icon):
+        * UserInterface/Views/BlackboxedGroupTreeElement.js: Added.
+        (WI.BlackboxedGroupTreeElement):
+        (WI.BlackboxedGroupTreeElement.prototype.expand):
+        * UserInterface/Views/CallFrameTreeElement.css:
+        (.tree-outline .item.call-frame.blackboxed:not(.selected)):
+        * UserInterface/Views/CallFrameView.css:
+        (.call-frame.blackboxed > .title,):
+        * UserInterface/Views/SettingsTabContentView.js:
+        (WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
+        * UserInterface/Views/SourcesNavigationSidebarPanel.js:
+        (WI.SourcesNavigationSidebarPanel.prototype._handleTreeSelectionDidChange):
+        * UserInterface/Views/ThreadTreeElement.js:
+        (WI.ThreadTreeElement.prototype.refresh):
+        * UserInterface/Views/TreeElement.js:
+        (WI.TreeElement.treeElementToggled):
+        This is necessary since `WI.BlackboxedGroupTreeElement` removes itself when expanded.
+
+        * UserInterface/Views/Variables.css:
+        (:root):
+
 2021-02-02  BJ Burg  <bb...@apple.com>
 
         Web Inspector: Add another Protocol Version (iOS 14.5)

Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (272370 => 272371)


--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -219,6 +219,8 @@
 localizedStrings["Blackbox"] = "Blackbox";
 localizedStrings["Blackbox Script"] = "Blackbox Script";
 localizedStrings["Blackbox script to ignore it when debugging"] = "Blackbox script to ignore it when debugging";
+/* Part of the 'Blackboxed - %d call frames' label shown in the debugger call stack when paused instead of subsequent call frames that have been blackboxed. */
+localizedStrings["Blackboxed @ Debugger Call Stack"] = "Blackboxed";
 localizedStrings["Block Variables"] = "Block Variables";
 /* Input label for the blur radius of a CSS box shadow */
 localizedStrings["Blur @ Box Shadow Editor"] = "Blur";
@@ -324,6 +326,8 @@
 localizedStrings["Closure Variables (%s)"] = "Closure Variables (%s)";
 localizedStrings["Code"] = "Code";
 localizedStrings["Collapse All"] = "Collapse All";
+/* Setting to collapse blackboxed call frames in the debugger. */
+localizedStrings["Collapse blackboxed call frames @ Experimental Settings"] = "Collapse blackboxed call frames";
 localizedStrings["Collapse columns"] = "Collapse columns";
 localizedStrings["Collect garbage"] = "Collect garbage";
 localizedStrings["Comment"] = "Comment";
@@ -420,6 +424,8 @@
 localizedStrings["Debugger disabled during Audit"] = "Debugger disabled during Audit";
 localizedStrings["Debugger disabled during Timeline recording"] = "Debugger disabled during Timeline recording";
 localizedStrings["Debugging:"] = "Debugging:";
+/* Category label for experimental settings related to debugging. */
+localizedStrings["Debugging: @ Experimental Settings"] = "Debugging:";
 localizedStrings["Debugs"] = "Debugs";
 localizedStrings["Decoded"] = "Decoded";
 localizedStrings["Default"] = "Default";
@@ -1689,6 +1695,10 @@
 localizedStrings["\u0022%s\u0022 threw an error"] = "\u0022%s\u0022 threw an error";
 localizedStrings["\u201C%s\u201D Event Fired"] = "\u201C%s\u201D Event Fired";
 localizedStrings["\u201C%s\u201D Profile Recorded"] = "\u201C%s\u201D Profile Recorded";
+/* Part of the 'Blackboxed - %d call frame' label shown in the debugger call stack when paused instead of subsequent call frames that have been blackboxed. */
+localizedStrings["call frame @ Debugger Call Stack"] = "%d call frame";
+/* Part of the 'Blackboxed - %d call frames' label shown in the debugger call stack when paused instead of subsequent call frames that have been blackboxed. */
+localizedStrings["call frames @ Debugger Call Stack"] = "%d call frames";
 localizedStrings["computed"] = "computed";
 localizedStrings["default"] = "default";
 localizedStrings["default prevented"] = "default prevented";

Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -224,6 +224,7 @@
     experimentalEnableStylesJumpToEffective: new WI.Setting("experimental-styles-jump-to-effective", false),
     experimentalEnableStylesJumpToVariableDeclaration: new WI.Setting("experimental-styles-jump-to-variable-declaration", false),
     experimentalEnableLayoutPanel: new WI.Setting("experimental-enable-layout-panel", false),
+    experimentalCollapseBlackboxedCallFrames: new WI.Setting("experimental-collapse-blackboxed-call-frames", false),
 
     // Protocol
     protocolLogAsText: new WI.Setting("protocol-log-as-text", false),

Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -1624,6 +1624,40 @@
     }
 });
 
+Object.defineProperty(Array.prototype, "groupBy",
+{
+    value(groupFunction, minGroupSize = 1)
+    {
+        let result = [];
+        let startIndex = null;
+
+        let flush = (endIndex) => {
+            if (startIndex === null)
+                return;
+            let group = this.slice(startIndex, endIndex + 1);
+            let adjacentCount = (endIndex + 1) - startIndex;
+            if (adjacentCount >= minGroupSize)
+                result.push(group);
+            else
+                result.pushAll(group);
+        }
+
+        this.forEach((item, i) => {
+            if (groupFunction(item)) {
+                startIndex ??= i;
+                if (i === this.length - 1)
+                    flush(this.length - 1);
+            } else {
+                flush(i - 1);
+                result.push(item);
+                startIndex = null;
+            }
+        });
+
+        return result;
+    }
+});
+
 Object.defineProperty(Promise, "chain",
 {
     async value(callbacks, initialValue)

Modified: trunk/Source/WebInspectorUI/UserInterface/Images/TypeIcons.svg (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Images/TypeIcons.svg	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Images/TypeIcons.svg	2021-02-04 17:16:03 UTC (rev 272371)
@@ -290,6 +290,8 @@
     <g id="AuditTestGroup-light" class="light blue"><use href="" href=""
     <g id="AuditTestGroupResult-dark" class="dark grey"><use href="" href=""
     <g id="AuditTestGroupResult-light" class="light grey"><use href="" href=""
+    <g id="Blackboxed-dark" class="dark grey"><use href="" href=""
+    <g id="Blackboxed-light" class="light grey"><use href="" href=""
     <g id="CallTrees-dark" class="dark grey"><use href="" href=""
     <g id="CallTrees-light" class="light grey"><use href="" href=""
     <g id="DebuggerStatement-dark" class="dark blue"><use href="" href=""
@@ -437,4 +439,4 @@
     <g id="TypeUndefined-light" class="light grey"><use href="" href=""
     <g id="URLBreakpoint-dark" class="dark blue"><use href="" href=""
     <g id="URLBreakpoint-light" class="light blue"><use href="" href=""
-</svg>
\ No newline at end of file
+</svg>

Modified: trunk/Source/WebInspectorUI/UserInterface/Main.html (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Main.html	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Main.html	2021-02-04 17:16:03 UTC (rev 272371)
@@ -41,6 +41,7 @@
     <link rel="stylesheet" href=""
     <link rel="stylesheet" href=""
     <link rel="stylesheet" href=""
+    <link rel="stylesheet" href=""
     <link rel="stylesheet" href=""
     <link rel="stylesheet" href=""
     <link rel="stylesheet" href=""
@@ -620,6 +621,7 @@
     <script src=""
     <script src=""
     <script src=""
+    <script src=""
     <script src=""
     <script src=""
     <script src=""

Modified: trunk/Source/WebInspectorUI/UserInterface/Models/CallFrame.js (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Models/CallFrame.js	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/CallFrame.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -25,7 +25,7 @@
 
 WI.CallFrame = class CallFrame
 {
-    constructor(target, id, sourceCodeLocation, functionName, thisObject, scopeChain, nativeCode, programCode, isTailDeleted)
+    constructor(target, id, sourceCodeLocation, functionName, thisObject, scopeChain, nativeCode, programCode, isTailDeleted, blackboxed)
     {
         console.assert(target instanceof WI.Target);
         console.assert(!sourceCodeLocation || sourceCodeLocation instanceof WI.SourceCodeLocation);
@@ -47,6 +47,7 @@
         this._nativeCode = nativeCode || false;
         this._programCode = programCode || false;
         this._isTailDeleted = isTailDeleted || false;
+        this._blackboxed = blackboxed || false;
     }
 
     // Public
@@ -60,6 +61,7 @@
     get thisObject() { return this._thisObject; }
     get scopeChain() { return this._scopeChain; }
     get isTailDeleted() { return this._isTailDeleted; }
+    get blackboxed() { return this._blackboxed; }
     get isConsoleEvaluation() { return this._isConsoleEvaluation; }
 
     saveIdentityToCookie()
@@ -209,7 +211,8 @@
         let nativeCode = false;
         let programCode = WI.CallFrame.programCodeFromPayload(payload);
         let isTailDeleted = payload.isTailDeleted;
-        return new WI.CallFrame(target, id, sourceCodeLocation, functionName, thisObject, scopeChain, nativeCode, programCode, isTailDeleted);
+        let blackboxed = sourceCodeLocation && !!WI.debuggerManager.blackboxDataForSourceCode(sourceCodeLocation.sourceCode);
+        return new WI.CallFrame(target, id, sourceCodeLocation, functionName, thisObject, scopeChain, nativeCode, programCode, isTailDeleted, blackboxed);
     }
 
     static fromPayload(target, payload)
@@ -253,6 +256,7 @@
         const thisObject = null;
         const scopeChain = null;
         const isTailDeleted = false;
-        return new WI.CallFrame(target, id, sourceCodeLocation, functionName, thisObject, scopeChain, nativeCode, programCode, isTailDeleted);
+        let blackboxed = sourceCodeLocation && !!WI.debuggerManager.blackboxDataForSourceCode(sourceCodeLocation.sourceCode);
+        return new WI.CallFrame(target, id, sourceCodeLocation, functionName, thisObject, scopeChain, nativeCode, programCode, isTailDeleted, blackboxed);
     }
 };

Copied: trunk/Source/WebInspectorUI/UserInterface/Views/BlackboxedGroupTreeElement.css (from rev 272370, trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css) (0 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/BlackboxedGroupTreeElement.css	                        (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BlackboxedGroupTreeElement.css	2021-02-04 17:16:03 UTC (rev 272371)
@@ -0,0 +1,39 @@
+/*
+ * Copyright (C) 2020 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+.tree-outline .item.blackboxed-group {
+    cursor: pointer;
+    opacity: var(--blackboxed-tree-item-opacity);
+}
+
+.tree-outline .item.blackboxed-group .icon {
+    content: url(../Images/TypeIcons.svg#Blackboxed-light);
+}
+
+@media (prefers-color-scheme: dark) {
+    .tree-outline .item.blackboxed-group .icon {
+        content: url(../Images/TypeIcons.svg#Blackboxed-dark);
+    }
+}

Added: trunk/Source/WebInspectorUI/UserInterface/Views/BlackboxedGroupTreeElement.js (0 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/BlackboxedGroupTreeElement.js	                        (rev 0)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BlackboxedGroupTreeElement.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -0,0 +1,57 @@
+/*
+ * Copyright (C) 2020 Apple Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
+ * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
+ * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
+ * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
+ * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+ * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
+ * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
+ * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
+ * THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WI.BlackboxedGroupTreeElement = class BlackboxedGroupTreeElement extends WI.GeneralTreeElement
+{
+    constructor(callFrames)
+    {
+        console.assert(Array.isArray(callFrames) && callFrames.length && callFrames.every((callFrame) => callFrame instanceof WI.CallFrame));
+
+        const classNames = ["blackboxed-group"];
+        const title = WI.UIString("Blackboxed", "Blackboxed @ Debugger Call Stack", "Part of the 'Blackboxed - %d call frames' label shown in the debugger call stack when paused instead of subsequent call frames that have been blackboxed.");
+        let subtitle;
+        if (callFrames.length === 1)
+            subtitle = WI.UIString("%d call frame", "call frame @ Debugger Call Stack", "Part of the 'Blackboxed - %d call frame' label shown in the debugger call stack when paused instead of subsequent call frames that have been blackboxed.").format(callFrames.length);
+        else
+            subtitle = WI.UIString("%d call frames", "call frames @ Debugger Call Stack", "Part of the 'Blackboxed - %d call frames' label shown in the debugger call stack when paused instead of subsequent call frames that have been blackboxed.").format(callFrames.length);
+
+        super(classNames, title, subtitle);
+
+        this.selectable = false;
+        this.toggleOnClick = true;
+        this._callFrames = callFrames;
+    }
+
+    // Public
+
+    expand()
+    {
+        let index = this.parent.children.indexOf(this);
+        for (let i = this._callFrames.length - 1; i >= 0; --i)
+            this.parent.insertChild(new WI.CallFrameTreeElement(this._callFrames[i]), index);
+
+        this.parent.removeChild(this);
+    }
+};

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css	2021-02-04 17:16:03 UTC (rev 272371)
@@ -99,5 +99,5 @@
 }
 
 .tree-outline .item.call-frame.blackboxed:not(.selected) {
-    opacity: 0.5;
+    opacity: var(--blackboxed-tree-item-opacity);
 }

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css	2021-02-04 17:16:03 UTC (rev 272371)
@@ -32,7 +32,7 @@
 
 .call-frame.blackboxed > .title,
 .call-frame.blackboxed:not(:hover, :focus) > .subtitle {
-    opacity: 0.5;
+    opacity: var(--blackboxed-tree-item-opacity);
 }
 
 .call-frame .icon {

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -403,6 +403,12 @@
             experimentalSettingsView.addSeparator();
         }
 
+        let supportsBlackboxingScripts = WI.DebuggerManager.supportsBlackboxingScripts();
+        if (supportsBlackboxingScripts) {
+            experimentalSettingsView.addSetting(WI.UIString("Debugging:", "Debugging: @ Experimental Settings", "Category label for experimental settings related to debugging."), WI.settings.experimentalCollapseBlackboxedCallFrames, WI.UIString("Collapse blackboxed call frames", "Collapse blackboxed call frames @ Experimental Settings", "Setting to collapse blackboxed call frames in the debugger."));
+            experimentalSettingsView.addSeparator();
+        }
+
         let reloadInspectorButton = document.createElement("button");
         reloadInspectorButton.textContent = WI.UIString("Reload Web Inspector");
         reloadInspectorButton.addEventListener("click", (event) => {
@@ -427,6 +433,9 @@
             listenForChange(WI.settings.experimentalEnableStylesJumpToVariableDeclaration);
         }
 
+        if (supportsBlackboxingScripts)
+            listenForChange(WI.settings.experimentalCollapseBlackboxedCallFrames);
+
         this._createReferenceLink(experimentalSettingsView);
 
         this.addSettingsView(experimentalSettingsView);

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SourcesNavigationSidebarPanel.js (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/SourcesNavigationSidebarPanel.js	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SourcesNavigationSidebarPanel.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -1987,6 +1987,9 @@
             return;
         }
 
+        if (treeElement instanceof WI.BlackboxedGroupTreeElement)
+            return;
+
         console.error("Unknown tree element", treeElement);
     }
 

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ThreadTreeElement.js (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/ThreadTreeElement.js	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ThreadTreeElement.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -56,13 +56,24 @@
         let activeCallFrame = WI.debuggerManager.activeCallFrame;
         let activeCallFrameTreeElement = null;
 
-        for (let callFrame of callFrames) {
-            let callFrameTreeElement = new WI.CallFrameTreeElement(callFrame);
-            if (callFrame === activeCallFrame)
-                activeCallFrameTreeElement = callFrameTreeElement;
-            this.appendChild(callFrameTreeElement);
-        }
+        let renderCallFrames = (callFrames, shouldSelectActiveFrame) => {
+            if (WI.settings.experimentalCollapseBlackboxedCallFrames.value)
+                callFrames = callFrames.groupBy((callFrame) => callFrame.blackboxed);
 
+            for (let callFrameOrBlackboxedGroup of callFrames) {
+                if (Array.isArray(callFrameOrBlackboxedGroup)) {
+                    this.appendChild(new WI.BlackboxedGroupTreeElement(callFrameOrBlackboxedGroup));
+                    continue;
+                }
+                let callFrameTreeElement = new WI.CallFrameTreeElement(callFrameOrBlackboxedGroup);
+                if (shouldSelectActiveFrame && callFrameOrBlackboxedGroup === activeCallFrame)
+                    activeCallFrameTreeElement = callFrameTreeElement;
+                this.appendChild(callFrameTreeElement);
+            }
+        };
+
+        renderCallFrames(callFrames, true);
+
         if (activeCallFrameTreeElement) {
             activeCallFrameTreeElement.select(true, true);
             activeCallFrameTreeElement.isActiveCallFrame = true;
@@ -89,8 +100,7 @@
             this.appendChild(new WI.CallFrameTreeElement(boundaryCallFrame, isAsyncBoundaryCallFrame));
 
             let startIndex = currentStackTrace.topCallFrameIsBoundary ? 1 : 0;
-            for (let i = startIndex; i < currentStackTrace.callFrames.length; ++i)
-                this.appendChild(new WI.CallFrameTreeElement(currentStackTrace.callFrames[i]));
+            renderCallFrames(startIndex ? currentStackTrace.callFrames.slice(startIndex) : currentStackTrace.callFrames);
 
             if (currentStackTrace.truncated) {
                 let truncatedTreeElement = new WI.GeneralTreeElement("truncated-call-frames", WI.UIString("Call Frames Truncated"));

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js	2021-02-04 17:16:03 UTC (rev 272371)
@@ -324,7 +324,7 @@
             event.stopPropagation();
         }
 
-        if (!treeElement.treeOutline.selectable)
+        if (treeElement.treeOutline && !treeElement.treeOutline.selectable)
             treeElement.treeOutline.dispatchEventToListeners(WI.TreeOutline.Event.ElementClicked, {treeElement});
     }
 

Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css (272370 => 272371)


--- trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css	2021-02-04 17:16:03 UTC (rev 272371)
@@ -215,6 +215,8 @@
     --reference-page-link-size: 20px;
 
     --image-button-navigation-item-width: 26px;
+
+    --blackboxed-tree-item-opacity: 0.5;
 }
 
 body.window-inactive {
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to