chrome-devtools-frontend 1.0.923302 → 1.0.925026

package/front_end/third_party/wasmparser/package/src/WasmDis.ts

@@ -771,6 +771,13 @@ export class WasmDisassembler {
         this.appendBuffer(" ");
         this.appendBuffer(this.useLabel(operator.brDepth));
         break;
+      case OperatorCode.br_on_cast_static:
+      case OperatorCode.br_on_cast_static_fail: {
+        const label = this.useLabel(operator.brDepth);
+        const refType = this._nameResolver.getTypeName(operator.refType, true);
+        this.appendBuffer(` ${label} ${refType}`);
+        break;
+      }
       case OperatorCode.br_table:
         for (var i = 0; i < operator.brTable.length; i++) {
           this.appendBuffer(" ");
@@ -1051,9 +1058,15 @@ export class WasmDisassembler {
       case OperatorCode.rtt_canon:
       case OperatorCode.rtt_sub:
       case OperatorCode.rtt_fresh_sub:
+      case OperatorCode.ref_test_static:
+      case OperatorCode.ref_cast_static:
+      case OperatorCode.struct_new_default:
       case OperatorCode.struct_new_default_with_rtt:
+      case OperatorCode.struct_new:
       case OperatorCode.struct_new_with_rtt:
+      case OperatorCode.array_new_default:
       case OperatorCode.array_new_default_with_rtt:
+      case OperatorCode.array_new:
       case OperatorCode.array_new_with_rtt:
       case OperatorCode.array_get:
       case OperatorCode.array_get_s:
@@ -1068,6 +1081,14 @@ export class WasmDisassembler {
         const dstType = this._nameResolver.getTypeName(operator.refType, true);
         const srcType = this._nameResolver.getTypeName(operator.srcType, true);
         this.appendBuffer(` ${dstType} ${srcType}`);
+        break;
+      }
+      case OperatorCode.array_init:
+      case OperatorCode.array_init_static: {
+        const refType = this._nameResolver.getTypeName(operator.refType, true);
+        const length = operator.brDepth; // Overloaded field.
+        this.appendBuffer(` ${refType} ${length}`);
+        break;
       }
     }
   }
@@ -1209,7 +1230,7 @@ export class WasmDisassembler {
             for (const exportName of this._exportMetadata.getMemoryExportNames(
               memoryIndex
             )) {
-              this.appendBuffer(` (export "${exportName}")`);
+              this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
             }
           }
           this.appendBuffer(` ${limitsToString(memoryInfo.limits)}`);
@@ -1228,7 +1249,7 @@ export class WasmDisassembler {
             for (const exportName of this._exportMetadata.getEventExportNames(
               eventIndex
             )) {
-              this.appendBuffer(` (export "${exportName}")`);
+              this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
             }
           }
           this.printFuncType(eventInfo.typeIndex);
@@ -1244,7 +1265,7 @@ export class WasmDisassembler {
             for (const exportName of this._exportMetadata.getTableExportNames(
               tableIndex
             )) {
-              this.appendBuffer(` (export "${exportName}")`);
+              this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
             }
           }
           this.appendBuffer(
@@ -1322,7 +1343,7 @@ export class WasmDisassembler {
                 for (const exportName of this._exportMetadata.getFunctionExportNames(
                   funcIndex
                 )) {
-                  this.appendBuffer(` (export "${exportName}")`);
+                  this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
                 }
               }
               this.appendBuffer(` (import `);
@@ -1343,7 +1364,7 @@ export class WasmDisassembler {
                 for (const exportName of this._exportMetadata.getGlobalExportNames(
                   globalIndex
                 )) {
-                  this.appendBuffer(` (export "${exportName}")`);
+                  this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
                 }
               }
               this.appendBuffer(` (import `);
@@ -1364,7 +1385,7 @@ export class WasmDisassembler {
                 for (const exportName of this._exportMetadata.getMemoryExportNames(
                   memoryIndex
                 )) {
-                  this.appendBuffer(` (export "${exportName}")`);
+                  this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
                 }
               }
               this.appendBuffer(` (import `);
@@ -1387,7 +1408,7 @@ export class WasmDisassembler {
                 for (const exportName of this._exportMetadata.getTableExportNames(
                   tableIndex
                 )) {
-                  this.appendBuffer(` (export "${exportName}")`);
+                  this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
                 }
               }
               this.appendBuffer(` (import `);
@@ -1410,7 +1431,7 @@ export class WasmDisassembler {
                 for (const exportName of this._exportMetadata.getEventExportNames(
                   eventIndex
                 )) {
-                  this.appendBuffer(` (export "${exportName}")`);
+                  this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
                 }
               }
               this.appendBuffer(` (import `);
@@ -1468,7 +1489,7 @@ export class WasmDisassembler {
             for (const exportName of this._exportMetadata.getGlobalExportNames(
               globalIndex
             )) {
-              this.appendBuffer(` (export "${exportName}")`);
+              this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
             }
           }
           this.appendBuffer(` ${this.globalTypeToString(globalInfo.type)}`);
@@ -1483,18 +1504,34 @@ export class WasmDisassembler {
           this._types.push(typeEntry);
           if (!this._skipTypes) {
             var typeName = this._nameResolver.getTypeName(typeIndex, false);
+            var superTypeName = undefined;
+            if (typeEntry.supertype !== undefined) {
+              superTypeName = this.typeIndexToString(typeEntry.supertype);
+            }
             if (typeEntry.form === TypeKind.func) {
               this.appendBuffer(`  (type ${typeName} (func`);
               this.printFuncType(typeIndex);
               this.appendBuffer("))");
+            } else if (typeEntry.form === TypeKind.func_subtype) {
+              this.appendBuffer(`  (type ${typeName} (func_subtype`);
+              this.printFuncType(typeIndex);
+              this.appendBuffer(` (supertype ${superTypeName})))`);
             } else if (typeEntry.form === TypeKind.struct) {
               this.appendBuffer(`  (type ${typeName} (struct`);
               this.printStructType(typeIndex);
               this.appendBuffer("))");
+            } else if (typeEntry.form === TypeKind.struct_subtype) {
+              this.appendBuffer(`  (type ${typeName} (struct_subtype`);
+              this.printStructType(typeIndex);
+              this.appendBuffer(` (supertype ${superTypeName})))`);
             } else if (typeEntry.form === TypeKind.array) {
               this.appendBuffer(`  (type ${typeName} (array`);
               this.printArrayType(typeIndex);
               this.appendBuffer("))");
+            } else if (typeEntry.form === TypeKind.array_subtype) {
+              this.appendBuffer(`  (type ${typeName} (array_subtype`);
+              this.printArrayType(typeIndex);
+              this.appendBuffer(`) (supertype ${superTypeName})))`);
             } else {
               throw new Error(`Unknown type form: ${typeEntry.form}`);
             }
@@ -1575,7 +1612,7 @@ export class WasmDisassembler {
             for (const exportName of this._exportMetadata.getFunctionExportNames(
               this._funcIndex
             )) {
-              this.appendBuffer(` (export "${exportName}")`);
+              this.appendBuffer(` (export ${JSON.stringify(exportName)})`);
             }
           }
           for (var i = 0; i < type.params.length; i++) {

package/front_end/third_party/wasmparser/package/src/WasmParser.ts

@@ -434,10 +434,10 @@ export const enum OperatorCode {
   i8x16_bitmask = 0xfd64,
   i8x16_narrow_i16x8_s = 0xfd65,
   i8x16_narrow_i16x8_u = 0xfd66,
-  f32x4_ceil = 0x67,
-  f32x4_floor = 0x68,
-  f32x4_trunc = 0x69,
-  f32x4_nearest = 0x6a,
+  f32x4_ceil = 0xfd67,
+  f32x4_floor = 0xfd68,
+  f32x4_trunc = 0xfd69,
+  f32x4_nearest = 0xfd6a,
   i8x16_shl = 0xfd6b,
   i8x16_shr_s = 0xfd6c,
   i8x16_shr_u = 0xfd6d,
@@ -575,6 +575,8 @@ export const enum OperatorCode {
   struct_get_s = 0xfb04,
   struct_get_u = 0xfb05,
   struct_set = 0xfb06,
+  struct_new = 0xfb07,
+  struct_new_default = 0xfb08,
   array_new_with_rtt = 0xfb11,
   array_new_default_with_rtt = 0xfb12,
   array_get = 0xfb13,
@@ -583,6 +585,10 @@ export const enum OperatorCode {
   array_set = 0xfb16,
   array_len = 0xfb17,
   array_copy = 0xfb18, // Non-standard experiment in V8.
+  array_init = 0xfb19,
+  array_init_static = 0xfb1a,
+  array_new = 0xfb1b,
+  array_new_default = 0xfb1c,
   i31_new = 0xfb20,
   i31_get_s = 0xfb21,
   i31_get_u = 0xfb22,
@@ -590,9 +596,13 @@ export const enum OperatorCode {
   rtt_sub = 0xfb31,
   rtt_fresh_sub = 0xfb32, // Non-standard experiment in V8.
   ref_test = 0xfb40,
+  ref_test_static = 0xfb44,
   ref_cast = 0xfb41,
+  ref_cast_static = 0xfb45,
   br_on_cast = 0xfb42,
+  br_on_cast_static = 0xfb46,
   br_on_cast_fail = 0xfb43,
+  br_on_cast_static_fail = 0xfb47,
   ref_is_func = 0xfb50,
   ref_is_data = 0xfb51,
   ref_is_i31 = 0xfb52,
@@ -1240,6 +1250,8 @@ OperatorCodeNames[0xfb03] = "struct.get";
 OperatorCodeNames[0xfb04] = "struct.get_s";
 OperatorCodeNames[0xfb05] = "struct.get_u";
 OperatorCodeNames[0xfb06] = "struct.set";
+OperatorCodeNames[0xfb07] = "struct.new";
+OperatorCodeNames[0xfb08] = "struct.new_default";
 OperatorCodeNames[0xfb11] = "array.new_with_rtt";
 OperatorCodeNames[0xfb12] = "array.new_default_with_rtt";
 OperatorCodeNames[0xfb13] = "array.get";
@@ -1248,6 +1260,10 @@ OperatorCodeNames[0xfb15] = "array.get_u";
 OperatorCodeNames[0xfb16] = "array.set";
 OperatorCodeNames[0xfb17] = "array.len";
 OperatorCodeNames[0xfb18] = "array.copy";
+OperatorCodeNames[0xfb19] = "array.init";
+OperatorCodeNames[0xfb1a] = "array.init_static";
+OperatorCodeNames[0xfb1b] = "array.new";
+OperatorCodeNames[0xfb1c] = "array.new_default";
 OperatorCodeNames[0xfb20] = "i31.new";
 OperatorCodeNames[0xfb21] = "i31.get_s";
 OperatorCodeNames[0xfb22] = "i31.get_u";
@@ -1258,6 +1274,10 @@ OperatorCodeNames[0xfb40] = "ref.test";
 OperatorCodeNames[0xfb41] = "ref.cast";
 OperatorCodeNames[0xfb42] = "br_on_cast";
 OperatorCodeNames[0xfb43] = "br_on_cast_fail";
+OperatorCodeNames[0xfb44] = "ref.test_static";
+OperatorCodeNames[0xfb45] = "ref.cast_static";
+OperatorCodeNames[0xfb46] = "br_on_cast_static";
+OperatorCodeNames[0xfb47] = "br_on_cast_static_fail";
 OperatorCodeNames[0xfb50] = "ref.is_func";
 OperatorCodeNames[0xfb51] = "ref.is_data";
 OperatorCodeNames[0xfb52] = "ref.is_i31";
@@ -1300,6 +1320,9 @@ export const enum TypeKind {
   func = -0x20,
   struct = -0x21,
   array = -0x22,
+  func_subtype = -0x23,
+  struct_subtype = -0x24,
+  array_subtype = -0x25,
   empty_block_type = -0x40,
 }
 export class Type {
@@ -1610,13 +1633,15 @@ export interface IFunctionEntry {
   typeIndex: number;
 }
 export interface ITypeEntry {
-  form: number; // func | struct | array
+  // func | struct | array | func_subtype | struct_subtype | array_subtype
+  form: number;
   params?: Type[]; // For function types.
   returns?: Type[]; // For function types.
   fields?: Type[]; // For struct types.
   mutabilities?: boolean[]; // For struct types.
   elementType?: Type; // For array types.
   mutability?: boolean; // For array types.
+  supertype?: number; // For *_subtype types.
 }
 export interface ISectionInformation {
   id: SectionCode;
@@ -1961,6 +1986,12 @@ export class BinaryReader {
       returns: returnTypes,
     };
   }
+  private readFuncSubtype(): ITypeEntry {
+    var result = this.readFuncType();
+    result.form = TypeKind.func_subtype;
+    result.supertype = this.readHeapType();
+    return result;
+  }
   private readStructType(): ITypeEntry {
     var fieldCount = this.readVarUint32() >>> 0;
     var fieldTypes = new Array(fieldCount);
@@ -1975,6 +2006,12 @@ export class BinaryReader {
       mutabilities: fieldMutabilities,
     };
   }
+  private readStructSubtype(): ITypeEntry {
+    var result = this.readStructType();
+    result.form = TypeKind.struct_subtype;
+    result.supertype = this.readHeapType();
+    return result;
+  }
   private readArrayType(): ITypeEntry {
     var elementType = this.readType();
     var mutability = !!this.readVarUint1();
@@ -1984,6 +2021,12 @@ export class BinaryReader {
       mutability: mutability,
     };
   }
+  private readArraySubtype(): ITypeEntry {
+    var result = this.readArrayType();
+    result.form = TypeKind.array_subtype;
+    result.supertype = this.readHeapType();
+    return result;
+  }
   private readResizableLimits(maxPresent: boolean): IResizableLimits {
     var initial = this.readVarUint32() >>> 0;
     var maximum;
@@ -2038,12 +2081,21 @@ export class BinaryReader {
       case TypeKind.func:
         this.result = this.readFuncType();
         break;
+      case TypeKind.func_subtype:
+        this.result = this.readFuncSubtype();
+        break;
       case TypeKind.struct:
         this.result = this.readStructType();
         break;
+      case TypeKind.struct_subtype:
+        this.result = this.readStructSubtype();
+        break;
       case TypeKind.array:
         this.result = this.readArrayType();
         break;
+      case TypeKind.array_subtype:
+        this.result = this.readArraySubtype();
+        break;
       default:
         throw new Error(`Unknown type kind: ${form}`);
     }
@@ -2520,18 +2572,29 @@ export class BinaryReader {
       case OperatorCode.br_on_non_i31:
         brDepth = this.readVarUint32() >>> 0;
         break;
+      case OperatorCode.br_on_cast_static:
+      case OperatorCode.br_on_cast_static_fail:
+        brDepth = this.readVarUint32() >>> 0;
+        refType = this.readHeapType();
+        break;
       case OperatorCode.array_get:
       case OperatorCode.array_get_s:
       case OperatorCode.array_get_u:
       case OperatorCode.array_len:
       case OperatorCode.array_set:
+      case OperatorCode.array_new:
       case OperatorCode.array_new_with_rtt:
+      case OperatorCode.array_new_default:
       case OperatorCode.array_new_default_with_rtt:
+      case OperatorCode.struct_new:
       case OperatorCode.struct_new_with_rtt:
+      case OperatorCode.struct_new_default:
       case OperatorCode.struct_new_default_with_rtt:
       case OperatorCode.rtt_canon:
       case OperatorCode.rtt_sub:
       case OperatorCode.rtt_fresh_sub:
+      case OperatorCode.ref_test_static:
+      case OperatorCode.ref_cast_static:
         refType = this.readHeapType();
         break;
       case OperatorCode.array_copy:
@@ -2545,6 +2608,13 @@ export class BinaryReader {
         refType = this.readHeapType();
         fieldIndex = this.readVarUint32();
         break;
+      case OperatorCode.array_init:
+      case OperatorCode.array_init_static:
+        refType = this.readHeapType();
+        // This really is the "length" value. Overload "brDepth" to keep the
+        // IOperatorInformation interface a little leaner.
+        brDepth = this.readVarUint32() >>> 0;
+        break;
       case OperatorCode.ref_is_func:
       case OperatorCode.ref_is_data:
       case OperatorCode.ref_is_i31:

package/front_end/ui/components/icon_button/iconButton.css

@@ -30,6 +30,10 @@
   background-color: var(--legacy-toolbar-hover-bg-color);
 }
 
+.icon-button.icon-button.with-click-handler:active {
+  background-color: var(--color-background-elevation-1);
+}
+
 .icon-button:focus-visible {
   background-color: var(--legacy-toolbar-hover-bg-color);
   border: 1px solid var(--color-details-hairline);

package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspectorPane.ts

@@ -190,12 +190,8 @@ class LinearMemoryInspectorView extends UI.Widget.VBox {
     });
   }
 
-  private memoryRequested(event: Common.EventTarget.EventTargetEvent): void {
-    const {start, end, address} = (event.data as {
-      start: number,
-      end: number,
-      address: number,
-    });
+  private memoryRequested(event: MemoryRequestEvent): void {
+    const {start, end, address} = event.data;
     if (address < start || address >= end) {
       throw new Error('Requested address is out of bounds.');
     }

package/front_end/ui/legacy/FilterBar.ts

@@ -120,7 +120,7 @@ export class FilterBar extends Common.ObjectWrapper.eventMixin<FilterBarEventTyp
     this.stateSetting.set(true);
   }
 
-  private filterChanged(_event: Common.EventTarget.EventTargetEvent): void {
+  private filterChanged(): void {
     this.updateFilterButton();
     this.dispatchEventToListeners(FilterBarEvents.Changed);
   }

package/front_end/ui/legacy/GlassPane.ts

@@ -2,7 +2,6 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import * as Common from '../../core/common/common.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as Utils from './utils/utils.js';
 
@@ -12,7 +11,7 @@ import {deepElementFromEvent} from './UIUtils.js';
 import type {WidgetElement} from './Widget.js';
 import {Widget} from './Widget.js';
 
-export class GlassPane extends Common.ObjectWrapper.ObjectWrapper {
+export class GlassPane {
   private readonly widgetInternal: Widget;
   element: WidgetElement;
   contentElement: HTMLDivElement;
@@ -28,7 +27,6 @@ export class GlassPane extends Common.ObjectWrapper.ObjectWrapper {
   private marginBehavior: MarginBehavior;
 
   constructor() {
-    super();
     this.widgetInternal = new Widget(true);
     this.widgetInternal.markAsRoot();
     this.element = this.widgetInternal.element;

package/front_end/ui/legacy/SplitWidget.ts

@@ -823,7 +823,7 @@ export class SplitWidget extends Common.ObjectWrapper.eventMixin<EventTypes, typ
     this.showHideSidebarButton.addEventListener(ToolbarButton.Events.Click, buttonClicked, this);
     this.updateShowHideSidebarButton();
 
-    function buttonClicked(this: SplitWidget, _event: Common.EventTarget.EventTargetEvent): void {
+    function buttonClicked(this: SplitWidget): void {
       if (this.showModeInternal !== ShowMode.Both) {
         this.showBoth(true);
       } else {

package/front_end/ui/legacy/UIUtils.ts

@@ -33,7 +33,7 @@
  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-import * as Common from '../../core/common/common.js';
+import type * as Common from '../../core/common/common.js';
 import * as DOMExtension from '../../core/dom_extension/dom_extension.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
@@ -949,7 +949,7 @@ export function animateFunction(
   return (): void => window.cancelAnimationFrame(raf);
 }
 
-export class LongClickController extends Common.ObjectWrapper.ObjectWrapper {
+export class LongClickController {
   private readonly element: Element;
   private readonly callback: (arg0: Event) => void;
   private readonly editKey: (arg0: Event) => boolean;
@@ -963,7 +963,6 @@ export class LongClickController extends Common.ObjectWrapper.ObjectWrapper {
   constructor(
       element: Element, callback: (arg0: Event) => void,
       isEditKeyFunc: (arg0: Event) => boolean = (event): boolean => isEnterOrSpaceKey(event)) {
-    super();
     this.element = element;
     this.callback = callback;
     this.editKey = isEditKeyFunc;
@@ -1516,7 +1515,7 @@ export function addReferrerToURL(url: string): string {
  * 'web.dev' or 'developers.google.com'.
  */
 export function addReferrerToURLIfNecessary(url: string): string {
-  if (/(\/\/developers.google.com\/|\/\/web.dev\/)/.test(url)) {
+  if (/(\/\/developers.google.com\/|\/\/web.dev\/|\/\/developer.chrome.com\/)/.test(url)) {
     return addReferrerToURL(url);
   }
   return url;

package/front_end/ui/legacy/components/color_picker/ContrastDetails.ts

@@ -66,7 +66,7 @@ export class ContrastDetails extends Common.ObjectWrapper.ObjectWrapper<EventTyp
   private contrastInfo: ContrastInfo;
   private readonly elementInternal: HTMLElement;
   private readonly toggleMainColorPicker:
-      (arg0?: boolean|undefined, arg1?: Common.EventTarget.EventTargetEvent|undefined) => void;
+      (arg0?: boolean|undefined, arg1?: Common.EventTarget.EventTargetEvent<unknown>|undefined) => void;
   private readonly expandedChangedCallback: () => void;
   private readonly colorSelectedCallback: (arg0: Common.Color.Color) => void;
   private expandedInternal: boolean;
@@ -94,7 +94,7 @@ export class ContrastDetails extends Common.ObjectWrapper.ObjectWrapper<EventTyp
   constructor(
       contrastInfo: ContrastInfo, contentElement: Element,
       toggleMainColorPickerCallback:
-          (arg0?: boolean|undefined, arg1?: Common.EventTarget.EventTargetEvent|undefined) => void,
+          (arg0?: boolean|undefined, arg1?: Common.EventTarget.EventTargetEvent<unknown>|undefined) => void,
       expandedChangedCallback: () => void, colorSelectedCallback: (arg0: Common.Color.Color) => void) {
     super();
     this.contrastInfo = contrastInfo;
@@ -376,7 +376,7 @@ export class ContrastDetails extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     return this.elementInternal;
   }
 
-  private expandButtonClicked(_event: Common.EventTarget.EventTargetEvent): void {
+  private expandButtonClicked(): void {
     const selection = this.contrastValueBubble.getComponentSelection();
     if (selection) {
       selection.empty();

package/front_end/ui/legacy/components/color_picker/Spectrum.ts

@@ -1164,7 +1164,7 @@ export class Spectrum extends Common.ObjectWrapper.eventMixin<EventTypes, typeof
     }
   }
 
-  private toggleColorPicker(enabled?: boolean, _event?: Common.EventTarget.EventTargetEvent): void {
+  private toggleColorPicker(enabled?: boolean): void {
     if (enabled === undefined) {
       enabled = !this.colorPickerButton.toggled();
     }

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

@@ -118,7 +118,7 @@ const elementToPositionMap = new WeakMap<Element, number>();
 
 const elementToIndexMap = new WeakMap<Element, number>();
 
-export class DataGridImpl<T> extends Common.ObjectWrapper.ObjectWrapper {
+export class DataGridImpl<T> extends Common.ObjectWrapper.ObjectWrapper<EventTypes<T>> {
   element: HTMLDivElement;
   private displayName: string;
   private editCallback: ((arg0: any, arg1: string, arg2: any, arg3: any) => any)|undefined;
@@ -224,7 +224,7 @@ export class DataGridImpl<T> extends Common.ObjectWrapper.ObjectWrapper {
     this.topFillerRow = (this.dataTableBody.createChild('tr', 'data-grid-filler-row revealed') as HTMLElement);
     this.bottomFillerRow = (this.dataTableBody.createChild('tr', 'data-grid-filler-row revealed') as HTMLElement);
 
-    this.setVerticalPadding(0, 0);
+    this.setVerticalPadding(0, 0, true);
     this.refreshHeader();
 
     this.editing = false;
@@ -455,7 +455,7 @@ export class DataGridImpl<T> extends Common.ObjectWrapper.ObjectWrapper {
     this.dataTableColumnGroup.createChild('col', 'corner');
   }
 
-  protected setVerticalPadding(top: number, bottom: number): void {
+  protected setVerticalPadding(top: number, bottom: number, isConstructorTime: boolean = false): void {
     const topPx = top + 'px';
     const bottomPx = (top || bottom) ? bottom + 'px' : 'auto';
     if (this.topFillerRow.style.height === topPx && this.bottomFillerRow.style.height === bottomPx) {
@@ -463,7 +463,9 @@ export class DataGridImpl<T> extends Common.ObjectWrapper.ObjectWrapper {
     }
     this.topFillerRow.style.height = topPx;
     this.bottomFillerRow.style.height = bottomPx;
-    this.dispatchEventToListeners(Events.PaddingChanged);
+    if (!isConstructorTime) {
+      this.dispatchEventToListeners(Events.PaddingChanged);
+    }
   }
 
   protected setRootNode(rootNode: DataGridNode<T>): void {
@@ -1516,6 +1518,14 @@ export enum Events {
   PaddingChanged = 'PaddingChanged',
 }
 
+export type EventTypes<T> = {
+  [Events.SelectedNode]: DataGridNode<T>,
+  [Events.DeselectedNode]: void,
+  [Events.OpenedNode]: DataGridNode<T>,
+  [Events.SortingChanged]: void,
+  [Events.PaddingChanged]: void,
+};
+
 // TODO(crbug.com/1167717): Make this a const enum again
 // eslint-disable-next-line rulesdir/const_enum
 export enum Order {
@@ -1552,7 +1562,7 @@ export type DataGridData = {
   [key: string]: any,
 };
 
-export class DataGridNode<T> extends Common.ObjectWrapper.ObjectWrapper {
+export class DataGridNode<T> {
   elementInternal: Element|null;
   expandedInternal: boolean;
   private selectedInternal: boolean;
@@ -1582,7 +1592,6 @@ export class DataGridNode<T> extends Common.ObjectWrapper.ObjectWrapper {
   isCreationNode: boolean;
 
   constructor(data?: DataGridData|null, hasChildren?: boolean) {
-    super();
     this.elementInternal = null;
     this.expandedInternal = false;
     this.selectedInternal = false;

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

@@ -2,6 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as Common from '../../../../core/common/common.js';
 import * as i18n from '../../../../core/i18n/i18n.js';
 import * as Platform from '../../../../core/platform/platform.js';
 import * as UI from '../../legacy.js';
@@ -18,7 +19,8 @@ const UIStrings = {
 const str_ = i18n.i18n.registerUIStrings('ui/legacy/components/data_grid/ViewportDataGrid.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
-export class ViewportDataGrid<T> extends DataGridImpl<ViewportDataGridNode<T>> {
+export class ViewportDataGrid<T> extends Common.ObjectWrapper.eventMixin<EventTypes, typeof DataGridImpl>(
+    DataGridImpl)<ViewportDataGridNode<T>> {
   private readonly onScrollBound: (event: Event|null) => void;
   private visibleNodes: ViewportDataGridNode<T>[];
   stickToBottom: boolean;
@@ -263,6 +265,10 @@ export enum Events {
   ViewportCalculated = 'ViewportCalculated',
 }
 
+export type EventTypes = {
+  [Events.ViewportCalculated]: void,
+};
+
 export class ViewportDataGridNode<T> extends DataGridNode<ViewportDataGridNode<T>> {
   private stale: boolean;
   private flatNodes: ViewportDataGridNode<T>[]|null;

package/front_end/ui/legacy/components/inline_editor/SwatchPopoverHelper.ts

@@ -42,8 +42,12 @@ export class SwatchPopoverHelper extends Common.ObjectWrapper.ObjectWrapper<Even
     this.hideProxy();
   }
 
-  isShowing(): boolean {
-    return this.popover.isShowing();
+  setAnchorElement(anchorElement: Element): void {
+    this.anchorElement = anchorElement;
+  }
+
+  isShowing(view?: UI.Widget.Widget): boolean {
+    return this.popover.isShowing() && ((view && this.view === view) || !view);
   }
 
   show(view: UI.Widget.Widget, anchorElement: Element, hiddenCallback?: ((arg0: boolean) => void)): void {

package/front_end/ui/legacy/components/perf_ui/OverviewGrid.ts

@@ -101,8 +101,8 @@ export class OverviewGrid {
     this.window.setWindow(left, right);
   }
 
-  addEventListener(
-      eventType: string|symbol, listener: (arg0: Common.EventTarget.EventTargetEvent) => void,
+  addEventListener<T extends keyof EventTypes>(
+      eventType: T, listener: Common.EventTarget.EventListener<EventTypes, T>,
       thisObject?: Object): Common.EventTarget.EventDescriptor {
     return this.window.addEventListener(eventType, listener, thisObject);
   }
@@ -125,7 +125,7 @@ export const WindowScrollSpeedFactor = .3;
 export const ResizerOffset = 3.5;  // half pixel because offset values are not rounded but ceiled
 export const OffsetFromWindowEnds = 10;
 
-export class Window extends Common.ObjectWrapper.ObjectWrapper {
+export class Window extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
   private parentElement: Element;
   private calculator: Calculator|undefined;
   private leftResizeElement: HTMLElement;

package/front_end/ui/legacy/components/utils/TargetDetachedDialog.ts

@@ -16,7 +16,7 @@ const UIStrings = {
 };
 const str_ = i18n.i18n.registerUIStrings('ui/legacy/components/utils/TargetDetachedDialog.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
-export class TargetDetachedDialog extends SDK.SDKModel.SDKModel implements ProtocolProxyApi.InspectorDispatcher {
+export class TargetDetachedDialog extends SDK.SDKModel.SDKModel<void> implements ProtocolProxyApi.InspectorDispatcher {
   private static hideCrashedDialog: (() => void)|null;
   constructor(target: SDK.Target.Target) {
     super(target);

package/front_end/ui/legacy/reportView.css

@@ -85,6 +85,7 @@
   flex: auto;
   padding: 0 6px;
   white-space: pre;
+  user-select: text;
 }
 
 .report-field-value-is-flexed {