StoreDevtools error #30

axtho · 2017-05-26T12:33:07Z

Setup same as #29 ... I followed the docs more closely now. I get:

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)

The import section from the app.module.ts looks like this:

imports: [
        BrowserModule,
        BrowserAnimationsModule,
        FormsModule,
        ReactiveFormsModule,
        HttpModule,
        FlexLayoutModule,

        AppMaterialModule,
        AppRoutingModule,
        MHCoreModule,

        StoreModule.forRoot(reducers),
        StoreRouterConnectingModule,
        !environment.prod ? StoreDevtoolsModule.instrument() : [],

        EffectsModule.forRoot(),
        EffectsModule.run(PersonEffects),
        EffectsModule.run(AuthEffects),

        CommonModule,
        SearchModule,
        InteractionModule
    ],

The reducer import like so (partial):

import {
    ActionReducerMap,
    createSelector } from '@ngrx/store';
import { routerReducer, RouterReducerState } from '@ngrx/router-store';

import * as interaction from 'mh-core';
import * as person from 'mh-core';
import * as settings from 'mh-core';
import * as auth from 'mh-core';

export interface AppState {
    interaction: interaction.InteractionState;
    person: person.PersonState;
    settings: settings.SettingsState;
    auth: auth.AuthState;
    router: RouterReducerState;
}

export const reducers: ActionReducerMap<AppState> = {
    interaction: interaction.interactionReducer,
    person: person.personReducer,
    settings: settings.settingsReducer,
    auth: auth.authReducer,
    router: routerReducer
};

The text was updated successfully, but these errors were encountered:

llwt · 2017-05-29T03:46:59Z

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

axtho · 2017-05-29T08:04:48Z

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

llwt · 2017-05-30T04:39:52Z

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

llwt · 2017-05-30T04:47:28Z

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

boneskull · 2017-06-01T08:16:55Z

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

boneskull · 2017-06-01T08:50:51Z

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

msandeeprao38 · 2017-06-07T19:10:05Z

@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

axtho · 2017-06-07T19:12:04Z

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

boneskull · 2017-06-08T05:56:45Z

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

llwt · 2017-06-08T14:56:31Z

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"?

boneskull · 2017-06-08T17:55:23Z

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

llwt · 2017-06-08T18:24:34Z

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

drew-moore · 2017-06-12T05:14:15Z

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

Thanks team!

axtho · 2017-06-12T08:06:02Z

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

drew-moore · 2017-06-12T20:51:45Z

@axtho try pulling the latest store build too

axtho · 2017-06-13T06:03:04Z

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

Call stack:

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.

bbaia · 2017-06-19T22:37:06Z

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)

axtho · 2017-06-20T06:46:38Z

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

bbaia · 2017-06-20T08:52:23Z

I'm using lazy features modules

wpcfan · 2017-06-23T01:11:11Z

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

progral · 2017-06-28T14:44:38Z

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.

axtho · 2017-07-02T20:23:20Z

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

diicar · 2017-07-02T21:06:09Z

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

brandonroberts · 2017-07-03T00:06:09Z

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

axtho · 2017-07-03T04:35:54Z

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

jinder · 2017-07-03T09:09:10Z

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

bbaia · 2017-07-03T21:55:26Z

Latest build works like a charm!

Thanks!

axtho · 2017-07-04T05:20:10Z

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

bbaia · 2017-07-04T08:17:53Z

But it really slow down the app, normal ?

axtho · 2017-07-04T08:38:22Z

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

brandonroberts · 2017-07-04T15:44:26Z

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

dragGH102 · 2018-01-17T14:26:11Z

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)

siordache94 · 2018-07-15T11:33:17Z

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)```

brandonroberts · 2018-07-16T12:27:09Z

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

mayurgaud · 2018-07-18T13:30:04Z

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

brandonroberts · 2018-07-18T14:59:29Z

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

TonyLuo · 2018-09-24T15:21:11Z

still have this issue...

axtho mentioned this issue May 29, 2017

How to use the nightly versions ? #32

Closed

This was referenced Jul 3, 2017

fix(Devtools): Removed SHOULD_INSTRUMENT token #57

Merged

@ngrx/store-dev-tools: nightly - TypeError asObservable of #58

Closed

MikeRyanDev closed this as completed in #57 Jul 3, 2017

StoreDevtools error #30

StoreDevtools error #30

Comments

axtho commented May 26, 2017

llwt commented May 29, 2017

axtho commented May 29, 2017

llwt commented May 30, 2017 • edited Loading

llwt commented May 30, 2017

boneskull commented Jun 1, 2017

boneskull commented Jun 1, 2017

msandeeprao38 commented Jun 7, 2017

axtho commented Jun 7, 2017 • edited Loading

boneskull commented Jun 8, 2017

llwt commented Jun 8, 2017

boneskull commented Jun 8, 2017

llwt commented Jun 8, 2017

drew-moore commented Jun 12, 2017

axtho commented Jun 12, 2017

drew-moore commented Jun 12, 2017

axtho commented Jun 13, 2017 • edited Loading

bbaia commented Jun 19, 2017

axtho commented Jun 20, 2017

bbaia commented Jun 20, 2017

wpcfan commented Jun 23, 2017

progral commented Jun 28, 2017

axtho commented Jul 2, 2017

diicar commented Jul 2, 2017

brandonroberts commented Jul 3, 2017

axtho commented Jul 3, 2017 • edited Loading

jinder commented Jul 3, 2017

bbaia commented Jul 3, 2017

axtho commented Jul 4, 2017

bbaia commented Jul 4, 2017

axtho commented Jul 4, 2017

brandonroberts commented Jul 4, 2017 • edited Loading

dragGH102 commented Jan 17, 2018 • edited Loading

siordache94 commented Jul 15, 2018 • edited Loading

brandonroberts commented Jul 16, 2018

mayurgaud commented Jul 18, 2018 • edited Loading

brandonroberts commented Jul 18, 2018 • edited Loading

TonyLuo commented Sep 24, 2018

llwt commented May 30, 2017 •

edited

Loading

axtho commented Jun 7, 2017 •

edited

Loading

axtho commented Jun 13, 2017 •

edited

Loading

axtho commented Jul 3, 2017 •

edited

Loading

brandonroberts commented Jul 4, 2017 •

edited

Loading

dragGH102 commented Jan 17, 2018 •

edited

Loading

siordache94 commented Jul 15, 2018 •

edited

Loading

mayurgaud commented Jul 18, 2018 •

edited

Loading

brandonroberts commented Jul 18, 2018 •

edited

Loading