Doesn't automatically follow state anymore

[taylorwoodman]

In the previous version when I'd open my dev tools it'd automatically display the most up to date state object but now I have to click on an action to see what the state is. This makes it so I have to keep clicking actions to keep seeing the most up to date state instead of being able to watch the state object change as I'm dispatching actions

[musfiqus]

Same here.

[GBouffard]

Same here as well.

[Methuselah96]

I'm having trouble reproducing the issue you're describing. When I click on the State tab with no action selection it shows the latest state which keeps updating. Does it show anything for you when you have the State tab selected?

[adam-mf2]

@Methuselah96 This is what I see when I first open up the dev tools, when previously it would be the up-to-date state. This happened all of a sudden, and not from changing settings.

.

[mjbour]

Same here

[djflorio]

I've been experiencing the same issue for roughly 1 month. A few weeks ago I uninstalled and reinstalled the extension, and it worked normally for a few weeks before randomly starting this behavior again this morning. I tried reinstalling again, but this time it didn't work.

Here's a gif of the issue. You can see that workflows/setTotalPageCount is selected, and when additional actions are fired, the inspector stays locked on workflows/setTotalPageCount.

Chrome Version 98.0.4758.102 (Official Build) (64-bit) Redux DevTools 3.0.9

[junyi-peng-kr]

I am facing the same issue here, but it only occurs on the normal mode chrome windows, if I open with incognito mode, the state is always update-to-date.

[Methuselah96]

Some diagnostic questions:

• Can you try out this counter example to see if the bug is happening for all Redux applications?
• Does this bug happen for all three of the different ways of opening the Redux DevTools?
  • The Chrome DevTools tab
  • The panel that can be opened through the extensions toolbar
  • The new window that can be opened by clicking one of the "grid" icons in the bottom right
• Does the bug happen in incognito mode?
• Does the "Action" tab show the most recent action?
• Does the bug happen if you disable all other Chrome extensions?
• What operating system are you on?

[mjbour]

I've been experiencing the same issue for roughly 1 month. A few weeks ago I uninstalled and reinstalled the extension, and it worked normally for a few weeks before randomly starting this behavior again this morning. I tried reinstalling again, but this time it didn't work.

Here's a gif of the issue. You can see that workflows/setTotalPageCount is selected, and when additional actions are fired, the inspector stays locked on workflows/setTotalPageCount.

Chrome Version 98.0.4758.102 (Official Build) (64-bit) Redux DevTools 3.0.9

this solution worked for me, Thank you!

[djflorio]

@Methuselah96

• Can you try out this counter example to see if the bug is happening for all Redux applications?
  • Yes, the bug happens with this example.
• Does this bug happen for all three of the different ways of opening the Redux DevTools?
  • The Chrome DevTools tab
    • Yes
  • The panel that can be opened through the extensions toolbar
    • Yes
  • The new window that can be opened by clicking one of the "grid" icons in the bottom right
    • Yes
• Does the bug happen in incognito mode?
  • Yes
• Does the "Action" tab show the most recent action?
  • No, same issue as the "State" tab.
• Does the bug happen if you disable all other Chrome extensions?
  • Yes
• What operating system are you on?
  • Tested and confirmed to be occurring on:
    • Windows 11 Pro (this started happening while I was on Windows 10 Pro)
    • macOs Monterey 12.0.1
  • I've also just checked on Firefox 97.0.1, and the issue is occurring there for me as well.

[Methuselah96]

@djflorio Thanks for the info. If you don't mind, can you try:

1. Open the panel through the extensions toolbar.
2. Right-click > Inspect to open the Chrome DevTools for the extension.
3. Go to the Application tab.
4. Expand IndexedDB, click on "localforage - chrome-extensions://lmhk...".
5. Delete database.
6. Close out Chrome and reopen and see if the bug persists.

I'm not confident this will fix the bug, just trying to narrow down the source of the issue.

[djflorio]

@Methuselah96 No problem. I performed those steps, and unfortunately there's no change.

[Methuselah96]

