使用@ angular-redux/store测试@select装饰器

问题描述

当在Angular中测试依赖于 @select()装饰器的组件时，我正在使用 MockNgRedux.getSelectorStub('myStoreProperty').next(testState)发送新的值给订阅者，但是当我调用下一个函数时，它不会触发具有新值的订阅.

When testing components in Angular that rely on the @select() decorators I am using MockNgRedux.getSelectorStub('myStoreProperty').next(testState) to send new values to subscribers, but when I call the next function, it doesn't trigger the subscription with the new value.

请参阅示例代码:

export class BasicInfoComponent {
    @select() application$: Observable<Application>;
    this.application$.subscribe((app: Application) => {
        //... this code is never triggered.
    }

}

这是测试设置

beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [BasicInfoComponent],
      imports: [
        NgReduxTestingModule,
        ReactiveFormsModule
      ],
      providers: [
       //... providers
      ],
      schemas: [NO_ERRORS_SCHEMA]
    })
      .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(BasicInfoComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
    MockNgRedux.reset();
  });

  afterEach(() => {
    fixture.destroy();
  });

推荐答案

我有一个类似的问题，但这是由于我在 @select(...)中使用了lambda选择而引起的.似乎 MockNgRedux 需要您使用与 @select(...)完全相同的选择器来调用 getSelectorStub .

I had a similar issue, but it was caused because I was using lambda selection in @select(...). It seems that MockNgRedux needs you to call getSelectorStub with the exact same selector as the @select(...) uses.

所以，如果您有

const selectorStub = MockNgRedux.getSelectorStub(['status', 'text']);

然后，您还需要在组件中以相同的方式选择它:

Then you also need to select it the same way in the component:

@select(['status', 'text'])
readonly statusText: Observable<string>;

这篇关于使用@ angular-redux/store测试@select装饰器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！