Redux saga error: 'Effects runner is not a function'

Question

Redux saga error: 'Effects runner is not a function'

coderwithattitude opened this issue 6 years ago · 15 comments

Hello,
each time i call the saga middleware i keep getting this error

chunk-e922c950.js:167 TypeError: effectRunner is not a function
    at runEffect (redux-saga-core.esm.js:1222)
    at digestEffect (redux-saga-core.esm.js:1289)
    at next (redux-saga-core.esm.js:1179)
    at proc (redux-saga-core.esm.js:1126)
    at eval (redux-saga-core.esm.js:609)
    at immediately (redux-saga-core.esm.js:80)
    at runForkEffect (redux-saga-core.esm.js:608)
    at runEffect (redux-saga-core.esm.js:1222)
    at digestEffect (redux-saga-core.esm.js:1289)
    at eval (redux-saga-core.esm.js:697)
logError @ chunk-e922c950.js:167
end @ redux-saga-core.esm.js:1023
abort @ redux-saga-core.esm.js:837
(anonymous) @ redux-saga-core.esm.js:618
immediately @ redux-saga-core.esm.js:80
runForkEffect @ redux-saga-core.esm.js:608
runEffect @ redux-saga-core.esm.js:1222
digestEffect @ redux-saga-core.esm.js:1289
(anonymous) @ redux-saga-core.esm.js:697
runAllEffect @ redux-saga-core.esm.js:696
runEffect @ redux-saga-core.esm.js:1222
digestEffect @ redux-saga-core.esm.js:1289
next @ redux-saga-core.esm.js:1179
proc @ redux-saga-core.esm.js:1126
(anonymous) @ redux-saga-core.esm.js:1385
immediately @ redux-saga-core.esm.js:80
runSaga @ redux-saga-core.esm.js:1384
sagaMiddleware.run @ redux-saga-core.esm.js:1445
(anonymous) @ store.js:57
(anonymous) @ store.js:84
./src/store.js @ app.bundle.js?aa4dade6182cb4c30ec6:34896
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ App.js:51
(anonymous) @ App.js:117
./src/App.js @ app.bundle.js?aa4dade6182cb4c30ec6:34346
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ index.js:17
(anonymous) @ index.js:54
./src/index.js @ app.bundle.js?aa4dade6182cb4c30ec6:34620
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ client:3
1 @ app.bundle.js?aa4dade6182cb4c30ec6:34990
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
checkDeferredModules @ app.bundle.js?aa4dade6182cb4c30ec6:46
(anonymous) @ app.bundle.js?aa4dade6182cb4c30ec6:858
(anonymous) @ app.bundle.js?aa4dade6182cb4c30ec6:861
chunk-e922c950.js:168 The above error occurred in task accountsSaga
    created by root
Tasks cancelled due to error:
root
logError @ chunk-e922c950.js:168
end @ redux-saga-core.esm.js:1023
abort @ redux-saga-core.esm.js:837
(anonymous) @ redux-saga-core.esm.js:618
immediately @ redux-saga-core.esm.js:80
runForkEffect @ redux-saga-core.esm.js:608
runEffect @ redux-saga-core.esm.js:1222
digestEffect @ redux-saga-core.esm.js:1289
(anonymous) @ redux-saga-core.esm.js:697
runAllEffect @ redux-saga-core.esm.js:696
runEffect @ redux-saga-core.esm.js:1222
digestEffect @ redux-saga-core.esm.js:1289
next @ redux-saga-core.esm.js:1179
proc @ redux-saga-core.esm.js:1126
(anonymous) @ redux-saga-core.esm.js:1385
immediately @ redux-saga-core.esm.js:80
runSaga @ redux-saga-core.esm.js:1384
sagaMiddleware.run @ redux-saga-core.esm.js:1445
(anonymous) @ store.js:57
(anonymous) @ store.js:84
./src/store.js @ app.bundle.js?aa4dade6182cb4c30ec6:34896
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ App.js:51
(anonymous) @ App.js:117
./src/App.js @ app.bundle.js?aa4dade6182cb4c30ec6:34346
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ index.js:17
(anonymous) @ index.js:54
./src/index.js @ app.bundle.js?aa4dade6182cb4c30ec6:34620
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ client:3
1 @ app.bundle.js?aa4dade6182cb4c30ec6:34990
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
checkDeferredModules @ app.bundle.js?aa4dade6182cb4c30ec6:46
(anonymous) @ app.bundle.js?aa4dade6182cb4c30ec6:858
(anonymous) @ app.bundle.js?aa4dade6182cb4c30ec6:861
chunk-e922c950.js:167 TypeError: effectRunner is not a function
    at runEffect (redux-saga-core.esm.js:1222)
    at digestEffect (redux-saga-core.esm.js:1289)
    at next (redux-saga-core.esm.js:1179)
    at proc (redux-saga-core.esm.js:1126)
    at eval (redux-saga-core.esm.js:609)
    at immediately (redux-saga-core.esm.js:80)
    at runForkEffect (redux-saga-core.esm.js:608)
    at runEffect (redux-saga-core.esm.js:1222)
    at digestEffect (redux-saga-core.esm.js:1289)
    at eval (redux-saga-core.esm.js:697)