Good news! I believe I've finally figured out the issue after being able to reproduce it on my end and do a bit of debugging. What I believe is happening is that it's persisting the selectedActionId between sessions. For example, let's say in one debugging session you select the 30th action (i.e., selectionActionId=29) in the list and then refresh your app. The Redux DevTools still thinks you have the 30th action selected, but since there are not 30 actions yet, it shows the state as undefined and doesn't track with the latest state.

One workaround would be to reset your selected action by:

1. Clicking one of the actions to select it.
2. Clicking on the action again which should deselect it and cause the Redux DevTools track the current state.

Alternatively, I think deleting the IndexedDB as described above should also work, but that would only be a temporary fix and selecting and deselecting an action should be easier.

Sorry this has taken so long to get sorted out. Let me know if you have any more questions or if the workaround isn't working for you. I'll try to get a proper fix out soon.

[djflorio]

@Methuselah96 No problem at all, thanks for digging in and finding the issue! Yep you're right; if I first select an action and then de-select it, the state tree remains up-to-date as more actions are fired.

For some reason I thought that it was supposed to actively highlight the latest action in the list, as well as show the most updated state tree, but this makes more sense; if you have an action highlighted, it makes sense for the UI to lock onto it.

[PetarKirov]

Clicking on the action again which should deselect it and cause the Redux DevTools track the current state.

That was the solution for me as well.

@Methuselah96 I (like I presume others experiencing this issue) didn't know that it was possible to deselect the selected action simply by clicking on it. What I tried (and what I thought was the most logical) was to click on the empty space below the last action, as in most UI list implementations that usually deselects (all) selected items.

[Methuselah96]

Frankly, I didn't know either until looking at the source code since I didn't write the original code. Happy to accept PRs to improve the situation, I'm not sure how quickly I would get to it myself.

[sehrish30]

Updating @redux-devtools/extension to latest version worked for me

[banderberg]

I don't know what they did but this big update essentially ruined what used to be a great tool..

[Methuselah96]

@banderberg If you could provide specific feedback, that would be much more helpful than just saying that the "big update essentially ruined what used to be a great tool." The updates in 3.0 were for the most part cosmetic, so it doesn't seem like it should be too hard to make it a "great tool" again with the right kind of feedback.

[Methuselah96]

It looks like there are still some cases where this is an issue even with the changes in the attached PR. Need to look into this again some more.

[joemart]

I'm also experiencing the same issues

[ozkoidi]

Similar issue here, the extension used to work some time ago. When I tried today (on Chrome 100.0.4896.88) I don't see any logs or actions and state is undefined.

• I can't use the workaround of clicking an action because there are no actions.
• I don't have anything on indexDB
• I deleted the extension an re-installed but the issue persists.
• On Firefox (with the version 3.0.11 of the extension) I get the message : No store found. Make sure to follow the instructions

[rgutt]

@ozkoidi I'm experience exactly the same problem. Redux is working properly but I also don' t see any action or states...

[ozkoidi]

@rgutt, is working again for me. The problem in my case was that on my Angular app the import of StoreDevtoolsModule.instrument() on ra-app.module.ts was moved up within the list. Once I put it back on the last position of the imports array of the NgModule (after the import of StoreModule.forRoot()) I was able to see the actions and the state again in the Redux Chrome extension.

[philipjc]

I've also experienced this today. For me, turning off the extension and closing the tab, starting a new tab, and turning the extension back on worked for me. I think it started when I started interacting with the Action tab, so I am going to leave it alone :)

update

So I now realize, if you interact with the timeline of the actions, as in selecting one and highlighting grey, that focus remains thus no longer auto updating and moving down. I noticed if you select it again the focus is removed and returns back to automated behavior. Give this a try folks maybe it will solve your issue.

[asiby]

I was about to suggest the same thing as @philipjc. It could help everyone if the state of the tool is prominently displayed using a ribbon of some sort. Or, there could be an obvious button named Follow Recent Action which will simply deselect any action.

[olgazh565]

I had the same issue - the State tab did not show any state updates while the Action tab worked as expected. The solution turned out to be very simple for me - I clicked on the 'Log monitor' tab at the bottom panel of the tool and then back on the 'Inspector' tab, and the state was shown again on the State tab. Hope it might help to someone else as well.