Within Angular 8, there exists a service that contains a readonly Observable property. This property is created from a BehaviorSubject<string> which holds a string describing the current state of the service. Additionally, the service includes methods to modify its state.
export class StateService {
private _state = new BehaviorSubject<string>('before');
readonly state$ = this._state.asObservable();
constructor () { }
begin() { this._state.next('during'); }
finish() { this._state.next('after'); }
reset() { this._state.next('before'); }
}
The goal is to conduct marble tests within the Jasmine test suite to effectively evaluate the observable value upon state changes.
let scheduler: TestScheduler;
beforeEach(() => {
scheduler = new TestScheduler((actual, expected) => {
expect(actual).toEqual(expected);
});
});
it('should flow states correctly', () => {
scheduler.run(({expectObservable, flush}) => {
const svc = setupSvc(); //Function call within the suite to initialize the StateService
svc.begin();
svc.finish();
svc.reset();
flush();
expectObservable(svc.state$).toBe('a-b-c-d', {
a: 'before',
b: 'during',
c: 'after',
d: 'before'
});
});
});
Various attempts have been made by invoking begin, finish, reset, and utilizing the scheduler's flush helper. However, the expected outcome consistently displays only the initial value (represented by the a marble) without any further changes.
What crucial element am I overlooking in order to successfully achieve this testing approach? Alternatively, could marbles not be the most appropriate method for testing this scenario?