Testing RxJS Observables With Jest

The snippet below shows you how to text asynchronous RxJS Observables with Jest. It’s probably easier than you think because you can simply

Testing a Single Emitted Value

Let’s imagine we have an Observable that should emit a string, which we can create with the of helper. The key to making this test work is passing it the the done keyword, otherwise it will finish before the data is emitted.

You can then write your expectations inside of the the subscribe callback, then call done() when you’re ready for the test to finish.

import { of } from 'rxjs';

test('the observable emits hello', done => {
  of('hello').subscribe( str => {
    expect(data).toBe('hola');
    done();
  });
});

The test above should fail because hola !== hello.

Testing a Complex Stream

RxJS is all about realtime streams. How might we test an observable the emits multiple values? For that, we will need to listen for the complete signal to be sent. If your Observable is a stream that never completes, you’ll also want to pipe in an operator to force completion, like takeWhile, otherwise Jest will timeout after 5000ms.

import { from } from 'rxjs';

test('the observable interval emits 100 then 200 then 300', done => {
        let last = 100;
        from([100, 200, 300])
        .subscribe({
            next: val => {
                expect(val).toBe(last)
                last += 100
              },
            complete: () => done(),
        })
            
});