Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Offline support for Network page #8332

Open
wants to merge 33 commits into
base: master
Choose a base branch
from

Conversation

hrajwade96
Copy link
Contributor

@hrajwade96 hrajwade96 commented Sep 21, 2024

Adding offline support to Network page.

issue link - #4470

List which issues are fixed by this PR.

Please add a note to packages/devtools_app/release_notes/NEXT_RELEASE_NOTES.md if your change requires release notes. Otherwise, add the 'release-notes-not-required' label to the PR.

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.

@hrajwade96 hrajwade96 marked this pull request as draft September 21, 2024 09:19
@hrajwade96 hrajwade96 changed the title added initial implementation Offline support for Network page Sep 21, 2024
@kenzieschmoll
Copy link
Member

@hrajwade96 is this PR ready for review or is this still a work in progress?

@hrajwade96
Copy link
Contributor Author

@hrajwade96 is this PR ready for review or is this still a work in progress?

@kenzieschmoll just finishing up few things, I will mark it ready soon

@hrajwade96 hrajwade96 marked this pull request as ready for review October 2, 2024 17:19
shouldLoad: (data) => !data.isEmpty,
loadData: (data) => loadOfflineData(data),
);
}
Copy link
Member

Choose a reason for hiding this comment

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

the code after this if statement should be put in an else block

Copy link
Contributor Author

@hrajwade96 hrajwade96 Oct 8, 2024

Choose a reason for hiding this comment

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

not using else was an oversight, added else block now, and also now there is no code outside.

@hrajwade96 hrajwade96 marked this pull request as draft October 23, 2024 15:13
@hrajwade96 hrajwade96 marked this pull request as ready for review October 27, 2024 14:32
SocketJsonKey.id.name: id,
SocketJsonKey.startTime.name: startTime,
SocketJsonKey.endTime.name: endTime,
//TODO verify if these timings are in correct format
Copy link
Member

Choose a reason for hiding this comment

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

please address this TODO.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

While testing I noticed 2 issues :

  1. The timings in socket stats are having discrepancy in online and offline mode - I thought this could be due to _timelineMicrosBase but I tried adding/ removing it there was still a discrepancy. Is it due to some time zone or formatting issue? I am trying to figure out.
  2. The Request and Response data is missing in offline mode - I think it's because full fetch is not called, if we want to call where can we ideally call it?

Attaching SS for 1st point :
Online mode
image

Offline mode
image

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Another point is that in offline mode data of socket and http requests is grouped when it's populated.
I think we should show them in their original order as the requests came in? Perhaps we can pack them in a combined way instead, or other way is to reorder before rendering based on timestamps (once we fix the timings) ?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Actually past 2 weeks I've been on vacation, and then unwell so got very little time to investigate.

Copy link
Member

Choose a reason for hiding this comment

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

The table should already sort the data by timestamp.

Copy link
Contributor Author

@hrajwade96 hrajwade96 Nov 21, 2024

Choose a reason for hiding this comment

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

Right, just checked it thanks, it was just due to the issue in timings it was looking grouped.

Copy link
Contributor Author

@hrajwade96 hrajwade96 Nov 22, 2024

Choose a reason for hiding this comment

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

@kenzieschmoll can you help with first 2 points? also point 3) on page refresh when in offline mode, this is how it is looking like currently, it's clearing the list, and also not showing exit cta
what is the expected behaviour here?
Do we need to persist the data in storage?
Screenshot 2024-11-22 at 9 53 09 PM

Copy link
Member

@kenzieschmoll kenzieschmoll left a comment

Choose a reason for hiding this comment

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

Please add test coverage for this change. Thanks!

Comment on lines 124 to 126
expect(offlineData.socketData.first.id, '105553123901536');
expect(offlineData.socketData.first.socketType, 'tcp');
expect(offlineData.socketData.first.port, 443);
Copy link
Member

Choose a reason for hiding this comment

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

i think we can remove these expectations since they are already tested above. Fine to leave the socketData.length check above on line 123 though

Copy link
Contributor Author

Choose a reason for hiding this comment

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

done

Comment on lines 143 to 146
final firstSocket = socketData.first as Map<String, Object?>;
final socketDetails = firstSocket['socket'] as Map<String, Object?>;

expect(socketDetails['id'], '105553123901536');
Copy link
Member

Choose a reason for hiding this comment

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

same here: we already verified the socket data above, so these can be removed

Copy link
Contributor Author

Choose a reason for hiding this comment

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

done

Copy link
Member

@kenzieschmoll kenzieschmoll left a comment

Choose a reason for hiding this comment

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

Just a couple more comments. Thank you for all your work on this change!

@kenzieschmoll
Copy link
Member

Looks like there are several failing checks. Please also add an entry to NEXT_RELEASE_NOTES.md so that the release notes check passes.

@kenzieschmoll
Copy link
Member

You will likely have several merge conflicts after pulling in the tip of the master branch. A change just landed that upgraded the Flutter version used in DevTools, which updated to a new version of the dart formatter. Here's what I recommend to make this merge simpler for you:

  1. Merge the master branch into your branch.
  2. For all conflicts, accept your revision of the file..
  3. Run dt update-flutter-sdk. This will update the flutter sdk contained at tool/flutter-sdk to the version used on the DevTools CI.
  4. Run tool/flutter-sdk/bin/dart format from the devtools_app directory. This will format your files with your changes to use the new formatter.

…fline_support

# Conflicts:
#	packages/devtools_app/lib/src/screens/network/har_data_entry.dart
#	packages/devtools_app/lib/src/screens/network/network_screen.dart
#	packages/devtools_app/lib/src/shared/http/http_request_data.dart
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.

2 participants