zzos/react-native-devtools-frontend
1
0
Fork 0
mirror of https://github.com/react/react-native-devtools-frontend.git synced 2026-09-30 01:07:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

[RPP] Update the initiator when an entry is revealed

Browse Source 
Bug: none
Change-Id: I3bb4b7e1d3d4665b560e97a0ccd7d0a74d44d32b
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6280787
Reviewed-by: Adam Raine <asraine@chromium.org>
Commit-Queue: Nancy Li <nancyly@chromium.org>
This commit is contained in:
Nancy Li
2025-02-20 05:33:14 -08:00
committed by Devtools-frontend LUCI CQ
parent 9a5496d7e8
commit d593a7bbb3
2 changed files with 19 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front_end/panels/timeline/TimelineFlameChartView.ts
+19 -8
View File
@@ -17,6 +17,7 @@ import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
import {getAnnotationEntries, getAnnotationWindow} from './AnnotationHelpers.js';
import type * as TimelineComponents from './components/components.js';
import * as TimelineInsights from './components/insights/insights.js';
import {CountersGraph} from './CountersGraph.js';
import {SHOULD_SHOW_EASTER_EGG} from './EasterEgg.js';
import {ModificationsManager} from './ModificationsManager.js';
@@ -410,12 +411,19 @@ export class TimelineFlameChartView extends Common.ObjectWrapper.eventMixin<Even
this.updateLinkSelectionAnnotationWithToEntry(this.networkDataProvider, event.data);
}, this);
// This listener is used for timings marker, when they are clicked, open the details view for them. They are
// rendered in the overlays system, not in flame chart (canvas), so need this extra handling.
this.#overlays.addEventListener(Overlays.Overlays.EventReferenceClick.eventName, event => {
const eventRef = (event as Overlays.Overlays.EventReferenceClick);
const fromTraceEvent = selectionFromEvent(eventRef.event);
this.openSelectionDetailsView(fromTraceEvent);
});
// This is for the detail view of layout shift.
this.element.addEventListener(TimelineInsights.EventRef.EventReferenceClick.eventName, event => {
this.setSelectionAndReveal(selectionFromEvent(event.event));
});
this.element.addEventListener('keydown', this.#keydownHandler.bind(this));
this.element.addEventListener('pointerdown', this.#pointerDownHandler.bind(this));
this.#boundRefreshAfterIgnoreList = this.#refreshAfterIgnoreList.bind(this);
@@ -1361,10 +1369,6 @@ export class TimelineFlameChartView extends Common.ObjectWrapper.eventMixin<Even
setSelectionAndReveal(selection: TimelineSelection|null): void {
this.#currentSelection = selection;
const mainIndex = this.mainDataProvider.entryIndexForSelection(selection);
const networkIndex = this.networkDataProvider.entryIndexForSelection(selection);
this.mainFlameChart.setSelectedEntry(mainIndex);
this.networkFlameChart.setSelectedEntry(networkIndex);
// Clear any existing entry selection.
this.#overlays.removeOverlaysOfType('ENTRY_SELECTED');
@@ -1379,10 +1383,17 @@ export class TimelineFlameChartView extends Common.ObjectWrapper.eventMixin<Even
this.#timeRangeSelectionAnnotation = null;
}
let index = this.mainDataProvider.entryIndexForSelection(selection);
this.mainFlameChart.setSelectedEntry(index);
index = this.networkDataProvider.entryIndexForSelection(selection);
this.networkFlameChart.setSelectedEntry(index);
// Check if this is an entry from main flame chart or network flame chart.
// If so build the initiators and select the entry.
// Otherwise clear the initiators and the selection.
// - This is done by the same functions, when the index is -1, it will clear everything.
const mainIndex = this.mainDataProvider.entryIndexForSelection(selection);
this.mainDataProvider.buildFlowForInitiator(mainIndex);
this.mainFlameChart.setSelectedEntry(mainIndex);
const networkIndex = this.networkDataProvider.entryIndexForSelection(selection);
this.networkDataProvider.buildFlowForInitiator(networkIndex);
this.networkFlameChart.setSelectedEntry(networkIndex);
if (this.detailsView) {
// TODO(crbug.com/1459265): Change to await after migration work.
void this.detailsView.setSelection(selection);
front_end/panels/timeline/TimelinePanel.ts
-5
View File
@@ -660,11 +660,6 @@ export class TimelinePanel extends UI.Panel.Panel implements Client, TimelineMod
}
});
this.flameChart.element.addEventListener(TimelineInsights.EventRef.EventReferenceClick.eventName, event => {
const fromTraceEvent = selectionFromEvent(event.event);
this.flameChart.setSelectionAndReveal(fromTraceEvent);
});
this.#sideBar.contentElement.addEventListener(TimelineInsights.EventRef.EventReferenceClick.eventName, event => {
this.select(selectionFromEvent(event.event));
});