How to Test a StateNotifiers reaction to a Stream? - flutter

Question

My Setup
I have a StateNotifier whose state is a #freezed class:
#freezed
class MyFreezedState with _$MyFreezedState{
const factory MyFreezedState({
required AsyncValue<int> asyncFreezedStateInt,
}) = MyFreezedState;
}
class MyStateNotifier extends StateNotifier<MyFreezedState>{
const MyStateNotifier(MyFreezedState state) : super(state);
}
Inside the StateNotifier I want to listen to a stream, and set the state's data accordingly, so my final setup looks like this :
final myStateNotifierProvider = Provider<MyStateNotifier, MyFreezedState>((ref) {
final intStream = ref.watch(myIntStreamProvider);
return MyStateNotifier(
MyFreezedState(
asyncFreezedStateInt: AsyncValue.loading(),
),
asyncIntStreamValue : intStream
);
});
class MyStateNotifier extends StateNotifier<MyFreezedState>{
MyStateNotifier (
MyFreezedState state, {
required this.asyncIntStreamValue,
}) : super(state) {
reactToIntStreamChanges();
}
final AsyncValue<int> asyncIntStreamValue;
void reactToIntStreamChanges(){
asyncIntStreamValue.when(
data: (intData) {
state = state.copyWith(asyncFreezedStateInt : AsyncValue.data(intData);
},
error: (err, stk) {
state = state.copyWith(asyncFreezedStateInt : AsyncValue.error(err,stk);
},
loading () {
state = state.copyWith(asyncFreezedStateInt : AsyncValue.loading();
}
}
}
Everything works as expected until here.
The Problem
The problem here is, that I don't know how to properly test the reaction to the stream.
This is my test setup:
void main() {
late ProviderContainer container;
late MockIntService mockIntService;
setUp((){
mockIntService = MockIntService();
container = ProviderContainer(
overrides: [myIntServiceProvider.overrideWithValue(mockIntService)],
);
when(() => mockIntService.myIntStream).thenAnswer((invocation) {
return Stream<int>.fromIterable([1]);
});
})
What I have tried
Doesn't work
//This test fails, the value is still an AsyncValue.loading()
test('should set the states value if stream emits value',(){
final stateValue = container.read(myStateNotifierProvider).asyncFreezedStateInt;
expect(stateValue, AsyncValue.data(1));
});
Works but is hacky and ugly
After doing some research I came up with this solution but I feel like there has to be a better way.
//This test passes, but I feel like this is a bad approach.
test('should set the states value if stream emits value',(){
fakeAsync((async){
container.read(myStateNotifierProvider);
async.elapse(const Duration(milliseconds:100);
final stateValue =
container.read(myStateControllerProvider).asyncFreezedStateInt;
expect(stateValue, AsyncValue.data(1));
});
});
}
EDIT
This is the condensed version of the service where the stream comes from :
final myIntStreamProvider = StreamProvider((ref) {
return ref.read(intServiceProvider).intStream;
});
final intServiceProvider = Provider<BaseTemplateService>((ref) {
return IntService();
});
class IntService {
Stream<Int> get intStream => firestore
.collection("intValues")
.snapshots();
}
Any suggestions are appreciated, thanks!

Answer 1

The firsts container.read() return always loading, because the container.watch() cannot be implemented.
I think it's cleaner this way:
test('should set the states value if stream emits value', () async {
var stateValue = container.read(myStateNotifierProvider);
expect(stateValue, const MyFreezedState.loading());
await Future.delayed(const Duration(seconds: 1));
stateValue = container.read(myStateNotifierProvider);
expect(stateValue, const MyFreezedState.data(AsyncValue.data(1)));
});
State:
#freezed
abstract class MyFreezedState with _$MyFreezedState {
const factory MyFreezedState.loading() = _Loading;
const factory MyFreezedState.data(AsyncValue<int> asyncValue) = _Data;
const factory MyFreezedState.error() = _Error;
}
I hope it's help you!