debug_session / black list actions effects

[weslleyaraujo]

I might have an interesting case with debug_session, giving the following example:

My app has a chunk of initial data fetching like:

FETCH_DATA_X_DONE
FETCH_DATA_Y_DONE
FETCH_DATA_Z_DONE

So when I add debug_session=foo it will persist my state, but after reloading those actions will
be dispatched again and my reducers will process this as it should on the initial page load, bringing
my app to its "initial state".

With this case, I can't really take an advantage of the state persistence feature 😢

a solution could be having a list of actions which will be "skipped" (non-side effects) for the giving debug_session or something similar...

(I found this issue, but I am not sure if we were talking about the same problem)

[zalmoxisus]

Could you please give more details about those actions? What do you use for side effects?

persistState recomputes the actions in order to give you the actual state, as usually during the development we change the reducers. Blacklisting is just visual, otherwise it will result in an inconsistent state.

[weslleyaraujo]

yes definitely, I expressed myself wrongly using the sentence "side effects"

lets say I have a list or "tabs" which will be fetched by an api call triggered on
componendDidMount from my root container, so my tabs reducer would be something like this:

const tabs = (state = [], { type, payload }) => {
  switch(type) {
    case FECTH_TABS_DONE:
      return payload.tabs.map(tab => ({
        ...tab,
        active: false,
      }));

    default:
      return state;
  }
}

As shown above I have an active flag, which I use in order to highlight/show the current tab in my app...which allows me to have a SET_TAB_ACTIVE action:

const tabs = (state = [], { type, payload }) => {
  switch(type) {
    case FECTH_TABS_DONE:
      return payload.tabs.map(tab => ({
        ...tab,
        active: false,
      }));

    case SET_TAB_ACTIVE:
      return state.map(tab => ({
        ...tab,
        active: payload.id === tab.id,
      }));

    default:
      return state;
  }
}

So my goal with debug_session is to persist the active flag of the tab I was working on in that specific session, and it does work fine...

the issue that I am facing is that if I reload the app the persisted state will be inject properly, but componendDidMount will be triggered again, dispatching FECTH_TABS_DONE action, which will eventually bring the active flag for its "initial" false state

[zalmoxisus]

I see. A solution was introduced in v2.3.0. See the description and the example of usage. In componendDidMount you should dispatch actions only when isMonitorAction isn't true.

I will add more details in the docs.

Related to #140.

[weslleyaraujo]

that's great! thanks for clarifying that for me 👍

[zalmoxisus]

There's a better way now to prevent side effects like those while time travelling. See the post for details on how to get it.