chrome-devtools-frontend 1.0.1664496 → 1.0.1665921

package/front_end/panels/profiler/HeapSnapshotDataGrids.ts

@@ -389,6 +389,7 @@ export enum HeapSnapshotSortableDataGridEvents {
   ContentShown = 'ContentShown',
   SortingComplete = 'SortingComplete',
   ExpandRetainersComplete = 'ExpandRetainersComplete',
+  AggregatesReceived = 'AggregatesReceived',
   /* eslint-enable @typescript-eslint/naming-convention */
 }
 
@@ -396,6 +397,7 @@ export interface EventTypes {
   [HeapSnapshotSortableDataGridEvents.ContentShown]: HeapSnapshotSortableDataGrid;
   [HeapSnapshotSortableDataGridEvents.SortingComplete]: void;
   [HeapSnapshotSortableDataGridEvents.ExpandRetainersComplete]: void;
+  [HeapSnapshotSortableDataGridEvents.AggregatesReceived]: {count: number, size: number};
 }
 
 export class HeapSnapshotViewportDataGrid extends HeapSnapshotSortableDataGrid {
@@ -753,6 +755,8 @@ export class HeapSnapshotConstructorsDataGrid extends HeapSnapshotViewportDataGr
   nextRequestedFilter: HeapSnapshotModel.HeapSnapshotModel.NodeFilter|null = null;
   lastFilter?: HeapSnapshotModel.HeapSnapshotModel.NodeFilter|null;
   filterInProgress?: HeapSnapshotModel.HeapSnapshotModel.NodeFilter|null;
+  filterTotalCount?: number;
+  filterTotalSize?: number;
 
   constructor(
       heapProfilerModel: SDK.HeapProfilerModel.HeapProfilerModel|null,
@@ -868,13 +872,19 @@ export class HeapSnapshotConstructorsDataGrid extends HeapSnapshotViewportDataGr
     }
     this.removeTopLevelNodes();
     this.resetSortingCache();
+    this.filterTotalCount = 0;
+    this.filterTotalSize = 0;
     for (const classKey in aggregates) {
-      this.appendNode(
-          (this.rootNode() as HeapSnapshotGridNode),
-          new HeapSnapshotConstructorNode(this, classKey, aggregates[classKey], nodeFilter));
+      const aggregate = aggregates[classKey];
+      this.filterTotalCount += aggregate.count;
+      this.filterTotalSize += aggregate.self;
+      this.appendNode((this.rootNode() as HeapSnapshotGridNode),
+                      new HeapSnapshotConstructorNode(this, classKey, aggregate, nodeFilter));
     }
     this.sortingChanged();
     this.lastFilter = nodeFilter;
+    this.dispatchEventToListeners(HeapSnapshotSortableDataGridEvents.AggregatesReceived,
+                                  {count: this.filterTotalCount, size: this.filterTotalSize});
   }
 
   async populateChildren(maybeNodeFilter?: HeapSnapshotModel.HeapSnapshotModel.NodeFilter): Promise<void> {

package/front_end/panels/profiler/HeapSnapshotView.ts

@@ -107,11 +107,6 @@ const UIStrings = {
    * @description Label on a pie chart in the statistics view for the Heap Snapshot tool
    */
   otherNonJSObjects: 'Other non-JS objects (such as HTML and CSS)',
-  /**
-   * @description The reported total size used in the selected time frame of the allocation sampling profile
-   * @example {3 MB} PH1
-   */
-  selectedSizeS: 'Selected size: {PH1}',
   /**
    * @description Text in Heap Snapshot View of a profiler tool
    */
@@ -283,6 +278,12 @@ const UIStrings = {
    * This text is on a button to undo all previous "Ignore this retainer" actions.
    */
   restoreIgnoredRetainers: 'Restore ignored retainers',
+  /**
+   * @description Text in Heap Snapshot View showing summary stats (count of objects and total shallow size) for the selected filter
+   * @example {1,000} PH1
+   * @example {1.5 MB} PH2
+   */
+  filterSummarySObjectsS: '{PH1} objects ({PH2})',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/profiler/HeapSnapshotView.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -405,6 +406,8 @@ export class HeapSnapshotView extends UI.View.SimpleView implements DataDisplayD
 
     this.constructorsDataGrid = new HeapSnapshotConstructorsDataGrid(heapProfilerModel, this);
     this.constructorsDataGrid.addEventListener(DataGrid.DataGrid.Events.SELECTED_NODE, this.selectionChanged, this);
+    this.constructorsDataGrid.addEventListener(HeapSnapshotSortableDataGridEvents.AggregatesReceived,
+                                               this.#onAggregatesReceived, this);
     this.constructorsWidget = this.constructorsDataGrid.asWidget();
     this.constructorsWidget.setMinimumSize(50, 25);
     this.constructorsWidget.element.setAttribute(
@@ -642,12 +645,12 @@ export class HeapSnapshotView extends UI.View.SimpleView implements DataDisplayD
       {
         value: otherJSObjectsSize,
         color: 'var(--app-color-other-js-objects)',
-        title: i18nString(UIStrings.otherJSObjects)
+        title: i18nString(UIStrings.otherJSObjects),
       },
       {
         value: native.total - native.typedArrays,
         color: 'var(--app-color-other-non-js-objects)',
-        title: i18nString(UIStrings.otherNonJSObjects)
+        title: i18nString(UIStrings.otherNonJSObjects),
       },
     ];
     this.statisticsView.setTotalAndRecords(statistics.total, records);
@@ -702,13 +705,28 @@ export class HeapSnapshotView extends UI.View.SimpleView implements DataDisplayD
 
   onIdsRangeChanged(event: Common.EventTarget.EventTargetEvent<IdsRangeChangedEvent>): void {
     const {minId, maxId} = event.data;
-    this.selectedSizeText.setText(
-        i18nString(UIStrings.selectedSizeS, {PH1: i18n.ByteUtilities.bytesToString(event.data.size)}));
     if (this.constructorsDataGrid.snapshot) {
       this.constructorsDataGrid.setSelectionRange(minId, maxId);
     }
   }
 
+  updateFilterSummaryText(totals?: {count: number, size: number}): void {
+    if (this.currentPerspective instanceof SummaryPerspective) {
+      const totalCount = totals?.count ?? this.constructorsDataGrid.filterTotalCount;
+      const totalSize = totals?.size ?? this.constructorsDataGrid.filterTotalSize;
+      if (totalCount !== undefined && totalSize !== undefined) {
+        this.selectedSizeText.setText(i18nString(UIStrings.filterSummarySObjectsS, {
+          PH1: totalCount.toLocaleString(),
+          PH2: i18n.ByteUtilities.bytesToString(totalSize),
+        }));
+      }
+    }
+  }
+
+  #onAggregatesReceived(event: Common.EventTarget.EventTargetEvent<{count: number, size: number}>): void {
+    this.updateFilterSummaryText(event.data);
+  }
+
   override async toolbarItems(): Promise<UI.Toolbar.ToolbarItem[]> {
     const result: UI.Toolbar.ToolbarItem[] = [this.perspectiveSelect, this.classNameFilter];
     if (this.profile.profileType() !== this.#registry.trackingHeapSnapshotProfileType) {
@@ -869,7 +887,7 @@ export class HeapSnapshotView extends UI.View.SimpleView implements DataDisplayD
       {uiName: i18nString(UIStrings.duplicatedStrings), filterName: 'duplicatedStrings'},
       {
         uiName: i18nString(UIStrings.objectsRetainedByDetachedDomNodes),
-        filterName: 'objectsRetainedByDetachedDomNodes'
+        filterName: 'objectsRetainedByDetachedDomNodes',
       },
       {uiName: i18nString(UIStrings.objectsRetainedByContexts), filterName: 'objectsRetainedByContexts'},
       {uiName: i18nString(UIStrings.objectsRetainedByConsole), filterName: 'objectsRetainedByConsole'},
@@ -1216,6 +1234,7 @@ export class Perspective {
     heapSnapshotView.baseSelect.setVisible(false);
     heapSnapshotView.filterSelect.setVisible(false);
     heapSnapshotView.classNameFilter.setVisible(false);
+    heapSnapshotView.selectedSizeText.setText('');
     if (heapSnapshotView.trackingOverviewGrid) {
       heapSnapshotView.trackingOverviewGrid.detach();
     }
@@ -1254,6 +1273,7 @@ export class SummaryPerspective extends Perspective {
     heapSnapshotView.splitWidget.show(heapSnapshotView.searchableViewInternal.element);
     heapSnapshotView.filterSelect.setVisible(true);
     heapSnapshotView.classNameFilter.setVisible(true);
+    heapSnapshotView.updateFilterSummaryText();
     if (!heapSnapshotView.trackingOverviewGrid) {
       return;
     }

package/front_end/panels/profiler/HeapTimelineOverview.ts

@@ -28,8 +28,8 @@ export class HeapTimelineOverview extends Common.ObjectWrapper.eventMixin<EventT
   updateGridTimerId?: number;
   updateTimerId?: number|null;
   windowWidthRatio?: number;
-  constructor() {
-    super({jslog: `${VisualLogging.section('heap-tracking-overview')}`});
+  constructor(element?: HTMLElement) {
+    super(element, {jslog: `${VisualLogging.section('heap-tracking-overview')}`});
     this.element.id = 'heap-recording-view';
     this.element.classList.add('heap-tracking-overview');
 
@@ -218,6 +218,9 @@ export class HeapTimelineOverview extends Common.ObjectWrapper.eventMixin<EventT
     this.windowRightRatio = this.overviewGrid.windowRightRatio();
     this.windowWidthRatio = this.windowRightRatio - this.windowLeftRatio;
   }
+  override performUpdate(): void {
+    this.update();
+  }
 
   update(): void {
     this.updateTimerId = null;