
#REDUX OBSERVABLE CODE#
You may also clone this tutorial’s GitHub repo and code on the master branch. I’ll be using my React/Redux starter with its peculiar file structure. Setupįind and clone a React/Redux starter kit. It’s completely optional, but I love it for reducing so much Redux boilerplate.

I don’t mean to complicate this tutorial, but I’m using Eric Elliott’s Autodux library to create our actions/reducer.

This requires some RxJS knowledge, but fear not if you’re unfamiliar with it–we’ll go step by step. We’ll use Redux-Observable and cover the details later. If your app’s entirely pure functions, how do you perform useful side effects like HTTP calls and UI changes? You need some “process manager” listening to your actions, waiting to perform a side effect and fire another action in response. Our container (Redux-connected) component will just be pure functions, with the help of Recompose. If you want React, using only functions + several useful helpers, this library’s for you. We’ll sparingly use it, so I have multiple articles on it if you’re further interested. I’ve truly grasped concepts like higher-order functions, currying, and point-free programming through this library. Its > 200 functions help enforce a purely FP style. Going in that order: RamdaĪ JavaScript functional programming utility belt. I could switch all my tests over to marble tests, but I was hoping to find a straightforward replacement for the ActionsObservable that plays nice with takeUntil.In this tutorial, we’ll build a signup UI using React/Redux and three of my favorite libraries: Ramda, Recompose, and Redux-Observable. I tried a variety of approaches creating the action$ stream with an async scheduler, but couldn’t see any change in behaviour. The code behaves as expected in the app, but not under test due the the synchronous ActionsObservable being used. TakeUntil(action$.pipe(ofType(LOGOUT_SUCCESS))) Here’s the test: it('should receive a websocket message', done => ) => onSocketMessageAction(payload)),ĬatchError(e => of(onSocketErrorAction(e))), As the action$ stream being synchronous, takeUntil causes the subscription to never be made, due to a recent change in behaviour #3504. I’ve been using ActionsObservable in my tests for a little while, but recently found a problem in my tests once takeUntil was added to an epic. Which versions of redux-observable, and which browser and OS are affected by this issue? Did this work in previous versions of redux-observable? I’m trying to read through the sources to see if I’m understanding right and working on a wip branch to migrate to RxJS 6 and redux-observable 1 so I wanted to make sure I migrate my tests idiomatically.
#REDUX OBSERVABLE HOW TO#
So instead of exporting the ActionsObservable you change the documentation to show a user how to use rxjs’s of and from? The ones on the ActionsObservable seem to be pass-throughs.Īs for the StateObservable I can’t say that’s as straightforward but it’d be nice to have the creation method pattern for both be like using the creation functions from RxJS 6. The static class methods are all going away in favor of creation functions.

I noticed that these observables are going to remain in existence (or exist in the case of StateObservable) but they kind of go counter to the new way of creating Observables in RxJS 6.
