ng-mocks: Bug: ComponentStore observale not working with ng-mock >= 13.3.0
Description of the bug
Hi, I just migrated an angular project from version 12 to 13. Everything goes well except for ComponentStore (NGRX) tests. The observables complete directly, without emiting value.
For the context:
- Angular 13.3.11
- Jest 27.5.1
- @ngrx/component-store 13.2.0
- jest-marbles 3.0.2
I tested all versions of ng-mocks to find the one that causes problems, and it’s this one: 13.3.0. Everything works before (ex 13.2.0).
Do you have any idea of the modification that causes this?
Thanks
Minimal reproduction example:
ComponentStore to be tested:
@Injectable()
export class MyComponentStore extends ComponentStore<{ value: string }> {
constructor() {
super({ value: 'value' });
}
readonly values$ = this.select(({ value }) => value);
}
Failling test case:
describe('MyComponentStore', () => {
let componentStore: MyComponentStore;
beforeEach(() => MockBuilder(MyComponentStore));
beforeEach(() => {
componentStore = MockRender(MyComponentStore).point.componentInstance;
});
// This test no longer works with ng-mocks >= 13.3.0
it('should initial state and value', () => {
expect(componentStore.state$).toBeObservable(cold('a', { a: { value: 'value' } }));
expect(componentStore.values$).toBeObservable(cold('a', { a: 'value' }));
});
});
Working test case without jest-marble:
describe('MyComponentStore', () => {
let componentStore: MyComponentStore;
beforeEach(() => MockBuilder(MyComponentStore));
beforeEach(() => {
componentStore = MockRender(MyComponentStore).point.componentInstance;
});
const testScheduler = new TestScheduler((actual, expected) => {
expect(actual).toEqual(expected);
});
// However, this one works all the time (without jest-marble)
it('should have initial state', () => {
testScheduler.run((helpers) => {
const { expectObservable } = helpers;
expectObservable(componentStore.state$).toBe('a', { a: { value: 'value' } });
expectObservable(componentStore.values$).toBe('a', { a: 'value' });
});
});
});
It works fine without an ng-mocks context (to show that it doesn’t come from jest-marble):
describe('MyComponentStore', () => {
let componentStore: MyComponentStore;
beforeEach(() => {
componentStore = new MyComponentStore();
});
// Work
it('should initial state and value', () => {
expect(componentStore.state$).toBeObservable(cold('a', { a: { value: 'value' } }));
expect(componentStore.values$).toBeObservable(cold('a', { a: 'value' }));
});
});
Expected vs actual behavior
Actual:
● MyComponentStore › should initial state and value
expect(received).toBeNotifications(expected)
Expected notifications to be:
[{"frame": 0, "notification": {"error": undefined, "kind": "N", "value": {"value": "value"}}}]
But got:
[{"frame": 0, "notification": {"error": undefined, "kind": "C", "value": undefined}}]
Expected: Test should passed
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Reactions: 3
- Comments: 18 (15 by maintainers)
Hi there. Thanks for the report. I’ll take a look, hopefully, this week.
The release: https://github.com/ike18t/ng-mocks/releases/tag/v13.3.0
Here is a minimal example of reproduction https://stackblitz.com/edit/github-ec7feu?file=package.json,src%2Ftest.spec.ts
I tested in Angular 14 before downgrading to Angular 13 in Stackblitz, and it seemed to work.
I did not know this token, I will try to test this afternoon.
Thanks