logError @ chunk-e922c950.js:167
end @ redux-saga-core.esm.js:1023
abort @ redux-saga-core.esm.js:837
(anonymous) @ redux-saga-core.esm.js:618
immediately @ redux-saga-core.esm.js:80
runForkEffect @ redux-saga-core.esm.js:608
runEffect @ redux-saga-core.esm.js:1222
digestEffect @ redux-saga-core.esm.js:1289
(anonymous) @ redux-saga-core.esm.js:697
runAllEffect @ redux-saga-core.esm.js:696
runEffect @ redux-saga-core.esm.js:1222
digestEffect @ redux-saga-core.esm.js:1289
next @ redux-saga-core.esm.js:1179
proc @ redux-saga-core.esm.js:1126
(anonymous) @ redux-saga-core.esm.js:1385
immediately @ redux-saga-core.esm.js:80
runSaga @ redux-saga-core.esm.js:1384
sagaMiddleware.run @ redux-saga-core.esm.js:1445
(anonymous) @ store.js:57
(anonymous) @ store.js:84
./src/store.js @ app.bundle.js?aa4dade6182cb4c30ec6:34896
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ App.js:51
(anonymous) @ App.js:117
./src/App.js @ app.bundle.js?aa4dade6182cb4c30ec6:34346
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ index.js:17
(anonymous) @ index.js:54
./src/index.js @ app.bundle.js?aa4dade6182cb4c30ec6:34620
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ client:3
1 @ app.bundle.js?aa4dade6182cb4c30ec6:34990
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
checkDeferredModules @ app.bundle.js?aa4dade6182cb4c30ec6:46
(anonymous) @ app.bundle.js?aa4dade6182cb4c30ec6:858
(anonymous) @ app.bundle.js?aa4dade6182cb4c30ec6:861
chunk-e922c950.js:168 The above error occurred in task accountBalancesSaga
    created by root
Tasks cancelled due to error:
root
logError @ chunk-e922c950.js:168
end @ redux-saga-core.esm.js:1023
abort @ redux-saga-core.esm.js:837
(anonymous) @ redux-saga-core.esm.js:618
immediately @ redux-saga-core.esm.js:80
runForkEffect @ redux-saga-core.esm.js:608
runEffect @ redux-saga-core.esm.js:1222
digestEffect @ redux-saga-core.esm.js:1289
(anonymous) @ redux-saga-core.esm.js:697
runAllEffect @ redux-saga-core.esm.js:696
runEffect @ redux-saga-core.esm.js:1222
digestEffect @ redux-saga-core.esm.js:1289
next @ redux-saga-core.esm.js:1179
proc @ redux-saga-core.esm.js:1126
(anonymous) @ redux-saga-core.esm.js:1385
immediately @ redux-saga-core.esm.js:80
runSaga @ redux-saga-core.esm.js:1384
sagaMiddleware.run @ redux-saga-core.esm.js:1445
(anonymous) @ store.js:57
(anonymous) @ store.js:84
./src/store.js @ app.bundle.js?aa4dade6182cb4c30ec6:34896
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ App.js:51
(anonymous) @ App.js:117
./src/App.js @ app.bundle.js?aa4dade6182cb4c30ec6:34346
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ index.js:17
(anonymous) @ index.js:54
./src/index.js @ app.bundle.js?aa4dade6182cb4c30ec6:34620
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
fn @ app.bundle.js?aa4dade6182cb4c30ec6:150
(anonymous) @ client:3
1 @ app.bundle.js?aa4dade6182cb4c30ec6:34990
__webpack_require__ @ app.bundle.js?aa4dade6182cb4c30ec6:782
checkDeferredModules @ app.bundle.js?aa4dade6182cb4c30ec6:46
(anonymous) @ app.bundle.js?aa4dade6182cb4c30ec6:858
(anonymous) @ app.bundle.js?aa4dade6182cb4c30ec6:861
redux-saga-core.esm.js:1033 Uncaught TypeError: Cannot read property 'forEach' of null
    at end (redux-saga-core.esm.js:1033)
    at Object.abort (redux-saga-core.esm.js:837)
    at eval (redux-saga-core.esm.js:618)
    at immediately (redux-saga-core.esm.js:80)
    at runForkEffect (redux-saga-core.esm.js:608)
    at runEffect (redux-saga-core.esm.js:1222)
    at digestEffect (redux-saga-core.esm.js:1289)
    at eval (redux-saga-core.esm.js:697)
    at Array.forEach (<anonymous>)
    at runAllEffect (redux-saga-core.esm.js:696)

