From bdfdb951e7f534100af923e5edaf6c25574ac066 Mon Sep 17 00:00:00 2001 From: Daniel Eshkeri Date: Wed, 6 Nov 2024 13:49:43 +0000 Subject: [PATCH] test: wrote tests for status chip --- lib/src/components/chips/status_chip.dart | 9 +- .../chips/golden/status_chip_default.png | Bin 0 -> 3340 bytes .../chips/golden/status_chip_long.png | Bin 0 -> 3405 bytes .../chips/golden/status_chip_sharp.png | Bin 0 -> 3340 bytes .../components/chips/status_chip_test.dart | 226 ++++++++++++++++++ 5 files changed, 233 insertions(+), 2 deletions(-) create mode 100644 test/src/components/chips/golden/status_chip_default.png create mode 100644 test/src/components/chips/golden/status_chip_long.png create mode 100644 test/src/components/chips/golden/status_chip_sharp.png create mode 100644 test/src/components/chips/status_chip_test.dart diff --git a/lib/src/components/chips/status_chip.dart b/lib/src/components/chips/status_chip.dart index 079fd2e7..cdd205dd 100644 --- a/lib/src/components/chips/status_chip.dart +++ b/lib/src/components/chips/status_chip.dart @@ -49,7 +49,7 @@ class ZetaStatusChip extends ZetaStatelessWidget { child: MouseRegion( cursor: draggable ? SystemMouseCursors.click : SystemMouseCursors.basic, child: Semantics( - label: semanticLabel, + label: semanticLabel ?? label, child: SelectionContainer.disabled( child: draggable ? Draggable( @@ -106,7 +106,12 @@ class _Child extends StatelessWidget { horizontal: Zeta.of(context).spacing.small, vertical: Zeta.of(context).spacing.minimum, ), - child: Text(label, style: ZetaTextStyles.bodyXSmall), + child: Text( + label, + style: ZetaTextStyles.bodyXSmall.copyWith( + color: Zeta.of(context).colors.textDefault, + ), + ), ); } diff --git a/test/src/components/chips/golden/status_chip_default.png b/test/src/components/chips/golden/status_chip_default.png new file mode 100644 index 0000000000000000000000000000000000000000..e0bad968a24acb93bbf1b514eb3f04d4d9225063 GIT binary patch literal 3340 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYV2a>i1B%QlYbpRzjKx9jP7LeL$-D$|Sc;uI zLpXq-h9jkefq`e6r;B4q#hkY{H~KmoiZ}$aZ{)hkmD=txpRvQmQKhWoMgvn>v9Oy* zUDs@-=U2{u%U-`{X7N0B1_p-*FYj>!4eWPr0Fsi7ObiSuEF26B69g52lFxo#I`I2p z@*KbW;qgDVy*d8;!Bgh|G^&Szk%7U8iG_jT1cv|vgM#v?;Anu1CWg_BFj_K%JlSHi`iVJYD@<);T3K0RV>I;Nk!P literal 0 HcmV?d00001 diff --git a/test/src/components/chips/golden/status_chip_long.png b/test/src/components/chips/golden/status_chip_long.png new file mode 100644 index 0000000000000000000000000000000000000000..03f566255de485a2e620d0272ea3198f4a748c56 GIT binary patch literal 3405 zcmeAS@N?(olHy`uVBq!ia0y~yU{+vYV2a>i1B%QlYbpRzjKx9jP7LeL$-D$|Sc;uI zLpXq-h9jkefr00{r;B4q#hkY{W3|{4B^n+oT7L|l=9I{~iT$f(fJ^{ihwTYInGGUO z)0K-qMIQRzTO@qF^v{_uS8n^<-K+iB;v72zL&Jer{`x?p|Hw13Ffg3p5MW?XP<8-{ z_b@OrFc@Wbv+3!rZ~OhbeQA7!k+s~q{CCsl%|F}MKAZEiyLmdKI;Vst04i1B%QlYbpRzjKx9jP7LeL$-D$|Sc;uI zLpXq-h9jkefq`e6r;B4q#hkY{H~KmoiZ}$aZ{)hkmD=txpRvQmQKhWoMgvn>v9Oy* zUDs@-=U2{u%U-`{X7N0B1_p-*FYj>!4eWPr0Fsi7ObiSuEF26B69g52lFxo#I`I2p z@*KbW;qgDVy*d8;!Bgh|G^&Szk%7U8iG_jT1cv|vgM#v?;Anu1CWg_BFj_K%JlSHi`iVJYD@<);T3K0RV>I;Nk!P literal 0 HcmV?d00001 diff --git a/test/src/components/chips/status_chip_test.dart b/test/src/components/chips/status_chip_test.dart new file mode 100644 index 00000000..5d993228 --- /dev/null +++ b/test/src/components/chips/status_chip_test.dart @@ -0,0 +1,226 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_test/flutter_test.dart'; +import 'package:zeta_flutter/zeta_flutter.dart'; + +import '../../../test_utils/test_app.dart'; +import '../../../test_utils/tolerant_comparator.dart'; +import '../../../test_utils/utils.dart'; + +void main() { + const String parentFolder = 'chips'; + + const goldenFile = GoldenFiles(component: parentFolder); + setUpAll(() { + goldenFileComparator = TolerantComparator(goldenFile.uri); + }); + + group('Accessibility Tests', () { + testWidgets('label meets accessibility requirements', (WidgetTester tester) async { + final SemanticsHandle handle = tester.ensureSemantics(); + await tester.pumpWidget( + const TestApp( + home: ZetaStatusChip( + label: 'Label', + ), + ), + ); + await expectLater(tester, meetsGuideline(androidTapTargetGuideline)); + await expectLater(tester, meetsGuideline(iOSTapTargetGuideline)); + await expectLater(tester, meetsGuideline(labeledTapTargetGuideline)); + await expectLater(tester, meetsGuideline(textContrastGuideline)); + + handle.dispose(); + }); + }); + + group('Content Tests', () { + final debugFillProperties = { + 'label': '"Label"', + 'draggable': 'false', + 'data': 'null', + 'onDragCompleted': 'null', + 'semanticLabel': 'null', + }; + debugFillPropertiesTest( + const ZetaStatusChip( + label: 'Label', + ), + debugFillProperties, + ); + + testWidgets('renders label correctly', (WidgetTester tester) async { + await tester.pumpWidget( + const TestApp( + home: ZetaStatusChip( + label: 'Label', + ), + ), + ); + + expect(find.text('Label'), findsOneWidget); + }); + + testWidgets('renders label correctly when label is long', (WidgetTester tester) async { + await tester.pumpWidget( + const TestApp( + home: ZetaStatusChip( + label: 'Label that is very very long', + ), + ), + ); + + final Finder textFinder = find.text('Label that is very very long'); + + expect(textFinder, findsOneWidget); + }); + }); + + group('Dimensions Tests', () { + testWidgets('horizontal padding is 8 and vertical padding is 4', (WidgetTester tester) async { + await tester.pumpWidget( + const TestApp( + home: ZetaStatusChip( + label: 'Label', + ), + ), + ); + final Finder finder = find.byType(Container); + expect(finder, findsOneWidget); + final Container widget = tester.widget(finder); + expect( + widget.padding, + const EdgeInsets.symmetric( + horizontal: 8, + vertical: 4, + ), + ); + }); + }); + + group('Styling Tests', () { + testWidgets('background color is ZetaColors.surfaceWarm and border radius is 8', (WidgetTester tester) async { + await tester.pumpWidget( + const TestApp( + home: ZetaStatusChip( + label: 'Label', + ), + ), + ); + final Finder finder = find.byType(Container); + expect(finder, findsOneWidget); + final Container widget = tester.widget(finder); + expect( + widget.decoration, + BoxDecoration( + color: ZetaColors.light().surfaceWarm, + borderRadius: BorderRadius.circular(8), + ), + ); + }); + + testWidgets('border radius is null when rounded is false', (WidgetTester tester) async { + await tester.pumpWidget( + const TestApp( + home: ZetaStatusChip( + label: 'Label', + rounded: false, + ), + ), + ); + final Finder finder = find.byType(Container); + expect(finder, findsOneWidget); + final Container widget = tester.widget(finder); + expect( + widget.decoration, + BoxDecoration( + color: ZetaColors.light().surfaceWarm, + ), + ); + }); + + testWidgets('text style is ZetaTextStyles.bodyXSmall and text color is textDefault', (WidgetTester tester) async { + await tester.pumpWidget( + const TestApp( + home: ZetaStatusChip( + label: 'Label', + ), + ), + ); + final Finder finder = find.byType(Text); + expect(finder, findsOneWidget); + final Text widget = tester.widget(finder); + expect(widget.style, ZetaTextStyles.bodyXSmall.copyWith(color: ZetaColors.light().textDefault)); + }); + }); + + group('Interaction Tests', () { + testWidgets('chip calls onDragCompleted and parses data to DragTarget when drag is completed', + (WidgetTester tester) async { + bool dragCompleted = false; + String? dragData; + + await tester.pumpWidget( + TestApp( + home: Column( + children: [ + ZetaStatusChip( + label: 'Label', + draggable: true, + data: 'data', + onDragCompleted: () { + dragCompleted = true; + }, + ), + DragTarget( + onAcceptWithDetails: (details) => dragData = details.data, + builder: (BuildContext context, List candidateData, List rejectedData) { + return const SizedBox( + width: 100, + height: 100, + ); + }, + ), + ], + ), + ), + ); + + final Finder finder = find.byType(Draggable); + expect(finder, findsOneWidget); + + final TestGesture gesture = await tester.startGesture(tester.getCenter(finder)); + await gesture.moveTo(tester.getCenter(find.byType(DragTarget))); + await gesture.up(); + + expect(dragCompleted, isTrue); + expect(dragData, 'data'); + }); + }); + + group('Golden Tests', () { + goldenTest( + goldenFile, + const ZetaStatusChip( + label: 'Label', + ), + 'status_chip_default', + ); + goldenTest( + goldenFile, + const ZetaStatusChip( + label: 'Label', + rounded: false, + ), + 'status_chip_sharp', + ); + goldenTest( + goldenFile, + const ZetaStatusChip( + label: 'Label that is very very long', + ), + 'status_chip_long', + ); + }); + + group('Performance Tests', () {}); +}