@rosetears/aili-pi 0.1.0

package/skills/flutter-dev/references/testing.md

@@ -0,0 +1,364 @@
+# Testing Strategies
+
+Flutter testing guide covering widget tests, unit tests, integration tests, and mocking patterns.
+
+## Test Types
+
+| Type | Purpose | Speed | Scope |
+|------|---------|-------|-------|
+| Unit tests | Business logic, utilities | Fast | Single function/class |
+| Widget tests | UI components | Medium | Single widget |
+| Integration tests | Full user flows | Slow | Multiple screens |
+
+## Widget Tests
+
+### Basic Widget Test
+
+```dart
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+void main() {
+  testWidgets('Counter increments when button tapped', (tester) async {
+    await tester.pumpWidget(const MaterialApp(home: CounterScreen()));
+
+    // Verify initial state
+    expect(find.text('0'), findsOneWidget);
+    expect(find.text('1'), findsNothing);
+
+    // Tap the increment button
+    await tester.tap(find.byIcon(Icons.add));
+    await tester.pump();
+
+    // Verify state changed
+    expect(find.text('0'), findsNothing);
+    expect(find.text('1'), findsOneWidget);
+  });
+}
+```
+
+### Testing with Riverpod
+
+```dart
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+void main() {
+  testWidgets('displays user name from provider', (tester) async {
+    await tester.pumpWidget(
+      ProviderScope(
+        overrides: [
+          userProvider.overrideWithValue(
+            AsyncValue.data(User(name: 'Test User')),
+          ),
+        ],
+        child: const MaterialApp(home: UserScreen()),
+      ),
+    );
+
+    expect(find.text('Test User'), findsOneWidget);
+  });
+
+  testWidgets('shows loading indicator', (tester) async {
+    await tester.pumpWidget(
+      ProviderScope(
+        overrides: [
+          userProvider.overrideWithValue(const AsyncValue.loading()),
+        ],
+        child: const MaterialApp(home: UserScreen()),
+      ),
+    );
+
+    expect(find.byType(CircularProgressIndicator), findsOneWidget);
+  });
+
+  testWidgets('shows error message', (tester) async {
+    await tester.pumpWidget(
+      ProviderScope(
+        overrides: [
+          userProvider.overrideWithValue(
+            AsyncValue.error('Network error', StackTrace.current),
+          ),
+        ],
+        child: const MaterialApp(home: UserScreen()),
+      ),
+    );
+
+    expect(find.text('Network error'), findsOneWidget);
+  });
+}
+```
+
+### Testing with Bloc
+
+```dart
+import 'package:bloc_test/bloc_test.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:mocktail/mocktail.dart';
+
+class MockCounterBloc extends MockBloc<CounterEvent, CounterState>
+    implements CounterBloc {}
+
+void main() {
+  late MockCounterBloc mockBloc;
+
+  setUp(() {
+    mockBloc = MockCounterBloc();
+  });
+
+  testWidgets('displays current count', (tester) async {
+    when(() => mockBloc.state).thenReturn(const CounterState(value: 42));
+
+    await tester.pumpWidget(
+      MaterialApp(
+        home: BlocProvider<CounterBloc>.value(
+          value: mockBloc,
+          child: const CounterScreen(),
+        ),
+      ),
+    );
+
+    expect(find.text('42'), findsOneWidget);
+  });
+
+  testWidgets('calls increment on button tap', (tester) async {
+    when(() => mockBloc.state).thenReturn(const CounterState(value: 0));
+
+    await tester.pumpWidget(
+      MaterialApp(
+        home: BlocProvider<CounterBloc>.value(
+          value: mockBloc,
+          child: const CounterScreen(),
+        ),
+      ),
+    );
+
+    await tester.tap(find.byIcon(Icons.add));
+
+    verify(() => mockBloc.add(CounterIncremented())).called(1);
+  });
+}
+```
+
+## Bloc Tests
+
+```dart
+import 'package:bloc_test/bloc_test.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:mocktail/mocktail.dart';
+
+class MockUserRepository extends Mock implements UserRepository {}
+
+void main() {
+  late MockUserRepository mockRepository;
+
+  setUp(() {
+    mockRepository = MockUserRepository();
+  });
+
+  group('UserBloc', () {
+    blocTest<UserBloc, UserState>(
+      'emits loading then success when user loaded',
+      setUp: () {
+        when(() => mockRepository.getUser())
+            .thenAnswer((_) async => User(name: 'Test'));
+      },
+      build: () => UserBloc(repository: mockRepository),
+      act: (bloc) => bloc.add(UserRequested()),
+      expect: () => [
+        const UserState(status: UserStatus.loading),
+        UserState(status: UserStatus.success, user: User(name: 'Test')),
+      ],
+    );
+
+    blocTest<UserBloc, UserState>(
+      'emits loading then failure when error occurs',
+      setUp: () {
+        when(() => mockRepository.getUser())
+            .thenThrow(Exception('Network error'));
+      },
+      build: () => UserBloc(repository: mockRepository),
+      act: (bloc) => bloc.add(UserRequested()),
+      expect: () => [
+        const UserState(status: UserStatus.loading),
+        isA<UserState>()
+            .having((s) => s.status, 'status', UserStatus.failure),
+      ],
+    );
+  });
+}
+```
+
+## Unit Tests
+
+```dart
+import 'package:flutter_test/flutter_test.dart';
+
+void main() {
+  group('Validator', () {
+    test('returns error for empty email', () {
+      expect(Validator.email(''), 'Email is required');
+    });
+
+    test('returns error for invalid email', () {
+      expect(Validator.email('invalid'), 'Invalid email format');
+    });
+
+    test('returns null for valid email', () {
+      expect(Validator.email('test@example.com'), isNull);
+    });
+  });
+
+  group('Calculator', () {
+    late Calculator calculator;
+
+    setUp(() {
+      calculator = Calculator();
+    });
+
+    test('adds two numbers', () {
+      expect(calculator.add(2, 3), 5);
+    });
+
+    test('throws on division by zero', () {
+      expect(() => calculator.divide(10, 0), throwsArgumentError);
+    });
+  });
+}
+```
+
+## Mocking with Mocktail
+
+```dart
+import 'package:mocktail/mocktail.dart';
+
+// Create mock classes
+class MockApiService extends Mock implements ApiService {}
+class MockStorageService extends Mock implements StorageService {}
+
+// Register fallback values for complex types
+setUpAll(() {
+  registerFallbackValue(User(name: 'fallback'));
+});
+
+void main() {
+  late MockApiService mockApi;
+
+  setUp(() {
+    mockApi = MockApiService();
+  });
+
+  test('fetches user from API', () async {
+    // Arrange
+    when(() => mockApi.getUser(any()))
+        .thenAnswer((_) async => User(name: 'Test'));
+
+    // Act
+    final repository = UserRepository(api: mockApi);
+    final user = await repository.getUser('123');
+
+    // Assert
+    expect(user.name, 'Test');
+    verify(() => mockApi.getUser('123')).called(1);
+  });
+}
+```
+
+## Integration Tests
+
+```dart
+// integration_test/app_test.dart
+import 'package:flutter_test/flutter_test.dart';
+import 'package:integration_test/integration_test.dart';
+import 'package:my_app/main.dart' as app;
+
+void main() {
+  IntegrationTestWidgetsFlutterBinding.ensureInitialized();
+
+  testWidgets('complete login flow', (tester) async {
+    app.main();
+    await tester.pumpAndSettle();
+
+    // Navigate to login
+    await tester.tap(find.text('Login'));
+    await tester.pumpAndSettle();
+
+    // Enter credentials
+    await tester.enterText(
+      find.byKey(const Key('email_field')),
+      'test@example.com',
+    );
+    await tester.enterText(
+      find.byKey(const Key('password_field')),
+      'password123',
+    );
+
+    // Submit form
+    await tester.tap(find.text('Sign In'));
+    await tester.pumpAndSettle();
+
+    // Verify navigation to home
+    expect(find.text('Welcome'), findsOneWidget);
+  });
+}
+```
+
+Run integration tests:
+
+```bash
+flutter test integration_test/app_test.dart
+```
+
+## Test Helpers
+
+```dart
+// test/helpers/pump_app.dart
+extension PumpApp on WidgetTester {
+  Future<void> pumpApp(Widget widget, {List<Override>? overrides}) {
+    return pumpWidget(
+      ProviderScope(
+        overrides: overrides ?? [],
+        child: MaterialApp(
+          home: widget,
+        ),
+      ),
+    );
+  }
+}
+
+// Usage
+await tester.pumpApp(const MyWidget());
+```
+
+## Golden Tests
+
+```dart
+testWidgets('matches golden', (tester) async {
+  await tester.pumpWidget(const MaterialApp(home: MyWidget()));
+
+  await expectLater(
+    find.byType(MyWidget),
+    matchesGoldenFile('goldens/my_widget.png'),
+  );
+});
+```
+
+Update goldens:
+
+```bash
+flutter test --update-goldens
+```
+
+## Testing Checklist
+
+| Test Type | What to Test |
+|-----------|--------------|
+| Widget tests | UI rendering, user interactions, state changes |
+| Bloc tests | Event → state transitions, async operations |
+| Unit tests | Validators, formatters, utilities, models |
+| Integration tests | Critical user flows, navigation |
+
+---
+
+*Flutter and flutter_test are trademarks of Google LLC.*

