test: organizing tests into groups

.github/workflows/pull-request.yml

@@ -41,7 +41,7 @@ jobs:
           fi
 
   deploy-preview:
-    name: Deploy preview version of the storybook on firebase
+    name: Deploy preview version of the widgetbook on firebase
     needs: [code-quality, check-secret]
     if: needs.check-secret.outputs.secret-exists == 'true'
     runs-on: ubuntu-latest

pubspec.yaml

@@ -21,6 +21,7 @@ environment:
   flutter: ">=3.16.0"
 
 dependencies:
+  analyzer: ^6.7.0
   collection: ^1.18.0
   equatable: ^2.0.5
   flutter:

test/TESTING_README.mdx → test/TESTING_README.md

@@ -11,24 +11,34 @@ As you are writing tests think about helper function you could write and add the
 
 ### Groups
 
-- Accessibility Tests  
+- **Accessibility Tests**  
   Semantic labels, touch areas, contrast ratios, etc.
-- Content Tests  
-  Finds the widget, parameter statuses, etc.
-- Dimensions Tests  
-  Size, padding, margin, alignment, etc.
-- Styling Tests  
+
+- **Content Tests**  
+  Finds the widget, parameter statuses, etc.  
+  Checking for the value of props and attributes of the widget. Checking for the presence of widgets.
+
+- **Dimensions Tests**  
+  Size, padding, margin, alignment, etc.  
+  getSize().
+
+- **Styling Tests**  
   Rendered colors, fonts, borders, radii etc.
-- Interaction Tests  
+  Checking the style of widgets and child widgets.
+
+- **Interaction Tests**  
   Gesture recognizers, taps, drags, etc.
-- Golden Tests  
+  For example, using a boolean to check if the widgets interaction function runs.
+
+- **Golden Tests**  
   Compares the rendered widget with the golden file. Use the `goldenTest()` function from test_utils/utils.dart.
-- Performance Tests  
+
+- **Performance Tests**  
   Animation performance, rendering performance, data manupulation performance, etc.
 
 ### Testing File Template
 
-```
+```dart
 import 'dart:ui';
 
 import 'package:flutter/foundation.dart';

test/src/components/accordion/accordion_test.dart

@@ -1,6 +1,5 @@
 import 'dart:ui';
 
