0

I created a rootSaga in sagas.js as

function* fetchStuff(action) {
   try {
      yield put({type: 'INCREMENT'})
      yield call(delay, 1000)
      yield put({type: 'DECREMENT'})

      const highlights = yield call(API.getStuff, action.data.myObject);
   } catch (e) {
      yield put({type: 'FETCH_STUFF_FAILED', message: e});
   }
}

export default function* rootSaga() {
  yield takeEvery('INIT_LOAD', fetchStuff);
}

I am calling the INIT_LOAD after thirdParty.method:

class myClass extends Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    this.load();
  }

  load = () => {
    this.init = () => {
      this.myObject = thirdParty.method(event => {
        const action = {
          type: 'INIT_LOAD',
          payload: {
            myObject: this.myObject
          }
        };

        store.dispatch(action);
      });
    };

    this.init();
  };

  render() {
    return (
      <div id="render-here" />
    );
  }

Passing the this.myObject in the action that is dispatched does not trigger the saga. If I change the action payload to a string, like the following, the saga is triggered.

const action = {
  type: 'INIT_LOAD',
  payload: {
    myObject: 'this.myObject'
  }
};

Why am I unable to pass this.myObject but a string is ok?

UPDATE: It is not a saga issue. I replicated the same issue with just plain redux. The rootReducer as

export default function rootReducer(state = initialState, action) {
  switch (action.type) {
    case 'INIT_LOAD':
      return Object.assign({}, state, { myObject: action.payload.myObject });
    default:
      return state;
  }
}

As I mentioned in the comment below, assigning it to an object Obj does not change the issue

let Obj = {};
...
load = () => {
  this.init = () => {
    Obj.myObject = thirdParty.method(event => {
      const action = {
        type: 'INIT_LOAD',
        payload: {
          myObj: Obj
        }
      };

      store.dispatch(action);
    });
  };

  this.init();
};

UPDATE2 I cleaned the code up & simply dispatched an action in the component that triggers the saga. Inside the saga is where I do the init(). I ran into another issue where the object that I was trying to save in the redux store has active socket sessions (which were given me cross-domain issues). Although I didn't solve my original problem, not storing a socket object made my problem go away.

M.Holmes
  • 403
  • 1
  • 7
  • 22
  • From what I can see you're assigning `this.myObject` to a `thirdParty.method()`, but you're also using `this.myObject` in the action const within the `thirdParty.method()` callback as well. So you're using `this.myObject` before it's been given an actual value. What value do you want `this.myObject` to have? – megaboy101 Mar 27 '17 at 00:53
  • I'm not entirely sure that is true. If I do it this way: `let myObject = {}` & then `myObject.myMethod = thirdParty.method(...)` & then in my action `payload: { myObject }`, the saga still isn't triggered. – M.Holmes Mar 27 '17 at 01:53

0 Answers0