Fix JsonViewer auto closing, and add SelectionArea to info tabs (#7367)

![](https://media.giphy.com/media/v1.Y2lkPTc5MGI3NjExdnJndm0xZ2N1MXFoMXUxMGQ4MTg5dm0wNjg3anBqM2M2NmpuMzJ1MyZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/0jpKIoiMVw2ydsW4Ib/giphy-downsized.gif)

1. Fix issue with JsonViewer where it would refresh and close all json items.
2. Update network selection tabs to use SelectionArea so we can select text.
    - This allows us to remove the Gesture detector hack that was added, which in turn fixes the context refresh that was closing the contents of the jsonviewer.

Fixes #6808

packages/devtools_app/lib/src/screens/network/network_request_inspector_views.dart

@@ -63,39 +63,41 @@ class HttpRequestHeadersView extends StatelessWidget {
     final requestHeaders = data.requestHeaders;
     return LayoutBuilder(
       builder: (context, constraints) {
-        return ListView(
-          children: [
-            _buildTile(
-              'General',
-              [
-                for (final entry in general.entries)
-                  _Row(
-                    entry: entry,
-                    constraints: constraints,
-                    isErrorValue: data.didFail && entry.key == 'statusCode',
-                  ),
-              ],
-              key: generalKey,
-            ),
-            _buildTile(
-              'Response Headers',
-              [
-                if (responseHeaders != null)
-                  for (final entry in responseHeaders.entries)
-                    _Row(entry: entry, constraints: constraints),
-              ],
-              key: responseHeadersKey,
-            ),
-            _buildTile(
-              'Request Headers',
-              [
-                if (requestHeaders != null)
-                  for (final entry in requestHeaders.entries)
-                    _Row(entry: entry, constraints: constraints),
-              ],
-              key: requestHeadersKey,
-            ),
-          ],
+        return SelectionArea(
+          child: ListView(
+            children: [
+              _buildTile(
+                'General',
+                [
+                  for (final entry in general.entries)
+                    _Row(
+                      entry: entry,
+                      constraints: constraints,
+                      isErrorValue: data.didFail && entry.key == 'statusCode',
+                    ),
+                ],
+                key: generalKey,
+              ),
+              _buildTile(
+                'Response Headers',
+                [
+                  if (responseHeaders != null)
+                    for (final entry in responseHeaders.entries)
+                      _Row(entry: entry, constraints: constraints),
+                ],
+                key: responseHeadersKey,
+              ),
+              _buildTile(
+                'Request Headers',
+                [
+                  if (requestHeaders != null)
+                    for (final entry in requestHeaders.entries)
+                      _Row(entry: entry, constraints: constraints),
+                ],
+                key: requestHeadersKey,
+              ),
+            ],
+          ),
         );
       },
     );
@@ -121,17 +123,16 @@ class _Row extends StatelessWidget {
       child: Row(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
-          SelectableText(
+          Text(
             '${entry.key}: ',
             style: Theme.of(context).textTheme.titleSmall,
           ),
           Expanded(
-            child: SelectableText(
+            child: Text(
               style: isErrorValue
                   ? TextStyle(color: Theme.of(context).colorScheme.error)
                   : null,
               '${entry.value}',
-              minLines: 1,
             ),
           ),
         ],
@@ -444,12 +445,12 @@ class ImageResponseView extends StatelessWidget {
         mainAxisSize: MainAxisSize.min,
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
-          SelectableText(
+          Text(
             '$key: ',
             style: Theme.of(context).textTheme.titleSmall,
           ),
           Expanded(
-            child: SelectableText(
+            child: Text(
               value,
               // TODO(kenz): use top level overflow parameter if
               // https://github.com/flutter/flutter/issues/82722 is fixed.
@@ -495,7 +496,7 @@ class HttpRequestCookiesView extends StatelessWidget {
     );
   }
 
-  DataCell _buildCell(String? value) => DataCell(SelectableText(value ?? '--'));
+  DataCell _buildCell(String? value) => DataCell(Text(value ?? '--'));
 
   DataCell _buildIconCell(IconData icon) =>
       DataCell(Icon(icon, size: defaultIconSize));
@@ -515,7 +516,7 @@ class HttpRequestCookiesView extends StatelessWidget {
     }) {
       return DataColumn(
         label: Expanded(
-          child: SelectableText(
+          child: Text(
             title,
             // TODO(kenz): use top level overflow parameter if
             // https://github.com/flutter/flutter/issues/82722 is fixed.
@@ -637,16 +638,18 @@ class NetworkRequestOverviewView extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return ListView(
-      padding: const EdgeInsets.all(defaultSpacing),
-      children: [
-        ..._buildGeneralRows(context),
-        if (data is WebSocket) ..._buildSocketOverviewRows(context),
-        const PaddedDivider(
-          padding: EdgeInsets.only(bottom: denseRowSpacing),
-        ),
-        ..._buildTimingOverview(context),
-      ],
+    return SelectionArea(
+      child: ListView(
+        padding: const EdgeInsets.all(defaultSpacing),
+        children: [
+          ..._buildGeneralRows(context),
+          if (data is WebSocket) ..._buildSocketOverviewRows(context),
+          const PaddedDivider(
+            padding: EdgeInsets.only(bottom: denseRowSpacing),
+          ),
+          ..._buildTimingOverview(context),
+        ],
+      ),
     );
   }
 
@@ -903,7 +906,7 @@ class NetworkRequestOverviewView extends StatelessWidget {
       children: [
         SizedBox(
           width: _keyWidth,
-          child: SelectableText(
+          child: Text(
             title.isEmpty ? '' : '$title: ',
             style: Theme.of(context).textTheme.titleSmall,
           ),
@@ -916,10 +919,9 @@ class NetworkRequestOverviewView extends StatelessWidget {
   }
 
   Widget _valueText(String value, [TextStyle? style]) {
-    return SelectableText(
+    return Text(
       style: style,
       value,
-      minLines: 1,
     );
   }
 }

packages/devtools_app/lib/src/screens/network/network_screen.dart

@@ -278,27 +278,24 @@ class _NetworkProfilerBody extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return GestureDetector(
-      onTap: () => FocusScope.of(context).unfocus(),
-      child: SplitPane(
-        initialFractions: const [0.5, 0.5],
-        minSizes: const [200, 200],
-        axis: Axis.horizontal,
-        children: [
-          ValueListenableBuilder<List<NetworkRequest>>(
-            valueListenable: controller.filteredData,
-            builder: (context, filteredRequests, _) {
-              return NetworkRequestsTable(
-                networkController: controller,
-                requests: filteredRequests,
-                searchMatchesNotifier: controller.searchMatches,
-                activeSearchMatchNotifier: controller.activeSearchMatch,
-              );
-            },
-          ),
-          NetworkRequestInspector(controller),
-        ],
-      ),
+    return SplitPane(
+      initialFractions: const [0.5, 0.5],
+      minSizes: const [200, 200],
+      axis: Axis.horizontal,
+      children: [
+        ValueListenableBuilder<List<NetworkRequest>>(
+          valueListenable: controller.filteredData,
+          builder: (context, filteredRequests, _) {
+            return NetworkRequestsTable(
+              networkController: controller,
+              requests: filteredRequests,
+              searchMatchesNotifier: controller.searchMatches,
+              activeSearchMatchNotifier: controller.activeSearchMatch,
+            );
+          },
+        ),
+        NetworkRequestInspector(controller),
+      ],
     );
   }
 }

packages/devtools_app/lib/src/shared/common_widgets.dart

@@ -1332,19 +1332,21 @@ class _JsonViewerState extends State<JsonViewer>
 
   @override
   Widget build(BuildContext context) {
-    return Padding(
-      padding: const EdgeInsets.all(denseSpacing),
-      child: SingleChildScrollView(
-        child: FutureBuilder(
-          future: _initializeTree,
-          builder: (context, snapshot) {
-            if (snapshot.connectionState != ConnectionState.done) {
-              return Container();
-            }
-            return ExpandableVariable(
-              variable: variable,
-            );
-          },
+    return SelectionArea(
+      child: Padding(
+        padding: const EdgeInsets.all(denseSpacing),
+        child: SingleChildScrollView(
+          child: FutureBuilder(
+            future: _initializeTree,
+            builder: (context, snapshot) {
+              if (snapshot.connectionState != ConnectionState.done) {
+                return Container();
+              }
+              return ExpandableVariable(
+                variable: variable,
+              );
+            },
+          ),
         ),
       ),
     );

packages/devtools_app/release_notes/NEXT_RELEASE_NOTES.md

@@ -40,6 +40,7 @@ TODO: Remove this section if there are not any general updates.
 
 * Improved Network profiler performance. [#7266](https://github.com/flutter/devtools/pull/7266)
 * Fixed a bug where selected pending requests weren't refreshing the tab once updated. [#7266](https://github.com/flutter/devtools/pull/7266)
+* Fixed JsonViewer where all of the expanded sections would snap closed. [#7367](https://github.com/flutter/devtools/pull/7367)
 
 ## Logging updates