My StateNotifier Test Fails Unexpectedly

[maherelamary]

Testing My StateNotifier Provider Success State Fails

We test that the StateNotifierProvider listener changed from AsyncLoading to AsyncData, but the test finished before it reach this state, awaiting for Duration solves the issue.

this issue happens when StateNotifier's constructor calling method, which updates the state and notify listeners.

Could you explain why this happening?. Do u recommend refactor provider to be AsyncNotifier ?.

Here's my provider...

final mainCategoriesProvider = StateNotifierProvider<MainCategoriesProvider, AsyncValue<List<MainCategoryItem>>>(
  (ref) {
    return MainCategoriesProvider(
      getMainCategoriesUsecase: ref.watch(getMainCategoriesUsecaseProvider),
    );
  },
);

class MainCategoriesProvider extends StateNotifier<AsyncValue<List<MainCategoryItem>>> {
  MainCategoriesProvider({required this.getMainCategoriesUsecase}) : super(const AsyncValue.loading()) {
    getMainCategories();
  }

  final GetMainCategoriesUsecase getMainCategoriesUsecase;

  Future<void> getMainCategories() async {
    final result = await getMainCategoriesUsecase(NoParams());
    result.when(
      success: (data) => state = AsyncValue.data(data),
      failure: (failure) => state = AsyncValue.error(failure, StackTrace.current),
    );
  }
}

Here's my test file ...

class MockGetMainCategoriesUsecase extends Mock implements GetMainCategoriesUsecase {}

void main() {
  late ProviderContainer container;
  late MockGetMainCategoriesUsecase usecase;
  setUpAll(() {
    registerFallbackValue(NoParams());
    registerFallbackValue(const AsyncValue<List<MainCategoryItem>>.data([]));
  });
  setUp(() {
    usecase = MockGetMainCategoriesUsecase();
    container = createContainer(
      overrides: [
        getMainCategoriesUsecaseProvider.overrideWithValue(usecase),
      ],
    );
  });

  test('provider state should be AsyncData on success', () async {
    const tResult = Result<ResultErrorType, List<MainCategoryItem>>.success([]);
    final listener = Listener<AsyncValue<List<MainCategoryItem>>>();

    when(() => usecase(any())).thenAnswer((_) async => tResult);

    container.listen(mainCategoriesProvider, listener.call, fireImmediately: true);

    /// Uncomment in order to test to pass
    //await Future.delayed(const Duration(seconds: 1));

    verifyInOrder([
      () => listener(null, const AsyncLoading<List<MainCategoryItem>>()),
      () => listener(const AsyncLoading<List<MainCategoryItem>>(), const AsyncValue<List<MainCategoryItem>>.data([])),
    ]);
  });
}

* It seems that the test was finished, before the provider state updated?!!