-import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:zeta_flutter/zeta_flutter.dart';
@@ -9,145 +8,156 @@ import '../../../test_utils/test_app.dart';
 import '../../../test_utils/utils.dart';
 
 void main() {
-  testWidgets('ZetaAccordion expands and collapses correctly', (WidgetTester tester) async {
-    await tester.pumpWidget(
-      const TestApp(
-        home: ZetaAccordion(
-          title: 'Accordion Title',
-          child: Text('Accordion Content'),
-        ),
+  const String componentName = 'ZetaAccordion';
+
+  group('$componentName Accessibility Tests', () {});
+  group('$componentName Content Tests', () {
+    final debugFillProperties = {
+      'title': '"Title"',
+      'rounded': 'null',
+      'contained': 'false',
+      'isOpen': 'false',
+    };
+    debugFillPropertiesTest(
+      const ZetaAccordion(
+        title: 'Title',
       ),
+      debugFillProperties,
     );
 
-    // Verify that the accordion is initially collapsed
-    final Finder accordionContent = find.byType(SizeTransition);
-    expect(accordionContent, findsOneWidget);
-
-    final SizeTransition sizeTransition = tester.widget(accordionContent);
-    expect(sizeTransition.sizeFactor.value, 0);
-
-    // Tap on the accordion to expand it
-    await tester.tap(find.text('Accordion Title'));
-    await tester.pumpAndSettle();
-
-    // Verify that the accordion is now expanded
-    expect(sizeTransition.sizeFactor.value, 1);
-
-    // Tap on the accordion again to collapse it
-    await tester.tap(find.text('Accordion Title'));
-    await tester.pumpAndSettle();
-
-    expect(sizeTransition.sizeFactor.value, 0);
-  });
-
-  testWidgets('ZetaAccordion changes isOpen property correctly', (WidgetTester tester) async {
-    bool isOpen = false;
-    StateSetter? setState;
+    testWidgets('Programatically change child', (WidgetTester tester) async {
+      Widget? child = const Text('Text 1');
+      StateSetter? setState;
 
-    await tester.pumpWidget(
-      TestApp(
-        home: StatefulBuilder(
+      await tester.pumpWidget(
+        StatefulBuilder(
           builder: (context, setState2) {
             setState = setState2;
-            return ZetaAccordion(
-              title: 'Accordion Title',
-              isOpen: isOpen,
-              child: const Text('Accordion Content'),
+            return TestApp(
+              home: ZetaAccordion(
+                title: 'Accordion Title',
+                child: child,
+              ),
             );
           },
         ),
-      ),
-    );
-
-    // Verify that the accordion is initially closed
-    final Finder accordionContent = find.byType(SizeTransition);
-    expect(accordionContent, findsOneWidget);
-
-    final SizeTransition sizeTransition = tester.widget(accordionContent);
-    expect(sizeTransition.sizeFactor.value, 0);
-
-    // Change isOpen property to true
-    setState?.call(() => isOpen = true);
-
-    await tester.pumpAndSettle();
-
-    // Verify that the accordion is now open
-    expect(sizeTransition.sizeFactor.value, 1);
-
-    // Change isOpen property to false
-    setState?.call(() => isOpen = false);
+      );
+
+      final Finder accordionContent = find.text('Text 1');
+      expect(accordionContent, findsOneWidget);
+      setState?.call(() => child = null);
+      await tester.pumpAndSettle();
+      expect(accordionContent, findsNothing);
+    });
+  });
+  group('$componentName Dimensions Tests', () {});
+  group('$componentName Styling Tests', () {
+    testWidgets('ZetaAccordion changes color on hover', (WidgetTester tester) async {
+      await tester.pumpWidget(
+        const TestApp(
+          home: ZetaAccordion(
+            title: 'Accordion Title',
+            child: Text('Accordion Content'),
+          ),
+        ),
+      );
+
+      final textButtonFinder = find.byType(TextButton);
+      final textButton = tester.widget<TextButton>(textButtonFinder);
+      final gesture = await tester.createGesture(kind: PointerDeviceKind.mouse);
+      await gesture.addPointer(location: Offset.zero);
+      addTearDown(gesture.removePointer);
+
+      await tester.pump();
+      await gesture.moveTo(tester.getCenter(find.byType(ZetaAccordion)));
+      await tester.pumpAndSettle();
+      // Verify that the textButton color matches the hover color
+      expect(
+        textButton.style!.overlayColor?.resolve({WidgetState.hovered}),
+        ZetaColorBase.cool.shade20,
+      );
+      expect(
+        textButton.style!.overlayColor?.resolve({WidgetState.focused}),
+        Colors.transparent,
+      );
+      expect(textButton.style!.side?.resolve({WidgetState.focused})?.color, ZetaColorBase.blue.shade50);
+    });
+  });
+  group('$componentName Interaction Tests', () {
+    testWidgets('ZetaAccordion expands and collapses correctly', (WidgetTester tester) async {
+      await tester.pumpWidget(
+        const TestApp(
+          home: ZetaAccordion(
+            title: 'Accordion Title',
+            child: Text('Accordion Content'),
+          ),
+        ),
+      );
+
+      // Verify that the accordion is initially collapsed
+      final Finder accordionContent = find.byType(SizeTransition);
+      expect(accordionContent, findsOneWidget);
+
+      final SizeTransition sizeTransition = tester.widget(accordionContent);
+      expect(sizeTransition.sizeFactor.value, 0);
+
+      // Tap on the accordion to expand it
+      await tester.tap(find.text('Accordion Title'));
+      await tester.pumpAndSettle();
+
+      // Verify that the accordion is now expanded
+      expect(sizeTransition.sizeFactor.value, 1);
+
+      // Tap on the accordion again to collapse it
+      await tester.tap(find.text('Accordion Title'));
+      await tester.pumpAndSettle();
+
+      expect(sizeTransition.sizeFactor.value, 0);
+    });
+
+    testWidgets('ZetaAccordion changes isOpen property correctly', (WidgetTester tester) async {
+      bool isOpen = false;
+      StateSetter? setState;
+
+      await tester.pumpWidget(
+        TestApp(
+          home: StatefulBuilder(
+            builder: (context, setState2) {
+              setState = setState2;
+              return ZetaAccordion(
+                title: 'Accordion Title',
+                isOpen: isOpen,
+                child: const Text('Accordion Content'),
+              );
+            },
+          ),
+        ),
+      );
 
-    await tester.pumpAndSettle();
+      // Verify that the accordion is initially closed
+      final Finder accordionContent = find.byType(SizeTransition);
+      expect(accordionContent, findsOneWidget);
 
-    // Verify that the accordion is now closed
-    expect(sizeTransition.sizeFactor.value, 0);
-  });
+      final SizeTransition sizeTransition = tester.widget(accordionContent);
+      expect(sizeTransition.sizeFactor.value, 0);
 
-  testWidgets('debugFillProperties works correctly', (WidgetTester tester) async {
-    final diagnostics = DiagnosticPropertiesBuilder();
-    const ZetaAccordion(
-      title: 'Title',
-    ).debugFillProperties(diagnostics);
+      // Change isOpen property to true
+      setState?.call(() => isOpen = true);
 
-    expect(diagnostics.finder('title'), '"Title"');
-    expect(diagnostics.finder('rounded'), 'null');
-    expect(diagnostics.finder('contained'), 'false');
-    expect(diagnostics.finder('isOpen'), 'false');
-  });
+      await tester.pumpAndSettle();
 
-  testWidgets('Programatically change child', (WidgetTester tester) async {
-    Widget? child = const Text('Text 1');
-    StateSetter? setState;
-
-    await tester.pumpWidget(
-      StatefulBuilder(
-        builder: (context, setState2) {
-          setState = setState2;
-          return TestApp(
-            home: ZetaAccordion(
-              title: 'Accordion Title',
-              child: child,
-            ),
-          );
-        },
-      ),
-    );
+      // Verify that the accordion is now open
+      expect(sizeTransition.sizeFactor.value, 1);
 
-    final Finder accordionContent = find.text('Text 1');
-    expect(accordionContent, findsOneWidget);
-    setState?.call(() => child = null);
-    await tester.pumpAndSettle();
-    expect(accordionContent, findsNothing);
-  });
+      // Change isOpen property to false
+      setState?.call(() => isOpen = false);
 
-  testWidgets('ZetaAccordion changes color on hover', (WidgetTester tester) async {
-    await tester.pumpWidget(
-      const TestApp(
-        home: ZetaAccordion(
-          title: 'Accordion Title',
-          child: Text('Accordion Content'),
-        ),
-      ),
-    );
+      await tester.pumpAndSettle();
 
-    final textButtonFinder = find.byType(TextButton);
-    final textButton = tester.widget<TextButton>(textButtonFinder);
-    final gesture = await tester.createGesture(kind: PointerDeviceKind.mouse);
-    await gesture.addPointer(location: Offset.zero);
-    addTearDown(gesture.removePointer);
-
-    await tester.pump();
-    await gesture.moveTo(tester.getCenter(find.byType(ZetaAccordion)));
-    await tester.pumpAndSettle();
-    // Verify that the textButton color matches the hover color
-    expect(
-      textButton.style!.overlayColor?.resolve({WidgetState.hovered}),
-      ZetaColorBase.cool.shade20,
-    );
-    expect(
-      textButton.style!.overlayColor?.resolve({WidgetState.focused}),
-      Colors.transparent,
-    );
-    expect(textButton.style!.side?.resolve({WidgetState.focused})?.color, ZetaColorBase.blue.shade50);
+      // Verify that the accordion is now closed
+      expect(sizeTransition.sizeFactor.value, 0);
+    });
   });
+  group('$componentName Golden Tests', () {});
+  group('$componentName Performance Tests', () {});
 }