chrome-devtools-frontend 1.0.1008646 → 1.0.1009515

package/front_end/ui/components/docs/computed_style_property/basic.ts

@@ -10,18 +10,20 @@ await FrontendHelpers.initializeGlobalVars();
 
 const component = new Elements.ComputedStyleProperty.ComputedStyleProperty();
 
-const propertyName = document.createElement('span');
-propertyName.textContent = 'display';
-propertyName.slot = 'property-name';
-component.appendChild(propertyName);
-
-const propertyValue = document.createElement('span');
-propertyValue.textContent = 'block';
-propertyValue.slot = 'property-value';
-component.appendChild(propertyValue);
-
 document.getElementById('container')?.appendChild(component);
 component.data = {
+  propertyNameRenderer: () => {
+    const propertyName = document.createElement('span');
+    propertyName.textContent = 'display';
+    propertyName.slot = 'property-name';
+    return propertyName;
+  },
+  propertyValueRenderer: () => {
+    const propertyValue = document.createElement('span');
+    propertyValue.textContent = 'block';
+    propertyValue.slot = 'property-value';
+    return propertyValue;
+  },
   inherited: true,
   traceable: false,
   onNavigateToSource: (): void => {},

package/front_end/ui/components/docs/computed_style_property/traceable.ts

@@ -7,16 +7,6 @@ import * as Elements from '../../../../panels/elements/components/components.js'
 
 const component = new Elements.ComputedStyleProperty.ComputedStyleProperty();
 
-const propertyName = document.createElement('span');
-propertyName.textContent = 'display';
-propertyName.slot = 'property-name';
-component.appendChild(propertyName);
-
-const propertyValue = document.createElement('span');
-propertyValue.textContent = 'grid';
-propertyValue.slot = 'property-value';
-component.appendChild(propertyValue);
-
 const trace = document.createElement('pre');
 trace.textContent = 'block    body         (style.css):42';
 trace.slot = 'property-traces';
@@ -24,6 +14,19 @@ component.appendChild(trace);
 
 document.getElementById('container')?.appendChild(component);
 component.data = {
+  propertyNameRenderer: () => {
+    const propertyName = document.createElement('span');
+    propertyName.textContent = 'display';
+    propertyName.slot = 'property-name';
+    return propertyName;
+  },
+  propertyValueRenderer: () => {
+    const propertyValue = document.createElement('span');
+    propertyValue.textContent = 'grid';
+    propertyValue.slot = 'property-value';
+
+    return propertyValue;
+  },
   inherited: false,
   traceable: true,
   onNavigateToSource: (): void => {},

package/front_end/ui/legacy/components/data_grid/DataGrid.ts

@@ -1181,11 +1181,9 @@ export class DataGridImpl<T> extends Common.ObjectWrapper.ObjectWrapper<EventTyp
       nextSelectedNode.select();
     }
 
-    if ((event.key === 'ArrowUp' || event.key === 'ArrowDown' || event.key === 'ArrowLeft' ||
-         event.key === 'ArrowRight') &&
-        document.activeElement !== this.element) {
-      // crbug.com/1005449
-      // navigational keys pressed but current DataGrid panel has lost focus;
+    if (handled && document.activeElement !== this.element) {
+      // crbug.com/1005449, crbug.com/1329956
+      // navigational or delete keys pressed but current DataGrid panel has lost focus;
       // re-focus to ensure subsequent keydowns can be registered within this DataGrid
       this.element.focus();
     }

package/package.json

@@ -55,5 +55,5 @@
     "unittest": "scripts/test/run_unittests.py --no-text-coverage",
     "watch": "vpython third_party/node/node.py --output scripts/watch_build.js"
   },
-  "version": "1.0.1008646"
+  "version": "1.0.1009515"
 }

package/front_end/panels/elements/computedStyleWidgetTree.css

@@ -1,66 +0,0 @@
-/*
- * Copyright (c) 2017 The Chromium Authors. All rights reserved.
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-
-.alphabetical-list.render-flash {
-  min-height: 100vh;
-}
-
-.tree-outline,
-.tree-outline ol {
-  padding-left: 0;
-}
-
-.tree-outline li:hover {
-  background-color: var(--legacy-focus-bg-color);
-  cursor: text;
-}
-
-.tree-outline li::before {
-  margin: 0 -1px 0 4px;
-}
-
-.group-title {
-  /* tree-outline li::before is set to be 16px wide */
-  padding-right: 16px;
-}
-
-.tree-outline li.group-title:hover {
-  background-color: transparent;
-}
-
-.group-title > h1 {
-  margin: 1px 0 0;
-  padding: 1em 0;
-  width: 100%;
-  cursor: text;
-  color: var(--color-text-secondary);
-  font-size: 11px;
-  font-weight: 400;
-}
-
-.group-title:not(.first-group) > h1 {
-  border-top: 1px solid var(--color-details-hairline);
-}
-
-.group-title + ol.children {
-  margin-bottom: 1em;
-}
-
-@media (forced-colors: active) {
-  :host-context(.monospace.computed-properties) .tree-outline li:hover {
-    forced-color-adjust: none;
-    background-color: Highlight;
-  }
-
-  :host-context(.monospace.computed-properties) .tree-outline:not(.hide-selection-when-blurred) li.parent:hover.selected::before,
-  :host-context(.monospace.computed-properties) .tree-outline-disclosure li.parent:hover::before {
-    background-color: HighlightText;
-  }
-
-  :host-context(.monospace.computed-properties) .tree-outline li:hover * {
-    color: HighlightText;
-  }
-}