Typical events are async event streams and you want to observe over them.Reactive programming is programming with asynchronous data streams. If you want to hop straight into the source code, here it is. I wanted to write tests but just did not know how to.īut I really just wanted to start from the basics - I mean, the very basics, including why, and how we might want to use redux-observable. Most of the network requests were managed by RxJS, and none of them were covered by tests. I was struggling at my company trying to write some tests for redux-observable operations. Furthermore, we stub out ApiService and BookNormalizerService in the beforeEach and afterEach sections.Just a random image like everyone else does (credit: Genessa Panainte from unsplash)
![redux observable redux observable](https://miro.medium.com/max/6184/1*osYIPMNLlZH0glr8q07cpQ.png)
We want to replace our target services and make them return mock values instead. For our tests, we can create a sandbox and allow it to return a mock response. Sandboxes simplify working with test doubles that need restoration and/or verification. We should also concern ourselves with sandboxes when using Sinon. We can use Mocks whenever we would use stubs but need to verify many more specific behaviours on it. They can even call any callback functions provided as parameters. They can also contain custom behaviour, such as returning values or throwing exceptions. Stubs are like spies, except in that they replace the target function. As such, a spy is a good choice to verify something happened. We can use spies to test these return values or errors as well. Impure Function could either return values or throw errors. They could also tell us what arguments each call had. Spies can tell us how many times we called a function. We can use spies to analyze information about function calls. There are three kinds of test doubles - spies, mocks and stubs. We need these Test Doubles to test Impure Functions. Sinon operates on the concept of Test Doubles. You can read more about Impure Functions here. Impure functions have side effects like for example - functions making API calls and so on.
Redux observable code#
Sinon simplifies the process of testing code which contains Impure Functions. We also need to understand why we are using Sinon for this particular testing procedure. Below we present - the codebase referring to this aforesaid books Epic. This redux action comprises of type GET_BOOKS_ERR and the associated error. But, when the ApiService throws an error - we dispatch a different redux action. We dispatch a redux action of type GET_BOOKS_RES along with the corresponding data. We execute all these above operations when the ApiService returns a successful response. The normalizer service does nothing but some data massaging on this response. The JSON data is then moved across a normalizer service. So, we can use Epics to gather some books based information from an ApiService.
Redux observable how to#
This blog post will guide a developer on how to test a Redux Observable based Epic. Yet, not much is available when it comes to unit testing them. There are quite a few blog posts touching on how to write these Epics. Redux Observables allow us to harness the immense power of RxJS operators.
![redux observable redux observable](https://blog.sapzil.org/public/img/2017-07-redux-observable-diagram.png)
![redux observable redux observable](https://cdn-images-1.medium.com/max/1600/1*bs-n555Sttih9t_kivUuzw@2x.png)
But let’s try using redux observables for a change. Thunk and saga are more common choices for the middleware. React Redux Ecosystem uses Redux Observables, which are an RxJS 6 based middleware.