search

ngxs / store

🚀 NGXS - State Management for Angular
http://ngxs.io
MIT License
3.54k stars 405 forks source link

🐞[BUG]: Devtools plugin seems to not work with redux devtools chrome extension #2215

Open shadow1349 opened 2 months ago

shadow1349 commented 2 months ago

Affected Package

The issue is caused by package @ngxs/devtools-plugin ### Is this a regression? This started to happen when I upgraded to version 18. ### Description There seems to be an issue where the NGXS Devtools plugin seems to not want to work with the redux devtools chrome extension. ## 🔬 Minimal Reproduction Here is a repo with minimal reproduction: https://github.com/shadow1349/replicate-material-color-error/tree/redux-devtools-not-working/test-app/src/app Run npm install (in the root of the project, it's an NX monorepo) and the run `npx nx run test-app:serve --configuration=development` If you try to open the redux devtools it will say "No store found". However, if you open up the chrome devtools and look at Application -> session storage you can see that state does in fact work it just doesn't sync up with the redux devtools. ## Environment 

Libs:
@angular-devkit/architect       0.1802.3
@angular-devkit/build-angular   18.2.3
@angular-devkit/core            18.2.3
@angular-devkit/schematics      18.2.3
@schematics/angular             18.2.3
rxjs                            7.8.1
typescript                      5.5.4
zone.js                         0.14.10
"@ngxs/devtools-plugin": "^18.1.1",
"@ngxs/storage-plugin": "^18.1.1",
"@ngxs/store": "^18.1.1",
Browser:
Chrome (desktop) Version 128.0.6613.120 (Official Build) (arm64)
For Tooling issues:
- Node version: 20.11.1
- Platform:  Mac Silicon M3
dowebdevelopment commented 2 months ago

Yes, same issue here!

markwhitfeld commented 2 months ago

Thank you for reporting the issue. There are currently a few much higher priorities that the team is working on, so it is not going to receive attention right now. @shadow1349, or @dowebdevelopment, do you think you would like to have a go at investigating this issue?

The devtools plugin is pretty straightforward, so hopefully it is quite approachable to be able to debug. The plugin picks up its reference to the dev tools here: https://github.com/ngxs/store/blob/bd43d3316c20a7ccde6fa409a7467a5d5ceb3587/packages/devtools-plugin/src/devtools.plugin.ts#L37-L38 Maybe that is a good place to start.

MrTob commented 2 months ago

i have the same issue. Using a nx-monorepo with Angular 18

shadow1349 commented 2 months ago

Looks like it may be something with the extension? https://github.com/reduxjs/redux-devtools/issues/1731

maximLyakhov commented 2 months ago

Temporary workarounds: use Logger plugin or open Redux tab in devtools and reload.