Platform: TestBed.inject Mockstore

[timdeschryver]

Minimal reproduction of the bug/regression with instructions:

@tomastrajan was busy with the upgrade of Angular 9 and NgRx 9 and encountered the following problem.

With the introduction of TestBed.inject instead of TestBed.get, we receive the following error when we get the Store and assign it to a MockStore.

Type 'Store<any>' is missing the following properties from type 'MockStore<object>': scannedActions$, state$, initialState, setState, and 3 more.ts(2740)

Because we're now exposing the MockStore, I also tried to get the Mockstore.
This solves the above problem, but it doesn't catch any dispatches to the store.
spyOn(store, 'dispatch'); will always say that there are none dispatched actions.

See the example-inject branch for the behavior.

Expected behavior:

It should work.

It works if we inject the Store and cast it to a MockStore

store = (TestBed.inject(Store) as unknown) as MockStore;

Is there another way to get this to work?
If it is the only way, should we provide a method on MockStore?

static injectMockStore<T = object>() {
  return (TestBed.inject(Store) as unknown) as MockStore<T>;
}

Versions of NgRx, Angular, Node, affected browser(s) and operating system(s):

Angular 9
NgRx 9.0.0-beta.1

Other information:

I would be willing to submit a PR to fix this issue

[x] Yes (Assistance is provided if you need help submitting a pull request)
[ ] No

[tomastrajan]

Thx @timdeschryver !

[rickvandermey]

Does this mean NGRX 8.6.x is not compatible with Angular 9 yet?
will patch store = TestBed.inject(Store) to store = TestBed.inject(Store) as MockStore<any>; for now

[timdeschryver]

@rickvandermey NgRx 8.6.x should be compatible with Angular 9.
inject works as it did before, but became deprecated.

[rickvandermey]

We did something similair for Actions, because NgRx doesnt have MockActions itself, maybe it can be applied on MockStore as well.

@Injectable()
export class MockActions extends Actions {
    constructor() {
        super(EMPTY);
    }

    set stream(source: Observable<any>) {
        this.source = source;
    }
}
/**
 * Create testActions()
 * @return MockActions
 */
export function getActions(): MockActions {
    return new MockActions();
}

[alex-okrushko]

The cleanup here already addresses this issue :)
https://github.com/ngrx/platform/pull/2361/files#diff-dd898c9bfa6998c4353faa87d4286c62R21

[timdeschryver]

@alex-okrushko I think that doesn't resolve this?
An end-user should be able to retrieve the (mock)store from testbed.

[alex-okrushko]

Oops... I didn't read the issue correctly.

I'm surprised that spyOn(store, 'dispatch') is not caught. To solve that we can add dispatch to MockStore that would be calling super.dispatch.

[jasonhodges]

@timdeschryver
Should

With the introduction of TestBed.get instead of TestBed.inject,

instead be "With the introduction of TestBed.inject instead of TestBed.get" ?

According to the Angular docs, TestBed.get is deprecated and TestBed.inject is the replacement. https://angular.io/api/core/testing/TestBed#get

[alex-okrushko]

@jasonhodges Yeah, that's what I initially referred to in my first comment, that I was cleaning that up.

[timdeschryver]

Sorry for the confusion (I've just updated the issue), thanks for catching this.

[timdeschryver]

@alex-okrushko I tried calling super.dispatch, but ended up with the same result.
I will verify it later to be sure.

[timdeschryver]

@alex-okrushko I just verified that calling super.dispatch does not help.

[alex-okrushko]

@alex-okrushko I just verified that calling super.dispatch does not help.

https://github.com/ngrx/platform/pull/2381 should fix this. Sorry 🙈