klarna / electron-redux

Use redux in the main and browser processes in electron
MIT License
743 stars 94 forks source link

Use with redux-observable only triggers local epics #304

Closed publicvirtualvoid closed 3 years ago

publicvirtualvoid commented 3 years ago

Using electron-redux@2.0.0-alpha.8 and redux-observable@1.2.0 in a fairly basic configuration. I am not seeing epics defined in the main context triggered by actions dispatched by the renderer context, and vice-versa. Is this expected behaviour? I was really hoping to handle context-dependent side-effects this way. It's entirely possible I'm doing something silly, would someone be able to lend a hand?

Here's the main store:

const epicMiddleware = createEpicMiddleware();
export const store = configureStore({
  reducer: rootReducer,
  middleware: [epicMiddleware],
  enhancers: [stateSyncEnhancer()],
});

const testEpic = (action$: any) =>
  action$.pipe(
    tap((v) => {
      console.log('from main');
      console.log(v);
    }),
    ignoreElements()
  );
const rootEpic = combineEpics(testEpic);
epicMiddleware.run(rootEpic);

And the renderer (mostly identical):

const epicMiddleware = createEpicMiddleware();
export const store = configureStore({
  reducer: rootReducer,
  middleware: [epicMiddleware],
  enhancers: [stateSyncEnhancer()]
});

const testEpic = (action$: any) =>
  action$.pipe(
    tap((v) => {
      console.log('from renderer');
      console.log(v);
    }),
    ignoreElements()
  );
const rootEpic = combineEpics(testEpic);

epicMiddleware.run(rootEpic);
matmalkowski commented 3 years ago

It might be related to middleware & enhancer conflict -> can you try doing with with composeWithStateSync (here is example)

publicvirtualvoid commented 3 years ago

I've ended up with this after some fiddling. It's all running, everything working well! Thanks very much.

export const mainStore = (() => {
  const epicMiddleware = createEpicMiddleware();
  const store = createStore(
    rootReducer,
    composeWithStateSync({})(applyMiddleware(epicMiddleware))
  );

  const testEpic = (action$: any) =>
    action$.pipe(
      tap((v) => {
        console.log('from main');
        console.log(v);
      }),
      ignoreElements()
    );
  const rootEpic = combineEpics(testEpic);

  epicMiddleware.run(rootEpic);
  return store;
})();

Edit: this was actually working fine!

matmalkowski commented 3 years ago

Closing since its resolved now