Coder Social home page Coder Social logo

StoreDevtools error about platform HOT 37 CLOSED

ngrx avatar ngrx commented on May 12, 2024 11
StoreDevtools error

from platform.

Comments (37)

wpcfan avatar wpcfan commented on May 12, 2024 3

any update? I ran into this issue too, it is painful without dev tools around

from platform.

axtho avatar axtho commented on May 12, 2024 1

@msandeeprao38 I went back on 2.x for now. It doesn't seem a hight priority to get 4.x on the road soon :) Maybe @MikeRyanDev or @brandonroberts could guestimate on this?

from platform.

llwt avatar llwt commented on May 12, 2024 1

Rolled back to 2.x here as well. An update on the status of this from @MikeRyanDev or @brandonroberts would be really helpful, the original ETA was "sometime in May"?

from platform.

axtho avatar axtho commented on May 12, 2024 1

@drew-moore I am upgrading all my deps each day :) So that's not it ... what is your setup (npm, angular, TS, etc)?

I think it is what @MikeRyanDev has already mentioned in the new example app:

Both @ngrx/store and @ngrx/store-devtools now have mixed eager providers making it hard to debug undefined injector errors, see angular/angular#15501

But I am still curious why it seems to work for some and for others not. Does it have to do with how many eager providers are already setup before dev tools kick in?

Just to confirm the previous inspection:

action$ is undefined and therefore fails the toObservable() call.
bildschirmfoto 2017-06-13 um 07 56 42

Call stack:
bildschirmfoto 2017-06-13 um 07 57 18

BTW:
including the StoreDevtoolsModule.instrument() in the imports BEFORE the StoreModul will at least not error. But it also does not pick up a connection.

from platform.

llwt avatar llwt commented on May 12, 2024

Running into the same issue, you ever find a solution?

from platform.

axtho avatar axtho commented on May 12, 2024

@llwt unfortunately not yet. I have reverted back to the 2.x branch because I don't have the time to debug alpha versions.

from platform.

llwt avatar llwt commented on May 12, 2024

Hmm, so I think I tracked it down to the injector.get(StoreDevTools) call in createStateObservable of instrument.ts.

It looks the eager provider calling injector.get() winds up with the ActionSubject from @ngrx/store not being present in the DI container at the time of instantiation and injecting undefined into the StoreDevTools. Playing around with it, if I provide StoreDevTools and State to the createStateObservable factory deps everything works:

