time travel doesn't work with redux devtools

[phra]

hi,

i'm trying to use the official redux devtools extensions for chrome but i can't use the slider to time travel between states and in the inspector tab i can't revert/skip/dispatch actions.

did someone have experienced the same problem?

[maxime1992]

See https://github.com/ngrx/store-devtools/issues/34#issuecomment-256907397 and give a try with Firefox.

[phra]

@maxime1992 i'm not using immutablejs atm nor the freeze reducer and it's not working on chromium 53.

[wouterter]

See zalmoxisus/redux-devtools-extension#238. Wait till ngrx/store-devtools 3.3.0 becomes available or revert to extension 2.8.3.

[phra]

@woutervandergraaf thank you.

[phra]

i'll leave it open until 3.3.0 is released so people can see it.

[rob3c]

While there are other issues preventing this from working, it looks like one potential issue is in the connect() function in extension.ts. Instead of returning a lambda return () => connection.unsubscribe(); from the wrapping Observable for later invocation when the subscriber cancels the subscription, it calls return connection.subscribe(); directly, thus immediately canceling the subscription for the update stream from the extension.

Here's the current code:

private createChangesObservable(): Observable<any> {
  if (!this.devtoolsExtension) {
    return empty();
  }
  return new Observable(subscriber => {
    const connection = this.devtoolsExtension.connect({ instanceId: this.instanceId });
    connection.subscribe(change => subscriber.next(change));
    return connection.unsubscribe();
  });
}

[zalmoxisus]

The regression should be fixed in 2.8.5 of the extension.

[maxime1992]

@zalmoxisus hi, sorry it took me so long to try it, but the extension is still has a weird behaviour on chrome. The extension version I'm using is 2.9.0.2.

Everything works just fine on Firefox.

Am I missing something ?

If there's anything I can do to help let me know (detailed logs, I can also give you the git project I'm working on as it's open source so maybe you can compare what's wrong between FF and Chrome, etc).

[zalmoxisus]

@maxime1992, yes, please write the exact steps to reproduce the problem with your example. I have been using example-app and it seems to works as expected.

[maxime1992]

example-app probably works because it's not using ImmutableJs, is it ?

To reproduce :

git clone https://gitlab.com/victornoel/petals-cockpit.git
cd petals-cockpit/frontend
npm i
./node_modules/angular-cli/bin/ng serve

Open Chrome and Firefox at http://localhost:4200/cockpit/workspaces.

Open Redux extension on both and try to undo the USR_IS_CONNECTED action. If it works (on Firefox you should see it), the "administrator" text (top left) should be removed.

[phra]

@maxime1992 yeah, the example-app is using the official reducer (meant to be used only in dev env) in order to have immutable structures. look at https://github.com/ngrx/example-app/blob/f15733dd3f3f0346405fdfbd214ea73c6fef00dc/src/app/reducers/index.ts#L26

[maxime1992]

@phra Oh I see. Thanks for pointing that out.

(But still, there's a problem as FF and Chrome app does not handle the same web-app the same way.)

[zalmoxisus]

@maxime1992 thanks for the example. It turns out that 6 days ago when I was testing, it was fixed, but lately some changes "spoiled" it.

The problem is that store-devtools subscribes to the extension then unsubscribes imediately.

In the earlier versions (which is on Firefox), unsubscribing just didn't work.

It's fixed now in #37,

[MikeRyanDev]

Released as version 3.2.2

[maxime1992]

@zalmoxisus & @MikeRyan52 I upgraded to 3.2.2 and it's working great, awesome :) Thanks

[phra]

YEAH!

[phra]

for me is not working anymore. (tested w/ latest redux devtools, ngrx/example-app and chromium 53). is it working for you guys?

[zalmoxisus]

@phra could you please check example-app with updated @ngrx/store-devtools@3.2.2? I just tried it and don't see any problems.

[phra]

@zalmoxisus yeah, i tried yesterday evening and it was not working. :crying_cat_face: i tried again now and yes, time traveling and skipping actions are not working on my laptop. (i've updated manually store-devtools to 3.2.2)

[zalmoxisus]

@phra, is the extension's version 2.10.3?

[phra]

@zalmoxisus yeah, that's the problem! the autoupdate of chromium wasn't working and by reinstalling manually the extensions fixed all the problems. thank you!

[zalmoxisus]

You're welcome. It's a news for me that Chromium doesn't autoupdate the extensions as Chrome does. We need to handle that on the extension side then (showing a notification A new version is available). Or maybe it's just because I published it just 2 hours ago. Was 2.10.2 installed?

[phra]

i think that there is an autoupdate feature but it wasn't automatically updating that extension, also if i was forcing the update via the button in the extensions panel. i'm on kali linux and i'm running chromium v53 and i don't know if it is the latest stable available worldwide, but is the latest one available on kali linux repository.