below is my code

rootSaga.js

import { all, fork } from 'redux-saga/effects';
import { drizzleSagas } from 'drizzle';

export default function* root() {
    yield all(
        drizzleSagas.map(saga => fork(saga))
    );
}

store.js

//import createHistory from 'history/createBrowserHistory';
import { createStore, applyMiddleware, compose } from 'redux';
import thunkMiddleware from 'redux-thunk';
import { routerMiddleware } from 'react-router-redux'
import reducer from './reducer';
import rootSaga from './rootSaga';
import createSagaMiddleware from 'redux-saga';
import { generateContractsInitialState } from 'drizzle';
import drizzleOptions from './drizzleOptions';

// instantiate redux devtools to visualize state
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

//const history = createHistory();

// instantiate middleware objects "react-router": "3.2.0",
const routingMiddleware = routerMiddleware(history);
const sagaMiddleware = createSagaMiddleware();

const initialState = {
  contracts: generateContractsInitialState(drizzleOptions)
};

const store = createStore(
    reducer,
    initialState,
    composeEnhancers(
      applyMiddleware(
        thunkMiddleware,
        routingMiddleware,
       sagaMiddleware
    )
  )
);
sagaMiddleware.run(rootSaga);

//export { history };
export { store };

export default store;

please help

coderwithattitude commented 6 years ago

ok thanks

Answer 1 · 2019-03-08T19:23:02.000Z

Transferred because this appears to be a drizzle issue rather than drizzle-react. Please correct me if I'm wrong.

Answer 2 · 2019-03-11T18:27:04.000Z

@coderwithattitude Are you trying to add sagas to drizzle's saga middleware?

Answer 3 · 2019-03-12T10:10:17.000Z

@cds-amal yes i am

Answer 4 · 2019-03-12T11:44:02.000Z

@coderwithattitude I'm currently working on a feature branch that allows sagas, and their associated reducers to be passed to Drizzle's generateStore. Please let me know if this helps with your use case.

An example of how it could be used is:

import { generateStore } from 'drizzle'
import drizzleOptions from '../drizzleOptions'
import { put, takeEvery } from 'redux-saga/effects'

const todoReducer = (state = {}, action) => {
  if (action.type === 'TODO') {
    console.log('TODO action', action)
    return action.joke
  }
  return state
}

// Retrieve a todo then dispatch it to store
//
function * fetchTodo() {
  const joke = yield fetch('https://jsonplaceholder.typicode.com/todos/1')
    .then(response => response.json())
    .then(json => json)
  yield put({ type: 'TODO', joke })
}

//  App saga
//
function* appSaga() {
  yield takeEvery('LOOKUP_TODO', fetchTodo)
}

// Register app reducers to be incorporated into drizzle's redux store.
const appReducers = {
  todo: todoReducer
}

// Declare your app has Sagas to be registered
const appSagas = [appSaga]

const store = generateStore({
  drizzleOptions,
  appReducers,
  appSagas,
  disableReduxDevTools: false  // enable ReduxDevTools!
})

// Use the store with DrizzleProvider
export default store

Answer 5 · 2019-03-19T13:45:12.000Z

@coderwithattitude I'm unable to reproduce this issue. Are you using your own redux store with drizzle? Can you share your project/repo?

Answer 6 · 2019-03-29T12:32:22.000Z

This issue seems to be related to https://github.com/trufflesuite/drizzle/issues/168 (getting the same error while attempting to upgrade redux-saga from 0.16.x to 1.0.x).

Answer 7 · 2019-04-20T07:04:00.000Z

@coderwithattitude did you solve this? I just upgraded and got this issue.

Answer 8 · 2019-04-20T18:07:59.000Z

@dangell7 We're working on upgrading this. Redux-saga 1.0 introduced some breaking changes in regards to some effects that have to be accounted for.

Answer 9 · 2019-04-29T17:03:51.000Z

babel-plugin-redux-saga promises to produce better errors

Answer 10 · 2019-04-29T20:21:05.000Z

@cds-amal Are you saying you want me to upgrade and give you the results? Or that maybe its something in my app and not the repo?

Answer 11 · 2019-04-29T21:09:43.000Z

Sorry @dangell7. I left this note to remember to investigate that package when we upgrade to Redux-saga 1.0. I believe the way errors are returned from side-effects can be improved with it.

Answer 12 · 2019-05-28T09:25:19.000Z

Hi, to what extent is this issue being clarified? I am getting the same error when trying to combine my redux store with drizzle's store. Front-end project is using redux-saga 1.0.1 dependency.

Answer 13 · 2019-07-27T10:24:16.000Z

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Answer 14 · 2019-08-03T11:19:18.000Z

This issue has been closed, but can be re-opened if further comments indicate that the problem persists. Feel free to tag maintainers if there is no reply to further comments.