RPP: fix 1/3P data table having first row selected by default

Turns out we have some logic to auto select rows. I don't know if we
need it, but it was a deliberate change for a11y reasons, so I don't
want to remove that functionality. So I've added a flag such that we can
disable it for this table.

Bug: 383567961
Change-Id: I7ab73e5f95e33cdf825476ad69a5897397f52772
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6198201
Auto-Submit: Jack Franklin <[email protected]>
Reviewed-by: Adriana Ixba <[email protected]>
Commit-Queue: Adriana Ixba <[email protected]>

Author: jackfranklin

front_end/panels/timeline/ThirdPartyTreeView.test.ts

@@ -5,12 +5,27 @@
 import type * as Trace from '../../models/trace/trace.js';
 import {describeWithEnvironment} from '../../testing/EnvironmentHelpers.js';
 import {TraceLoader} from '../../testing/TraceLoader.js';
+import * as UI from '../../ui/legacy/legacy.js';
 
 import * as Timeline from './timeline.js';
 import * as Utils from './utils/utils.js';
 
 describeWithEnvironment('TimelineTreeView', function() {
   describe('Third party tree', function() {
+    it('does not select the first row by default', async function() {
+      const {parsedTrace} = await TraceLoader.traceEngine(this, 'web-dev-with-commit.json.gz');
+      const treeView = new Timeline.ThirdPartyTreeView.ThirdPartyTreeViewWidget();
+      const mapper = new Utils.EntityMapper.EntityMapper(parsedTrace);
+      const events = [...mapper.mappings().eventsByEntity.values()].flat();
+      treeView.setModelWithEvents(events, parsedTrace, mapper);
+      const sel: Timeline.TimelineSelection.TimeRangeSelection = {
+        bounds: parsedTrace.Meta.traceBounds,
+      };
+      const box = new UI.Widget.VBox();
+      treeView.show(box.element);
+      treeView.updateContents(sel);
+      assert.isNull(treeView.dataGrid.selectedNode);
+    });
     it('includes 1p and extension badges', async function() {
       // This trace creates 2 nodes in the tree. One representing the first party entity, and one for
       // a chrome extension.

front_end/panels/timeline/ThirdPartyTreeView.ts

@@ -37,6 +37,11 @@ export class ThirdPartyTreeViewWidget extends TimelineTreeView.TimelineTreeView
     entityByEvent: Map<Trace.Types.Events.Event, Trace.Extras.ThirdParties.Entity>,
   }|null = null;
 
+  // By default the TimelineTreeView will auto-select the first row
+  // when the grid is refreshed but for the ThirdParty view we only
+  // want to do this when the user hovers.
+  protected override autoSelectFirstChildOnRefresh = false;
+
   constructor() {
     super();
     this.element.setAttribute('jslog', `${VisualLogging.pane('third-party-tree').track({hover: true})}`);

front_end/panels/timeline/TimelineTreeView.ts

@@ -194,6 +194,12 @@ export class TimelineTreeView extends
   #lastHighlightedEvent: HTMLElement|null = null;
   eventToTreeNode: WeakMap<Trace.Types.Events.Event, Trace.Extras.TraceTree.Node> = new WeakMap();
 
+  /**
+   * Determines if the first child in the data grid will be selected
+   * by default when refreshTree() gets called.
+   */
+  protected autoSelectFirstChildOnRefresh = true;
+
   constructor() {
     super();
     this.#selectedEvents = null;
@@ -279,8 +285,6 @@ export class TimelineTreeView extends
     this.splitWidget.hideSidebar();
     this.splitWidget.show(this.element);
     this.splitWidget.addEventListener(UI.SplitWidget.Events.SHOW_MODE_CHANGED, this.onShowModeChanged, this);
-
-    this.lastSelectedNodeInternal;
   }
 
   lastSelectedNode(): Trace.Extras.TraceTree.Node|null|undefined {
@@ -424,7 +428,7 @@ export class TimelineTreeView extends
       this.searchableView.refreshSearch();
     }
     const rootNode = this.dataGrid.rootNode();
-    if (rootNode.children.length > 0) {
+    if (this.autoSelectFirstChildOnRefresh && rootNode.children.length > 0) {
       rootNode.children[0].select(/* supressSelectedEvent */ true);
     }
   }