Skip to content

Add toggle to filter out SOCKET rows in Network screen#9698

Merged
kenzieschmoll merged 10 commits into
flutter:masterfrom
rishika0212:network-socket-filter-toggle
Mar 13, 2026
Merged

Add toggle to filter out SOCKET rows in Network screen#9698
kenzieschmoll merged 10 commits into
flutter:masterfrom
rishika0212:network-socket-filter-toggle

Conversation

@rishika0212

Copy link
Copy Markdown
Contributor

Description:
This PR adds a toolbar toggle to the Network screen, allowing users to hide TCP socket rows associated with HTTP profiled requests. When enabled, only HTTP requests are shown, resulting in a cleaner and more focused view. This feature addresses user feedback and resolves #9460.

  • Adds LAN icon toggle to Network screen toolbar
  • Updates filtering logic in NetworkController
  • Includes unit tests for toggle behavior
  • Analytics event for toggle usage

Before:
All HTTP and socket rows were shown, making the table noisy.

After:
Users can toggle to hide socket rows, showing only HTTP requests.

Issue fixed:
Fixes #9460

Release notes:
Added a note to NEXT_RELEASE_NOTES.md.

Pre-launch Checklist

  • I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • I read the Tree Hygiene wiki page, which explains my responsibilities.
  • I read the Flutter Style Guide recently, and have followed its advice.
  • I signed the CLA.
  • I listed at least one issue that this PR fixes in the description above.
  • I updated/added relevant documentation (doc comments with ///).
  • I added new tests to check the change I am making, or there is a reason for not adding tests.

build.yaml badge

If you need help, consider asking for help on Discord.

@rishika0212 rishika0212 requested review from a team, bkonyi and kenzieschmoll as code owners March 11, 2026 12:30
@kenzieschmoll

Copy link
Copy Markdown
Member

Hi @rishika0212, thank you for the contribution. We actually already have a convention within DevTools to add toggle filters like this. Please see #9460 (comment) for details, I added some code pointers on the issue detailing how to integrate with the existing toggle filter mechanism. If you can adjust this PR to follow the pattern described there, we'd be happy to review this change. Thanks!

@rishika0212

Copy link
Copy Markdown
Contributor Author

Hi @rishika0212, thank you for the contribution. We actually already have a convention within DevTools to add toggle filters like this. Please see #9460 (comment) for details, I added some code pointers on the issue detailing how to integrate with the existing toggle filter mechanism. If you can adjust this PR to follow the pattern described there, we'd be happy to review this change. Thanks!

Thanks for the pointers!
I've reworked the implementation to follow the SettingFilters / ToggleFilter pattern used in LoggingController. Removed the standalone ValueNotifier and custom toolbar button, the toggle now shows up in the existing filter dropdown just like the logging filters do.

Comment thread packages/devtools_app/lib/src/screens/network/network_controller.dart Outdated
Comment thread packages/devtools_app/lib/src/screens/network/network_controller.dart Outdated
Comment thread packages/devtools_app/lib/src/screens/network/network_controller.dart Outdated
Comment thread packages/devtools_app/lib/src/shared/analytics/constants/_network_constants.dart Outdated
Comment thread packages/devtools_app/lib/src/screens/network/network_screen.dart Outdated
Comment thread packages/devtools_app/release_notes/NEXT_RELEASE_NOTES.md Outdated
Comment thread packages/devtools_app/release_notes/NEXT_RELEASE_NOTES.md Outdated
Comment thread packages/devtools_app/release_notes/NEXT_RELEASE_NOTES.md Outdated
rishika0212 and others added 2 commits March 13, 2026 21:57
Co-authored-by: Kenzie Davisson <43759233+kenzieschmoll@users.noreply.github.com>
Co-authored-by: Kenzie Davisson <43759233+kenzieschmoll@users.noreply.github.com>
Comment thread packages/devtools_app/test/screens/network/network_controller_test.dart Outdated
@kenzieschmoll kenzieschmoll merged commit 7a26df3 into flutter:master Mar 13, 2026
38 checks passed
rishika0212 added a commit to rishika0212/devtools that referenced this pull request Apr 21, 2026
* Add toggle to filter out socket rows in Network screen

* fix: add toggle filter to hide HTTP profiler tcp sockets in Network screen

* Removed visibleForTesting annotation and fixed analyzer warnings

* fix: addresses PR review feedbacks

* Update packages/devtools_app/release_notes/NEXT_RELEASE_NOTES.md

Co-authored-by: Kenzie Davisson <43759233+kenzieschmoll@users.noreply.github.com>

* Update packages/devtools_app/release_notes/NEXT_RELEASE_NOTES.md

Co-authored-by: Kenzie Davisson <43759233+kenzieschmoll@users.noreply.github.com>

* Refactor test to use activeFilter.value.settingFilters and set value directly as suggested in review.

* fixed format

---------

Co-authored-by: Kenzie Davisson <43759233+kenzieschmoll@users.noreply.github.com>
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.

Add a toggle to filter out SOCKET data (rows) pertaining to HTTP profiled requests

2 participants