package/skills/flutter-dev/references/widget-patterns.md

@@ -0,0 +1,233 @@
+# Widget Patterns
+
+Flutter widget best practices covering const optimization, responsive layouts, hooks, and sliver patterns.
+
+## Optimized Widget Pattern
+
+Always use `const` constructors for static widgets to prevent unnecessary rebuilds:
+
+```dart
+class OptimizedCard extends StatelessWidget {
+  final String title;
+  final VoidCallback onTap;
+
+  const OptimizedCard({
+    super.key,
+    required this.title,
+    required this.onTap,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      child: InkWell(
+        onTap: onTap,
+        child: Padding(
+          padding: const EdgeInsets.all(16),
+          child: Text(title, style: Theme.of(context).textTheme.titleMedium),
+        ),
+      ),
+    );
+  }
+}
+```
+
+### Extracting Const Widgets
+
+```dart
+class MyScreen extends StatelessWidget {
+  const MyScreen({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: const [
+        _Header(),
+        _Body(),
+        _Footer(),
+      ],
+    );
+  }
+}
+
+class _Header extends StatelessWidget {
+  const _Header();
+
+  @override
+  Widget build(BuildContext context) {
+    return const Text('Header');
+  }
+}
+```
+
+## Responsive Layout
+
+```dart
+class ResponsiveLayout extends StatelessWidget {
+  final Widget mobile;
+  final Widget? tablet;
+  final Widget desktop;
+
+  const ResponsiveLayout({
+    super.key,
+    required this.mobile,
+    this.tablet,
+    required this.desktop,
+  });
+
+  static const double mobileBreakpoint = 650;
+  static const double desktopBreakpoint = 1100;
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        if (constraints.maxWidth >= desktopBreakpoint) return desktop;
+        if (constraints.maxWidth >= mobileBreakpoint) return tablet ?? mobile;
+        return mobile;
+      },
+    );
+  }
+}
+```
+
+### Breakpoint Reference
+
+| Type | Width | Usage |
+|------|-------|-------|
+| Mobile | < 650pt | Single column, bottom nav |
+| Tablet | 650-1100pt | Two columns, side nav optional |
+| Desktop | > 1100pt | Multi-column, persistent nav |
+
+## Custom Hooks (flutter_hooks)
+
+```dart
+import 'package:flutter_hooks/flutter_hooks.dart';
+
+class CounterWidget extends HookWidget {
+  const CounterWidget({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final counter = useState(0);
+    final controller = useTextEditingController();
+    final isMounted = useIsMounted();
+
+    useEffect(() {
+      debugPrint('Widget mounted');
+      return () {
+        debugPrint('Widget disposed');
+      };
+    }, const []);
+
+    return Column(
+      children: [
+        Text('Count: ${counter.value}'),
+        ElevatedButton(
+          onPressed: () => counter.value++,
+          child: const Text('Increment'),
+        ),
+        TextField(controller: controller),
+      ],
+    );
+  }
+}
+```
+
+### Common Hooks
+
+| Hook | Purpose |
+|------|---------|
+| `useState` | Local state management |
+| `useEffect` | Side effects with cleanup |
+| `useMemoized` | Expensive computation caching |
+| `useTextEditingController` | Text field controller |
+| `useAnimationController` | Animation controller |
+| `useFocusNode` | Focus management |
+| `useIsMounted` | Check if widget is mounted |
+
+## Sliver Patterns
+
+```dart
+CustomScrollView(
+  slivers: [
+    SliverAppBar(
+      expandedHeight: 200,
+      pinned: true,
+      flexibleSpace: FlexibleSpaceBar(
+        title: const Text('Title'),
+        background: Image.network(imageUrl, fit: BoxFit.cover),
+      ),
+    ),
+    SliverPadding(
+      padding: const EdgeInsets.all(16),
+      sliver: SliverList(
+        delegate: SliverChildBuilderDelegate(
+          (context, index) => ListTile(
+            key: ValueKey(items[index].id),
+            title: Text(items[index].title),
+          ),
+          childCount: items.length,
+        ),
+      ),
+    ),
+    const SliverToBoxAdapter(
+      child: Padding(
+        padding: EdgeInsets.all(16),
+        child: Text('Footer'),
+      ),
+    ),
+  ],
+)
+```
+
+### Sliver Types
+
+| Sliver | Usage |
+|--------|-------|
+| `SliverAppBar` | Collapsing app bar |
+| `SliverList` | Lazy list |
+| `SliverGrid` | Lazy grid |
+| `SliverToBoxAdapter` | Single non-sliver widget |
+| `SliverPadding` | Add padding to sliver |
+| `SliverFillRemaining` | Fill remaining space |
+
+## Key Usage Patterns
+
+```dart
+ListView.builder(
+  itemCount: items.length,
+  itemBuilder: (context, index) {
+    final item = items[index];
+    return Dismissible(
+      key: ValueKey(item.id),
+      child: ListTile(
+        key: ValueKey('tile_${item.id}'),
+        title: Text(item.title),
+      ),
+    );
+  },
+)
+```
+
+| Key Type | When to Use |
+|----------|-------------|
+| `ValueKey` | Unique ID available |
+| `ObjectKey` | Object identity matters |
+| `UniqueKey` | Force rebuild |
+| `GlobalKey` | Access state across tree |
+
+## Optimization Checklist
+
+| Pattern | Implementation |
+|---------|----------------|
+| const widgets | Add `const` to static widgets |
+| Keys | Use `ValueKey` for list items |
+| Select | `ref.watch(provider.select(...))` |
+| RepaintBoundary | Isolate expensive repaints |
+| ListView.builder | Lazy loading for lists |
+| const constructors | Always use when possible |
+
+---
+
+*Flutter and Material Design are trademarks of Google LLC.*