Как провести юнит-тест Rx js combLatest? - PullRequest
0 голосов
/ 06 января 2020

Мой компонент ngOnInit делает это

public ngOnInit() {
    this.ctrSubscription = combineLatest(this.route.queryParams, this.tags$).subscribe(async params => {
      if (Object.keys(params[0]).length > 0) {
        this.initView({ ...params[0] });
      }
      if (Object.keys(params[1]).length > 0) {
        this.wsTags = Object.values(params[1]);
      }
      if (params[0] && this.wsTags.length > 0) {
        this.searchWs({ ...params[0] }.q);
        this.pruneData();
      }
    });
  }

И вот как я его тестирую

  it('should perform search and load the results', fakeAsync(() => {
    TestBed.get(ActivatedRoute).queryParams = of({ q: 'test' });
    const initSpy = spyOn<any>(component, 'initView').and.callThrough();
    const subSpy = spyOn<any>(component.tags$, 'subscribe');
    component.wsTags = ensureState(mockTags as any);
    flushMicroTasks();
    fixture.detectChanges();
    flushMicroTasks();
    expect(initSpy).toHaveBeenCalledWith({ q: 'test' });
    expect(subSpy).toHaveBeenCalled();
    expect(component.wsTags).toBe(Object.values(mockTags));
  }));

шпионов вообще не вызывают. Я ставлю точку останова при запуске тестов чтобы узнать, передается ли значение или нет, и я смог поймать, что параметры запроса были переданы правильно, но все-таки, если произойдет сбой.

Я попытался просмотреть документы, чтобы лучше понять, а также различные подобные вопросы здесь переполнение стека, я не мог решить это. Я довольно новичок в написании юнит-тестов, поэтому любая помощь будет оценена. Спасибо.

1 Ответ

0 голосов
/ 06 января 2020

Одна потенциальная проблема заключается в том, что вы насмехаетесь над ActivatedRoute в блоке it. Это слишком поздно, ваш ngOnInit запускается после первого detectChanges после compileComponents.

. При настройке модуля тестирования попробуйте:

describe('Put description of the test', () => {
  let component: YourComponent;
  let activatedRoute: ActivatedRoute;
  let fixture: ComponentFixture<YourComponent>;

  beforeEach(() => {
    TestBed.configureTestingModule({
     declarations: [ YourComponentToTest, 
      // other declarations if need be.
     ],
     providers: [
      provide: ActivatedRoute,
      useValue: {
       queryParams: of({ q: 'test" }),
      }
     ]
   }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(YourComponentToTest);
    component = fixture.componentInstance;
    activatedRoute = TestBed.get(ActivatedRoute);
    // ngOnInit is ran now -- after the first detectChanges
    fixture.detectChanges();
  });

  it('should do what you want', () => {
   // your arrange, act, and assertions.
  });
})

Убедитесь, что this.tags$ также инициализирован.

Я сделал все это от руки, поэтому могут быть опечатки (ы).

...