Do not refresh the data grid node on selection

`refresh()` recreates the table cells, which is not only is expensive and unnecessary, but caused focus to be lost.

Bug: 394287937
Change-Id: I838451513a2ca2aae6e39c3833d96117155dccd8
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6226109
Auto-Submit: Danil Somsikov <[email protected]>
Reviewed-by: Benedikt Meurer <[email protected]>
Commit-Queue: Benedikt Meurer <[email protected]>

Author: danilsomsikov

front_end/ui/legacy/components/data_grid/DataGridElement.ts

@@ -240,11 +240,19 @@ class DataGridElement extends HTMLElement {
     }
   }
 
-  #updateNode(node: Node): void {
+  #updateNode(node: Node, selectionOnly: boolean): void {
     const dataRow = node instanceof HTMLElement ? node.closest('tr') : null;
     const dataGridNode = dataRow ? DataGridElementNode.get(dataRow) : null;
     if (dataGridNode) {
-      dataGridNode.refresh();
+      if (selectionOnly) {
+        if (dataRow?.hasAttribute('selected')) {
+          dataGridNode.select();
+        } else {
+          dataGridNode.deselect();
+        }
+      } else {
+        dataGridNode.refresh();
+      }
     }
   }
 
@@ -256,7 +264,7 @@ class DataGridElement extends HTMLElement {
     for (const mutation of mutationList) {
       this.#removeNodes(mutation.removedNodes);
       this.#addNodes(mutation.addedNodes);
-      this.#updateNode(mutation.target);
+      this.#updateNode(mutation.target, mutation.attributeName === 'selected');
     }
   }
 
@@ -280,6 +288,9 @@ class DataGridElementNode extends SortableDataGridNode<DataGridElementNode> {
     DataGridElementNode.#elementToNode.set(configElement, this);
     this.#dataGridElement = dataGridElement;
     this.#updateData();
+    if (this.#configElement.hasAttribute('selected')) {
+      this.select();
+    }
   }
 
   static get(configElement: Element|undefined): DataGridElementNode|undefined {
@@ -297,9 +308,6 @@ class DataGridElementNode extends SortableDataGridNode<DataGridElementNode> {
       const columnId = this.#dataGridElement.columnsOrder[i];
       this.data[columnId] = cell.dataset.value ?? cell.textContent ?? '';
     }
-    if (this.#configElement.hasAttribute('selected')) {
-      this.select();
-    }
   }
 
   override createElement(): HTMLElement {