Web Inspector: Allow keyboard navigation in Heap Snapshot data grids
authormattbaker@apple.com <mattbaker@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 12 Dec 2016 17:20:37 +0000 (17:20 +0000)
committermattbaker@apple.com <mattbaker@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 12 Dec 2016 17:20:37 +0000 (17:20 +0000)
https://bugs.webkit.org/show_bug.cgi?id=165752

Reviewed by Brian Burg.

* UserInterface/Views/DOMTreeOutline.css:
(.tree-outline.dom:focus li.selected > span::after):
Use new color variable.

* UserInterface/Views/HeapSnapshotInstanceDataGridNode.js:
(WebInspector.HeapSnapshotInstanceDataGridNode.prototype.get selectable): Deleted.
Should be selectable.

* UserInterface/Views/HeapSnapshotInstancesContentView.css:
(.heap-snapshot > .data-grid:focus tr.selected > td .sub-retained):
(.heap-snapshot > .data-grid:focus tr.selected .object-id,):
(.heap-snapshot > .data-grid:focus tr.selected .formatted-string,):
(.heap-snapshot > .data-grid:focus tr.selected td .location):
Selected row text should just be white, except for values that are usually
gray (object ID, object size, and sub-retained size values). These should
be styled like the "= $0" marker in the DOM tree outline.

(.heap-snapshot > .data-grid:matches(:focus, .force-focus) tr.selected td .location): Deleted.
Removed forced-focus reference. Only used by TreeOutlineDataGridSynchronizer.

* UserInterface/Views/Variables.css:
(:root):
Added --selected-secondary-text-color.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@209709 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css
Source/WebInspectorUI/UserInterface/Views/HeapSnapshotInstanceDataGridNode.js
Source/WebInspectorUI/UserInterface/Views/HeapSnapshotInstancesContentView.css
Source/WebInspectorUI/UserInterface/Views/Variables.css

index 9556cc3..3dff7c2 100644 (file)
@@ -1,5 +1,36 @@
 2016-12-12  Matt Baker  <mattbaker@apple.com>
 
+        Web Inspector: Allow keyboard navigation in Heap Snapshot data grids
+        https://bugs.webkit.org/show_bug.cgi?id=165752
+
+        Reviewed by Brian Burg.
+
+        * UserInterface/Views/DOMTreeOutline.css:
+        (.tree-outline.dom:focus li.selected > span::after):
+        Use new color variable.
+
+        * UserInterface/Views/HeapSnapshotInstanceDataGridNode.js:
+        (WebInspector.HeapSnapshotInstanceDataGridNode.prototype.get selectable): Deleted.
+        Should be selectable.
+
+        * UserInterface/Views/HeapSnapshotInstancesContentView.css:
+        (.heap-snapshot > .data-grid:focus tr.selected > td .sub-retained):
+        (.heap-snapshot > .data-grid:focus tr.selected .object-id,):
+        (.heap-snapshot > .data-grid:focus tr.selected .formatted-string,):
+        (.heap-snapshot > .data-grid:focus tr.selected td .location):
+        Selected row text should just be white, except for values that are usually
+        gray (object ID, object size, and sub-retained size values). These should
+        be styled like the "= $0" marker in the DOM tree outline.
+
+        (.heap-snapshot > .data-grid:matches(:focus, .force-focus) tr.selected td .location): Deleted.
+        Removed forced-focus reference. Only used by TreeOutlineDataGridSynchronizer.
+
+        * UserInterface/Views/Variables.css:
+        (:root):
+        Added --selected-secondary-text-color.
+
+2016-12-12  Matt Baker  <mattbaker@apple.com>
+
         Web Inspector: Breakpoint Log action should support template literals
         https://bugs.webkit.org/show_bug.cgi?id=165116
         <rdar://problem/29464765>
index 6875255..dc33d95 100644 (file)
@@ -72,7 +72,7 @@
 }
 
 .tree-outline.dom:focus li.selected > span::after {
-    color: hsla(0, 100%, 100%, 0.7);
+    color: var(--selected-secondary-text-color);
 }
 
 .tree-outline.dom ol {
index 72c816d..c23bedc 100644 (file)
@@ -95,7 +95,6 @@ WebInspector.HeapSnapshotInstanceDataGridNode = class HeapSnapshotInstanceDataGr
 
     get data() { return this._node; }
     get node() { return this._node; }
-    get selectable() { return false; }
 
     get propertyName()
     {
index 527deb0..8f899ce 100644 (file)
     text-decoration: underline;
 }
 
+.heap-snapshot > .data-grid:focus tr.selected > td .sub-retained {
+    color: var(--selected-secondary-text-color);
+}
+
+.heap-snapshot > .data-grid:focus tr.selected .object-id,
+.heap-snapshot > .data-grid:focus tr.selected .object-preview > .size {
+    color: var(--selected-secondary-text-color);
+}
+
+.heap-snapshot > .data-grid:focus tr.selected .formatted-string,
+.heap-snapshot > .data-grid:focus tr.selected .object-preview span {
+    color: var(--selected-foreground-color);
+}
+
 .heap-snapshot > .data-grid td .location {
     margin-left: 1ex;
     color: hsl(0, 0%, 60%);
 }
 
-.heap-snapshot > .data-grid:matches(:focus, .force-focus) tr.selected td .location {
+.heap-snapshot > .data-grid:focus tr.selected td .location {
     color: hsl(0, 0%, 85%);
 }
 
index 19d9294..f3491a0 100644 (file)
@@ -33,6 +33,7 @@
     --z-index-uncaught-exception-sheet: 4096;
 
     --selected-foreground-color: white;
+    --selected-secondary-text-color: hsla(0, 100%, 100%, 0.7);
     --selected-background-color: hsl(212, 92%, 54%);
     --selected-background-color-unfocused: hsl(0, 0%, 83%);
     --selected-background-color-active: hsl(218, 85%, 52%);