ngrx/store-devtools

time travel doesn't work with redux devtools

Closed this issue ยท 23 comments

phra commented

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?

See #34 (comment) and give a try with Firefox.

phra commented

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

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

phra commented

@woutervandergraaf thank you.

phra commented

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

rob3c commented

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();
  });
}

The regression should be fixed in 2.8.5 of the extension.

@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).

@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.

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 commented

@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

@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.)

@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,

Released as version 3.2.2

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

phra commented

YEAH!

phra commented

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

@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 commented

@zalmoxisus yeah, i tried yesterday evening and it was not working. ๐Ÿ˜ฟ
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)

screenshot from 2016-11-22 15-56-35

@phra, is the extension's version 2.10.3?

phra commented

@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!

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 commented

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.