Skip to content

Make network markers in the network panel sticky on click#5884

Open
fatadel wants to merge 1 commit intofirefox-devtools:mainfrom
fatadel:sticky-markers-5751
Open

Make network markers in the network panel sticky on click#5884
fatadel wants to merge 1 commit intofirefox-devtools:mainfrom
fatadel:sticky-markers-5751

Conversation

@fatadel
Copy link
Contributor

@fatadel fatadel commented Mar 5, 2026

Closes #5751.

When clicking a marker in the Network panel, its tooltip is now persisted, matching the Marker Chart behavior. This enables interaction with tooltip content like copying text or clicking the filter button. The existing behavior of displaying the tooltip on hover is kept as well. Because of that, it should now be easier to compare two markers.

  • Add click coordinate tracking to NetworkChartRow state for sticky tooltip positioning
  • Show filter button only in sticky (clicked) tooltips
  • Toggle selection off when re-clicking the same row
  • Dismiss sticky tooltip on Escape key
  • Add 7 new tests covering the sticky tooltip related behavior

Before / After

@codecov
Copy link

codecov bot commented Mar 5, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 85.42%. Comparing base (0740f14) to head (1cc967a).
⚠️ Report is 19 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #5884      +/-   ##
==========================================
+ Coverage   85.41%   85.42%   +0.01%     
==========================================
  Files         321      321              
  Lines       32037    32058      +21     
  Branches     8728     8823      +95     
==========================================
+ Hits        27365    27387      +22     
+ Misses       4241     4240       -1     
  Partials      431      431              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@fatadel fatadel requested review from canova and mstange and removed request for canova March 5, 2026 10:26
When clicking a marker in the Network panel, its tooltip is now persisted, matching the Marker Chart behavior.
This enables interaction with tooltip content like copying text or clicking the filter button.
The existing behavior of displaying the tooltip on hover is kept as well.
Because of that, it should now be easier to compare two markers.

- Add click coordinate tracking to NetworkChartRow state for sticky tooltip positioning
- Show filter button only in sticky (clicked) tooltips
- Toggle selection off when re-clicking the same row
- Dismiss sticky tooltip on Escape key
- Add 7 new tests covering the sticky tooltip related behavior
@fatadel fatadel force-pushed the sticky-markers-5751 branch from f9b12db to 1cc967a Compare March 5, 2026 13:59
Copy link
Member

@canova canova left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks!
It looks like when the network marker is sticky, we still see another tooltip on top of it, which obstructs the other one. Is it possible to make the other tooltips not visible when there is already a sticky tooltip?

See an example:
Image

I see that we already do this in the marker chart/table. So it might be good to have the same behavior

Show filter button only in sticky (clicked) tooltips

I'm a bit confused by this one. Can we make it visible all the time? This is the current behavior of marker chart too.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Make network markers in the network panel sticky on click

2 participants