[Property Editor] Add filters for set and default values (#9083)

Author: elliette

packages/devtools_app/lib/src/shared/ui/filter.dart

@@ -193,8 +193,7 @@ mixin FilterControllerMixin<T> on DisposableController
 /// the filter state.
 class FilterDialog<T> extends StatefulWidget {
   FilterDialog({super.key, required this.controller})
-    : assert(controller.queryFilterArgs.isNotEmpty),
-      settingFilterValuesAtOpen = List.generate(
+    : settingFilterValuesAtOpen = List.generate(
         controller.activeFilter.value.settingFilters.length,
         (index) =>
             controller.activeFilter.value.settingFilters[index].setting.value,
@@ -288,7 +287,7 @@ class _ToggleFilterElement extends StatelessWidget {
       child: Row(
         children: [
           NotifierCheckbox(notifier: filter.setting),
-          Text(filter.name),
+          Expanded(child: Text(filter.name)),
         ],
       ),
     );

packages/devtools_app/lib/src/standalone_ui/ide_shared/property_editor/property_editor_controller.dart

@@ -68,6 +68,18 @@ class PropertyEditorController extends DisposableController
 
   static const _checkConnectionInterval = Duration(minutes: 1);
 
+  static const _setPropertiesFilterId = 'set-properties-filter';
+
+  @visibleForTesting
+  static final propertyFilters = <SettingFilter<EditableProperty, Object>>[
+    ToggleFilter<EditableProperty>(
+      id: _setPropertiesFilterId,
+      name: 'Only include properties that are set in the code.',
+      includeCallback: (property) => property.hasArgument,
+      defaultValue: false,
+    ),
+  ];
+
   @override
   void init() {
     super.init();
@@ -124,11 +136,17 @@ class PropertyEditorController extends DisposableController
     super.dispose();
   }
 
+  /// The setting filters available for the Property Editor.
+  @override
+  SettingFilters<EditableProperty> createSettingFilters() => propertyFilters;
+
   @override
   void filterData(Filter<EditableProperty> filter) {
     super.filterData(filter);
     final filtered = (_editableWidgetData.value?.properties ?? []).where(
-      (property) => property.matchesQuery(filter.queryFilter.query),
+      (property) =>
+          property.matchesQuery(filter.queryFilter.query) &&
+          !_filteredOutBySettings(property, filter: filter),
     );
     filteredData
       ..clear()
@@ -220,6 +238,13 @@ class PropertyEditorController extends DisposableController
     });
   }
 
+  bool _filteredOutBySettings(
+    EditableProperty property, {
+    required Filter filter,
+  }) => filter.settingFilters.any(
+    (settingFilter) => !settingFilter.includeData(property),
+  );
+
   @visibleForTesting
   void initForTestsOnly({
     EditableArgumentsResult? editableArgsResult,

packages/devtools_app/test/standalone_ui/ide_shared/property_editor/property_editor_test.dart

@@ -439,6 +439,16 @@ void main() {
   });
 
   group('filtering editable arguments', () {
+    void resetFilters() {
+      for (final filter in controller.settingFilters) {
+        filter.setting.value = filter.defaultValue;
+      }
+    }
+
+    tearDown(() {
+      resetFilters();
+    });
+
     testWidgets('can filter by name', (tester) async {
       // Load the property editor.
       await tester.pumpWidget(wrap(propertyEditor));
@@ -525,6 +535,36 @@ void main() {
       expect(widthInput, findsNothing);
       expect(heightInput, findsNothing);
     });
+
+    testWidgets('can filter for only set values', (tester) async {
+      // Load the property editor.
+      await tester.pumpWidget(wrap(propertyEditor));
+
+      // Change the editable args.
+      controller.initForTestsOnly(editableArgsResult: result1);
+      await tester.pumpAndSettle();
+
+      final titleInput = _findTextFormField('String? title');
+      final widthInput = _findTextFormField('double width');
+      final heightInput = _findTextFormField('double? height');
+
+      // Verify all inputs are visible.
+      expect(_findNoPropertiesMessage, findsNothing);
+      expect(titleInput, findsOneWidget);
+      expect(widthInput, findsOneWidget);
+      expect(heightInput, findsOneWidget);
+
+      // Filter for only set vaues.
+      await _setFilter(
+        'Only include properties that are set in the code.',
+        tester: tester,
+      );
+
+      // Verify only the "title" and "width" properties are visible.
+      expect(heightInput, findsNothing);
+      expect(titleInput, findsOneWidget);
+      expect(widthInput, findsOneWidget);
+    });
   });
 
   group('editing arguments', () {
@@ -952,6 +992,33 @@ final _findNoPropertiesMessage = find.text(
   'No widget properties at current cursor location.',
 );
 
+Future<void> _setFilter(
+  String filterSettingText, {
+  required WidgetTester tester,
+}) async {
+  // Click the filter button.
+  final filterButtonFinder = find.byType(DevToolsFilterButton);
+  await tester.tap(filterButtonFinder);
+  await tester.pumpAndSettle();
+
+  // Find the checkbox for the filter and click it.
+  final rowFinder = find.ancestor(
+    of: find.textContaining(filterSettingText),
+    matching: find.byType(Row),
+  );
+  final checkboxFinder = find.descendant(
+    of: rowFinder,
+    matching: find.byType(NotifierCheckbox),
+  );
+  await tester.tap(checkboxFinder);
+  await tester.pumpAndSettle();
+
+  // Click "Apply" to apply the filter and close the dialog.
+  final applyFilterButtonFinder = find.byType(DialogApplyButton);
+  await tester.tap(applyFilterButtonFinder);
+  await tester.pumpAndSettle();
+}
+
 Finder _findFilterField() => find.descendant(
   of: find.byType(StandaloneFilterField<EditableProperty>),
   matching: find.byType(TextField),