Ngxs/store @select decorator compatibility

I couldn’t test components using @select decorator of ngxs/store, I’m without new ideas how to test it!

if I try to provide store I’ve got this error:

    SelectFactory not connected to store!

      at LoginComponent.createSelect (node_modules/@ngxs/store/bundles/ng:/@ngxs/store/packages/store/src/select.ts:45:15)
      at LoginComponent.get [as conf] (node_modules/@ngxs/store/bundles/ng:/@ngxs/store/packages/store/src/select.ts:73:1)
      at Object.View_LoginComponent_0._co [as updateDirectives] (ng:/DynamicTestModule/LoginComponent.ngfactory.js:237:31)
      at Object.debugUpdateDirectives [as updateDirectives] (../../../../../execroot/angular/packages/core/src/view/services.ts:384:19)
      at checkAndUpdateView (../../../../../execroot/angular/packages/core/src/view/view.ts:359:12)

If I try to provide store and don’t mock it, I’ve got this one:

  ● LoginComponent Shallow Render › should log in

    StaticInjectorError(DynamicTestModule)[Store -> StateStream]:
      StaticInjectorError(Platform: core)[Store -> StateStream]:
        NullInjectorError: No provider for StateStream!```

[getsaf]

Glad it worked out! I’m going to close this issue.

[getsaf]

Cool, the StackBlitz helped me understand a lot. Here’s what I found. Looks like since they are using a forRoot + decorators, things get a little weird which is why they are using static properties behind the scenes.

Unfortunately, if you want to use dontMock or neverMock the thing you pass into the dontMock/neverMock method must === the module/provider/component/etc from the component’s module. In this case, when using NgxsModule.forRoot() in the component’s module, the forRoot method yields a singleton object (an NgModuleWithProviders) that we must gain access to so we have a thing that Shallow can === compare to skip mocking.

My solution was simply to export the rooted NgxsModule and pass that into the dontMock in the spec. You may use neverMock in the same manner if you want to just do it once for all your specs.

This was an interesting problem to solve. I may try to think of a way to make this more intuitive or put something in the docs for the next person to run across something like this.

Here’s my fork of your StackBlitz: https://stackblitz.com/edit/angular-shallow-render-select-specs?file=src/app/app.component.spec.ts