Repository navigation
Enable offline support for all DevTools screens #4470
Description
Activity
It was mentioned that the Logging page might be a good place to start.
Network page may also be a good 2nd candidate
For the Network Page, consider making sure that we use HAR file format for network requests
Exporting as HAR already exists for the network page, but for the full export of the network page, we'll also need to include extra devtools-specific information (things like selected request, filters, etc.).
Related issue: #4645
@kenzieschmoll, in reference to our earlier discussion (#7970 (comment)), what is the plan for adding offline support to the network page? I am interested in contributing to this effort and would like to know how I can help.
From what I understand - we need to wrap it with another model class OfflineNetworkData (with to and from json), which will contain all the extra data on this page. And add file extension detection (do explain what this detection is needed for).
- addedP2important to work on, but not at the top of the work list.important to work on, but not at the top of the work list.cost: highHigh engineering cost to implementHigh engineering cost to implementdevtools-cross-screenIssues that affect multiple DevTools screens, i.e. shared functionality and widgetsIssues that affect multiple DevTools screens, i.e. shared functionality and widgets
on Aug 7, 2024 To implement offline support for a screen, you can follow the instructions in the dart doc for
OfflineScreenControllerMixin: https://github.com/flutter/devtools/blob/master/packages/devtools_app/lib/src/shared/offline_data.dart/#L125You can look at ProfilerScreenController and PerformanceController as examples.
And add file extension detection (do explain what this detection is needed for)
The more complicated part for the Network page is the fact that we support exporting as a .har file, whereas the offline framework for DevTools only supports importing & exporting to / from a JSON file. So in the current form of the offline framework, if network data is exported as a .har file, it will not be able to be re-imported back into DevTools. Only data exported as a JSON file through the DevTools offline framework can be re-imported back into DevTools.
We can tweak the logic to support loading the .har file for the network page as a special case, but we can do this as a follow up task to adding the full offline support for the Network page. The logic to import data from a file is here: https://github.com/flutter/devtools/blob/master/packages/devtools_app/lib/src/shared/config_specific/import_export/import_export.dart/#L61-L98
Reacted by hrajwade96To implement offline support for a screen, you can follow the instructions in the dart doc for
OfflineScreenControllerMixin: https://github.com/flutter/devtools/blob/master/packages/devtools_app/lib/src/shared/offline_data.dart/#L125You can look at ProfilerScreenController and PerformanceController as examples.
And add file extension detection (do explain what this detection is needed for)
The more complicated part for the Network page is the fact that we support exporting as a .har file, whereas the offline framework for DevTools only supports importing & exporting to / from a JSON file. So in the current form of the offline framework, if network data is exported as a .har file, it will not be able to be re-imported back into DevTools. Only data exported as a JSON file through the DevTools offline framework can be re-imported back into DevTools.
We can tweak the logic to support loading the .har file for the network page as a special case, but we can do this as a follow up task to adding the full offline support for the Network page. The logic to import data from a file is here: https://github.com/flutter/devtools/blob/master/packages/devtools_app/lib/src/shared/config_specific/import_export/import_export.dart/#L61-L98
Thanks for sharing the details,
I had noticed that at present only exported 'json' format is supported for importing, I was thinking to make it accept 'har' as well. But as you mentioned, I will raise a separate PR for that change.
I will work on adding offline support with below feature for network screen - when the app gets disconnected, view offline data and check the instructions and references shared by you.@kenzieschmoll is there any on going/planned work for remaining screens where I can contribute? Also I just wanted to know, which of these is of a higher priority?
Remaining priority:
- Inspector. This one is high impact and we should already have some prior art here since we fetch the tree from the Flutter framework in a JSON format already. @elliette can provide more info on the current implementation.
- Logging. This is likely much simpler than the Inspector.
- All others (we may decide that offline support is not necessary for these screens, so before starting work here, please start a discussion first.)
Reacted by hrajwade96@kenzieschmoll Thanks for outlining the priorities! I'd like to contribute once I have some bandwidth.
Enabling offline support will:
SomeScreenData.parse(someOfflineData)to initialize fake testing data for the screen. If we continue to integrate with Stager, this will be useful for both testing and stager development (see https://github.com/flutter/devtools/pull/446)