// ...
export function createStateObservable(shouldInstrument: boolean, devTools: StoreDevtools, state: State<any>) {
  return shouldInstrument ? devTools.state : state;
}
// ...
export class StoreDevtoolsModule {
  static instrument(options: StoreDevtoolsOptions = {}): ModuleWithProviders {
    return {
      ngModule: StoreDevtoolsModule,
      providers: [    
        // ...
        {
          provide: StateObservable,
          deps: [ SHOULD_INSTRUMENT, StoreDevtools, State],
          useFactory: createStateObservable
        },
        // ...

Although, If I'm understanding everything correctly though that leads to the StoreDevTools being bootstrapped regardless of whether SHOULD_INSTRUMENT is true.

I'm not sure what the correct solution to get this working would be. I have a feeling this issue is already understood by the project maintainers.

Probably related to: Angular #15501

from platform.

llwt avatar llwt commented on May 12, 2024

So that actually doesn't work as expected. The dev tools work but all actions end up being fired twice...

from platform.

boneskull avatar boneskull commented on May 12, 2024

My WAG is that StoreModule isn't actually providing anything, because it's been split into StoreFeatureModule and StoreRootModule.

I'll try to test this hypothesis, but I'm new to the toolchain..

from platform.

boneskull avatar boneskull commented on May 12, 2024

n/m; there are a bunch of unused imports in the devtools code, so it's tough to determine intent or if things are half-implemented. I'm also an Angular 2+ noob, so can't be of much help here

from platform.

msandeeprao38 avatar msandeeprao38 commented on May 12, 2024

@axtho @llwt Running into the same issue. Any solution for this as of now or is it better to revert back to 2.x versions

from platform.

boneskull avatar boneskull commented on May 12, 2024

I also went back to 2.x; works well enough

from platform.

boneskull avatar boneskull commented on May 12, 2024

You can always move that ETA up by contributing back to the project yourself.

from platform.

llwt avatar llwt commented on May 12, 2024

@boneskull I'm trying :P see my earlier comments.

from platform.

drew-moore avatar drew-moore commented on May 12, 2024

:-) This seems to be fixed as of today's "nightly" build (store-devtools-builds#c242ff2).

Thanks team!

from platform.

axtho avatar axtho commented on May 12, 2024

@drew-moore yes? I just pulled the latest via "@ngrx/store-devtools": "github:ngrx/store-devtools-builds", and I still get the same error:

Unhandled Promise rejection: Cannot read property 'asObservable' of undefined ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Cannot read property 'asObservable' of undefined
    at new StoreDevtools (store-devtools.es5.js:544)
    at _createClass (core.es5.js:9615)
    at _createProviderInstance$1 (core.es5.js:9573)
    at resolveNgModuleDep (core.es5.js:9558)
    at NgModuleRef_.webpackJsonp../node_modules/@angular/core/@angular/core.es5.js.NgModuleRef_.get (core.es5.js:10644)
    at createStateObservable (store-devtools.es5.js:696)
    at _callFactory (core.es5.js:9637)
    at _createProviderInstance$1 (core.es5.js:9576)
    at initNgModule (core.es5.js:9527)
    at new NgModuleRef_ (core.es5.js:10635) TypeError: Cannot read property 'asObservable' of undefined
    at new StoreDevtools (http://localhost:4200/vendor.bundle.js:101813:52)
    at _createClass (http://localhost:4200/vendor.bundle.js:47765:26)
    at _createProviderInstance$1 (http://localhost:4200/vendor.bundle.js:47723:26)
    at resolveNgModuleDep (http://localhost:4200/vendor.bundle.js:47708:17)
    at NgModuleRef_.webpackJsonp../node_modules/@angular/core/@angular/core.es5.js.NgModuleRef_.get (http://localhost:4200/vendor.bundle.js:48794:16)
    at createStateObservable (http://localhost:4200/vendor.bundle.js:101965:40)
    at _callFactory (http://localhost:4200/vendor.bundle.js:47787:17)
    at _createProviderInstance$1 (http://localhost:4200/vendor.bundle.js:47726:26)
    at initNgModule (http://localhost:4200/vendor.bundle.js:47677:13)
    at new NgModuleRef_ (http://localhost:4200/vendor.bundle.js:48785:9)

from platform.

drew-moore avatar drew-moore commented on May 12, 2024

@axtho try pulling the latest store build too

from platform.

bbaia avatar bbaia commented on May 12, 2024

I also have an error with latest nightly builds:

zone.js:569 Unhandled Promise rejection: Cannot read property 'lift' of undefined ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Cannot read property 'lift' of undefined
    at observeOn (observeOn.js:57)
    at new State (store.es5.js:273)

from platform.

axtho avatar axtho commented on May 12, 2024

@bbaia I am certain that has to do with the above mentioned open ticket on angular (angular/angular#15501). We seem to get errors on different points, which makes sense when you think about eager loading to be the issue: it depends on your specific setup, how many modules are being loaded by the time the devtools kick in.

from platform.

bbaia avatar bbaia commented on May 12, 2024

I'm using lazy features modules

from platform.

progral avatar progral commented on May 12, 2024

app.module.ts works

imports: [
    BrowserModule,
    StoreModule.forRoot({ core: coreReducer }),
    StoreDevtoolsModule.instrument()
]

core.module.ts which is imported by app.module.ts fires the error descriped above.

app.module.ts

imports: [
    BrowserModule,
    CoreModule
]

core.module.ts

imports: [
    CommonModule,
    StoreModule.forRoot({ core: coreReducer }),
    StoreDevtoolsModule.instrument()
]

Everything works fine, if i do not import StoreDevtoolsModule.

from platform.

axtho avatar axtho commented on May 12, 2024

@robwormald @MikeRyanDev is there another solution to this beside waiting for the issue at angular to be resolved? It is quite painful without the dev tools.

from platform.

diicar avatar diicar commented on May 12, 2024

@axtho meanwhile u can log the actions: action$.subscribe(a => console.log(a))

from platform.

brandonroberts avatar brandonroberts commented on May 12, 2024

@axtho have you tried the method above of putting the devtools and store in the AppModule

from platform.

axtho avatar axtho commented on May 12, 2024

@brandonroberts if you look at the appModule snippet at the start of the issue you see that it is what I am doing. Currently I am not lazy loading any store stuff or putting it into a common module.

https://github.com/digitaldeacon/memberhive2/blob/master/web/src/app/app.module.ts#L49

Looking at the error it says that actions are undefined. Is that because the actions have not loaded by the time the devtools connect?

from platform.

jinder avatar jinder commented on May 12, 2024

@brandonroberts @axtho Also seeing this error when importing StoreDevtoolsModule only in the App module.

from platform.

bbaia avatar bbaia commented on May 12, 2024

Latest build works like a charm!

Thanks!

from platform.

axtho avatar axtho commented on May 12, 2024

@brandonroberts thanks for doing this despite the holiday ;) it works now.

from platform.

bbaia avatar bbaia commented on May 12, 2024

But it really slow down the app, normal ?

from platform.

axtho avatar axtho commented on May 12, 2024

yes, i also noticed that ... maybe that has to do with the subscription not being closed properly?

from platform.

brandonroberts avatar brandonroberts commented on May 12, 2024

Leaving the devtools will slow down your app as it's retaining all the actions and states by default. You can use the maxAge option to limit the number of states retained.

StoreDevtoolsModule.instrument({
  maxAge: 25
})

from platform.

dragGH102 avatar dragGH102 commented on May 12, 2024

I'm actually getting this error even with the latest build. Same structure: DevTools imported in app.module.

Note: the store is a separate module imported in AppModule (I use https://github.com/kmathy/ngx-reduxor)

from platform.

siordache94 avatar siordache94 commented on May 12, 2024

Error still present, what's the main workaround ? Should I go down to some version?

    at ObserveOnSubscriber.scheduleMessage (vendor.js:68582)
    at ObserveOnSubscriber._error (vendor.js:68588)
    at ObserveOnSubscriber.Subscriber.error (vendor.js:25306)
    at ActionsSubject.Observable._trySubscribe (vendor.js:19897)
    at ActionsSubject.Subject._trySubscribe (vendor.js:28785)
    at ActionsSubject.Observable.subscribe (vendor.js:19880)
    at ObserveOnOperator.call (vendor.js:68558)
    at AnonymousSubject.Observable.subscribe (vendor.js:19877)
    at WithLatestFromOperator.call (vendor.js:121278)
    at AnonymousSubject.Observable.subscribe (vendor.js:19877) TypeError: Cannot read property 'schedule' of undefined
    at ObserveOnSubscriber.scheduleMessage (http://localhost:8100/build/vendor.js:68582:33)
    at ObserveOnSubscriber._error (http://localhost:8100/build/vendor.js:68588:14)
    at ObserveOnSubscriber.Subscriber.error (http://localhost:8100/build/vendor.js:25306:18)
    at ActionsSubject.Observable._trySubscribe (http://localhost:8100/build/vendor.js:19897:18)
    at ActionsSubject.Subject._trySubscribe (http://localhost:8100/build/vendor.js:28785:51)
    at ActionsSubject.Observable.subscribe (http://localhost:8100/build/vendor.js:19880:93)
    at ObserveOnOperator.call (http://localhost:8100/build/vendor.js:68558:23)
    at AnonymousSubject.Observable.subscribe (http://localhost:8100/build/vendor.js:19877:22)
    at WithLatestFromOperator.call (http://localhost:8100/build/vendor.js:121278:23)
    at AnonymousSubject.Observable.subscribe (http://localhost:8100/build/vendor.js:19877:22)```

from platform.

brandonroberts avatar brandonroberts commented on May 12, 2024

@siordache94 if you can provide a reproduction, open a new issue so we can take a look. This has been resolved for some time.

from platform.

mayurgaud avatar mayurgaud commented on May 12, 2024

I'm also facing the similar issue

zone.js:680 Unhandled Promise rejection: Cannot read property 'schedule' of undefined ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Cannot read property 'schedule' of undefined
    at ObserveOnSubscriber.scheduleMessage (observeOn.js:99)
    at ObserveOnSubscriber._error (observeOn.js:105)
    at ObserveOnSubscriber.Subscriber.error (Subscriber.js:105)
    at ActionsSubject.Observable._trySubscribe (Observable.js:177)
    at ActionsSubject.Subject._trySubscribe (Subject.js:97)
    at ActionsSubject.Observable.subscribe (Observable.js:160)
    at ObserveOnOperator.call (observeOn.js:74)
    at AnonymousSubject.Observable.subscribe (Observable.js:157)
    at WithLatestFromOperator.call (withLatestFrom.js:70)
    at AnonymousSubject.Observable.subscribe (Observable.js:157) TypeError: Cannot read property 'schedule' of undefined
    at ObserveOnSubscriber.scheduleMessage (webpack-internal:///./node_modules/rxjs/_esm5/operators/observeOn.js:105:33)
    at ObserveOnSubscriber._error (webpack-internal:///./node_modules/rxjs/_esm5/operators/observeOn.js:111:14)
    at ObserveOnSubscriber.Subscriber.error (webpack-internal:///./node_modules/rxjs/_esm5/Subscriber.js:110:18)
    at ActionsSubject.Observable._trySubscribe (webpack-internal:///./node_modules/rxjs/Observable.js:177:18)
    at ActionsSubject.Subject._trySubscribe (webpack-internal:///./node_modules/rxjs/Subject.js:97:51)
    at ActionsSubject.Observable.subscribe (webpack-internal:///./node_modules/rxjs/Observable.js:160:93)
    at ObserveOnOperator.call (webpack-internal:///./node_modules/rxjs/_esm5/operators/observeOn.js:80:23)
    at AnonymousSubject.Observable.subscribe (webpack-internal:///./node_modules/rxjs/Observable.js:157:22)
    at WithLatestFromOperator.call (webpack-internal:///./node_modules/rxjs/_esm5/operators/withLatestFrom.js:73:23)
    at AnonymousSubject.Observable.subscribe (webpack-internal:///./node_modules/rxjs/Observable.js:157:22)

Followed the steps present here https://github.com/ngrx/platform/blob/master/docs/store/README.md

from platform.

brandonroberts avatar brandonroberts commented on May 12, 2024

@mayurgaud open a new issue with a reproduction of the error.

from platform.

TonyLuo avatar TonyLuo commented on May 12, 2024

still have this issue...

from platform.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.