Changeset 247252 in webkit

Timestamp:

Jul 8, 2019 8:16:04 PM (5 years ago)

Author:

Devin Rousso

Message:

Web Inspector: DOM Debugger: there should be different icons for each type of DOM breakpoint
​https://bugs.webkit.org/show_bug.cgi?id=199552

Reviewed by Joseph Pecoraro.

[S] for Subtree Modified
[A] for Attribute Modified
[R] for Node Removed

• UserInterface/Views/DOMBreakpointTreeElement.js:

(WI.DOMBreakpointTreeElement):

• UserInterface/Views/DOMBreakpointTreeElement.css: Added.

(.breakpoint.dom.breakpoint-for-subtree-modified:not(.breakpoint-paused-icon) .icon):
(.breakpoint.dom.breakpoint-for-attribute-modified:not(.breakpoint-paused-icon) .icon):
(.breakpoint.dom.breakpoint-for-node-removed:not(.breakpoint-paused-icon) .icon):

• UserInterface/Main.html:
• UserInterface/Images/DOMBreakpointAttributeModified.svg: Added.
• UserInterface/Images/DOMBreakpointNodeRemoved.svg: Added.
• UserInterface/Images/DOMBreakpointSubtreeModified.svg: Added.

Location:

trunk/Source/WebInspectorUI

Files:

• ChangeLog (modified) (1 diff)
• UserInterface/Images/DOMBreakpointAttributeModified.svg (added)
• UserInterface/Images/DOMBreakpointNodeRemoved.svg (added)
• UserInterface/Images/DOMBreakpointSubtreeModified.svg (added)
• UserInterface/Main.html (modified) (1 diff)
• UserInterface/Views/DOMBreakpointTreeElement.css (added)
• UserInterface/Views/DOMBreakpointTreeElement.js (modified) (2 diffs)

trunk/Source/WebInspectorUI/ChangeLog

@@ +1 @@
+2019-07-08  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: DOM Debugger: there should be different icons for each type of DOM breakpoint
+        https://bugs.webkit.org/show_bug.cgi?id=199552
+
+        Reviewed by Joseph Pecoraro.
+
+        [S] for Subtree Modified
+        [A] for Attribute Modified
+        [R] for Node Removed
+
+        * UserInterface/Views/DOMBreakpointTreeElement.js:
+        (WI.DOMBreakpointTreeElement):
+        * UserInterface/Views/DOMBreakpointTreeElement.css: Added.
+        (.breakpoint.dom.breakpoint-for-subtree-modified:not(.breakpoint-paused-icon) .icon):
+        (.breakpoint.dom.breakpoint-for-attribute-modified:not(.breakpoint-paused-icon) .icon):
+        (.breakpoint.dom.breakpoint-for-node-removed:not(.breakpoint-paused-icon) .icon):
+
+        * UserInterface/Main.html:
+        * UserInterface/Images/DOMBreakpointAttributeModified.svg: Added.
+        * UserInterface/Images/DOMBreakpointNodeRemoved.svg: Added.
+        * UserInterface/Images/DOMBreakpointSubtreeModified.svg: Added.
+
 2019-07-08  Devin Rousso  <drousso@apple.com>
 

trunk/Source/WebInspectorUI/UserInterface/Main.html

@@ -78 +78 @@
     <link rel="stylesheet" href="Views/ControlToolbarItem.css">
     <link rel="stylesheet" href="Views/CookieStorageContentView.css">
+    <link rel="stylesheet" href="Views/DOMBreakpointTreeElement.css">
     <link rel="stylesheet" href="Views/DOMEventsBreakdownView.css">
     <link rel="stylesheet" href="Views/DOMNodeDetailsSidebarPanel.css">

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

@@ -30 +30 @@
         console.assert(breakpoint instanceof WI.DOMBreakpoint);
 
-        if (!className)
-            className = WI.BreakpointTreeElement.GenericLineIconStyleClassName;
+        let classNames = ["breakpoint", "dom", `breakpoint-for-${breakpoint.type}`];
+        if (className)
+            classNames.push(className);
 
         if (!title)
@@ -37 +38 @@
 
         const subtitle = null;
-        super(["breakpoint", "dom", className], title, subtitle, breakpoint);
+        super(classNames, title, subtitle, breakpoint);
 
         this.status = WI.ImageUtilities.useSVGSymbol("Images/Breakpoint.svg");