Skip to content

Adds deep linking component from Chrome Performance panel#68201

Open
SkyZeroZx wants to merge 2 commits intoangular:mainfrom
SkyZeroZx:track-component-devtools
Open

Adds deep linking component from Chrome Performance panel#68201
SkyZeroZx wants to merge 2 commits intoangular:mainfrom
SkyZeroZx:track-component-devtools

Conversation

@SkyZeroZx
Copy link
Copy Markdown
Contributor

Enables direct navigation to Angular components from the Chrome Performance panel's flame graph.

This feature integrates Angular DevTools with Chrome's setOpenResourceHandler by registering a custom URL scheme (angular-devtools://component/{instanceId}).

Closes #63960

What is the new behavior?

Using the chrome://flags/#enable-devtools-deep-link-via-extensibility-api flag, we enabled deep linking in the Performance panel, allowing navigation to the corresponding component.

demo.mp4

Other information

I'm just unsure whether we should show the generated component ID or hide it. I think it's probably fine to leave it as is if we specify it's only for the performance panel.

image

Introduces unique, IDs for component instances during profiling.

Embeds these instance IDs into custom `angular-devtools://component/ID` URLs for component and lifecycle hook events recorded in Chrome's Performance panel. This allows users, when deep linking is enabled, to click on a component event in the timeline summary and navigate directly to that specific component instance in the Angular DevTools extension.

Closes angular#63960
Enables direct navigation to Angular components from the Chrome Performance panel's flame graph.

This feature integrates Angular DevTools with Chrome's `setOpenResourceHandler` by registering a custom URL scheme (`angular-devtools://component/{instanceId}`).

Closes angular#63960
@angular-robot angular-robot bot added detected: feature PR contains a feature commit area: core Issues related to the framework runtime area: devtools labels Apr 14, 2026
@ngbot ngbot bot added this to the Backlog milestone Apr 14, 2026
@pullapprove pullapprove bot requested review from atscott and dgp1130 April 14, 2026 15:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area: core Issues related to the framework runtime area: devtools detected: feature PR contains a feature commit

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Deep Link Performance Panel to Component in Angular DevTools

1 participant