Commit a2505767 authored by Brandon Goddard's avatar Brandon Goddard Committed by Commit Bot

Devtools: Fix Keyboard Navigation of Network Group Framed Nodes

In the network tool, selecting the "Group by Frame" option will
group several requests under their parent iframe. When navigating
the network data grid using a keyboard, reaching a group frame node
with the arrow keys will cause the node to expand and collapse instead
of select. This prevents navigation to the children or the rest of the
requests under the table.

This CL addresses the issue by allowing selection of group frame nodes.
Since selection === open the sidepane, the group frame node defaults
to displaying the first child request in the sidepane when selected,
Similar to how the waterfall column displays

Also, Clicking on a group frame node name now selects instead of expanding.
The node can be expanded by clicking in the "disclosure" triangle to
the left of the name, which is the behavior in the rest of the datagrids
in the devtools.

Before: https://imgur.com/gMGgTkd

After: https://imgur.com/AyMHnba

Bug: 1007508
Change-Id: Ibb4063e90aefde96129108e7e44b76cac611741e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1823721Reviewed-by: default avatarJohn Emau <John.Emau@microsoft.com>
Reviewed-by: default avatarLorne Mitchell <lomitch@microsoft.com>
Commit-Queue: Brandon Goddard <brgoddar@microsoft.com>
Cr-Commit-Position: refs/heads/master@{#704244}
parent 4a2aeb35
......@@ -1075,10 +1075,11 @@ Network.NetworkGroupNode = class extends Network.NetworkNode {
* @param {boolean=} supressSelectedEvent
*/
select(supressSelectedEvent) {
if (this.expanded) {
this.collapse();
return;
super.select(supressSelectedEvent);
const firstChildNode = this.traverseNextNode(false, true);
if (firstChildNode && firstChildNode.request()) {
this.parentView().dispatchEventToListeners(
Network.NetworkLogView.Events.RequestSelected, firstChildNode.request());
}
this.expand();
}
};
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment