Redux middleware blocks Saga actions' way to reducer

redux-middleware-block-reducer.js

  describe.only('middleware 101', () => {
    let store, stateHistory, dispatched
    beforeEach(()=>{
      const defaultState = { text: 'initial state' }

      function reducer(state = defaultState, action) {
        switch (action.type) {
          case 'SIDE_EFFECT_USER_FETCH':
            return { text: 'THIS HAS FAILED TO BE ESCAPED!!!!'}
          case 'say':
            return { text: action.payload}
          case 'USER_FETCH_REQUESTED':
            return { text: 'USER_FETCH_REQUESTED'}
          case 'USER_FETCH_SUCCEEDED':
            return { text: 'USER_FETCH_SUCCEEDED', message: action.message}
          case 'USER_FETCH_FAILED':
            return { text: 'USER_FETCH_FAILED'}
          default:
            return state
        }
      }

      function asyncThing(payload) {
        return new Promise(resolve => {
          console.log('inside asyncThing')
          setTimeout(() => {
            console.log('timeout finished')
            resolve(payload)
          }, 50)
        })
      }

      function* fetchUser(action) {
        try {
          yield put({type: 'USER_FETCH_REQUESTED'})
          console.log('inside fetchUser')
          const message = yield call(asyncThing, action.payload);
          console.log('got message: ', message)
          yield put({type: "USER_FETCH_SUCCEEDED", message: message});
          console.log('finished saga fetchUser')
        } catch (e) {
          console.log('got error')
          yield put({type: "USER_FETCH_FAILED", error: e});
        }
      }

      function* mySaga() {
        yield* takeEvery("SIDE_EFFECT_USER_FETCH", fetchUser);
      }

      const sagaMiddleware = createSagaMiddleware()

      const blockSideEffectMiddleware = store => next => action => {
        if (action.type.match(/^SIDE_EFFECT/)) {
          console.log('block saga!')
        } else {
          return next(action)
        }
      }

      dispatched = []

      const logMiddleware = store => next => action => {
        dispatched.push(JSON.stringify(action))
        return next(action)
      }

      store = createStore(
        reducer,
        applyMiddleware(logMiddleware, sagaMiddleware, blockSideEffectMiddleware)
      )

      sagaMiddleware.run(mySaga)

      store.subscribe(() => {
        coordinator(store.getState())
      })

      stateHistory = [store.getState()]

      function coordinator(state:mixed):Action {
        stateHistory.push(state)
      }
    })

    it('just works', () => {
      store.dispatch({ type: "say", payload: 'Hello world' })
      expect(stateHistory).to.eql([
        { "text": 'initial state' },
        { "text": 'Hello world' }
      ])
    })

    it('always trigger subscription upon action received by reducer', () => {
      store.dispatch({ type: 'no-such-a-action-handler' })
      expect(stateHistory).to.eql([
        { "text": 'initial state' },
        { "text": 'initial state' }
      ])
    })

    it('blocks saga actions', () => {
      store.dispatch({ type: "SIDE_EFFECT", payload: 'Hello world' })
      expect(stateHistory).to.eql([
        { "text": 'initial state' }
      ])
    })
    
    it('triggers saga', done => {
      store.dispatch({ type: "SIDE_EFFECT_USER_FETCH", payload: 'say what' })
      setTimeout(() => {
        expect(stateHistory).to.eql([
          { "text": 'initial state' },
          { "text": "USER_FETCH_REQUESTED" },
          { "text": "USER_FETCH_SUCCEEDED", "message": "say what" }
        ])
        expect(dispatched).to.eql([
          "{\"type\":\"SIDE_EFFECT_USER_FETCH\",\"payload\":\"say what\"}",
          "{\"type\":\"USER_FETCH_REQUESTED\"}",
          "{\"type\":\"USER_FETCH_SUCCEEDED\",\"message\":\"say what\"}"
        ])
        done()
      }, 100)
    })

    it('triggers saga tasks parallelly', done => {
      store.dispatch({ type: "SIDE_EFFECT_USER_FETCH", payload: 'say what' })
      store.dispatch({ type: "SIDE_EFFECT_USER_FETCH", payload: 'say what' })
      store.dispatch({ type: "SIDE_EFFECT_USER_FETCH", payload: 'say what' })
      setTimeout(() => {
        expect(stateHistory).to.eql([
          { "text": 'initial state' },
          { "text": "USER_FETCH_REQUESTED" },
          { "text": "USER_FETCH_REQUESTED" },
          { "text": "USER_FETCH_REQUESTED" },
          { "text": "USER_FETCH_SUCCEEDED", "message": "say what" },
          { "text": "USER_FETCH_SUCCEEDED", "message": "say what" },
          { "text": "USER_FETCH_SUCCEEDED", "message": "say what" }
        ])
        expect(dispatched).to.eql([
          "{\"type\":\"SIDE_EFFECT_USER_FETCH\",\"payload\":\"say what\"}",
          "{\"type\":\"USER_FETCH_REQUESTED\"}",
          "{\"type\":\"SIDE_EFFECT_USER_FETCH\",\"payload\":\"say what\"}",
          "{\"type\":\"USER_FETCH_REQUESTED\"}",
          "{\"type\":\"SIDE_EFFECT_USER_FETCH\",\"payload\":\"say what\"}",
          "{\"type\":\"USER_FETCH_REQUESTED\"}",
          "{\"type\":\"USER_FETCH_SUCCEEDED\",\"message\":\"say what\"}",
          "{\"type\":\"USER_FETCH_SUCCEEDED\",\"message\":\"say what\"}",
          "{\"type\":\"USER_FETCH_SUCCEEDED\",\"message\":\"say what\"}"
        ])
        done()
      }, 300)
    })
  })