Angular 9 модульный тест Свойство 'of' не существует для типа 'typeof Observable'

Question

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

Я работаю над последней версией angular и ngrx

Опции, которые я пробовал

1)

spyOn(service, 'getData').and.returnValue(Observable.of(data));

2) Этот раздел не охватывал часть подписки в компоненте модульного тестирования

spyOn(service, 'getData').and.returnValue(of(data));

весь код: тестовый регистр никогда не вводится, подпишите часть this.dataService.getState ()

// component:

getState(){
    this.dataService.getState().subscribe(s => s.forEach(element => {
      this.data.push(element.name);
    }));
}
  
//test case

beforeEach(() => {
    fixture = TestBed.createComponent(DataComponent);
    component = fixture.componentInstance;
    service = TestBed.inject(DataService);
    fixture.detectChanges();
  });
  
it('should call get data Function', () => {
    spyOn(service, 'getData').and.returnValue(of(data));
  });

Answer 1

При настройке теста компонент создается при вызове fixture.detectChanges. Поскольку создание экземпляров вызывает перехватчики жизненного цикла, любой код в функции ngOnInit выполняется до того, как ваша первая тестовая операция c.

Если data является константой, выполните:

  beforeEach(() => {
    fixture = TestBed.createComponent(DataComponent);
    component = fixture.componentInstance;
    service = TestBed.get(DataService);
    spyOn(service, 'getData').and.returnValue(of(data));
    fixture.detectChanges();
  });

Если data является переменной, сделайте:

  beforeEach(() => {
    fixture = TestBed.createComponent(DataComponent);
    component = fixture.componentInstance;
    service = TestBed.get(DataService);
  });

// метод тестирования

it('should call get data Function', () => {
    spyOn(service, 'getData').and.returnValue(of(data));
    // other required setup
    fixture.detectChanges();
    // test stuff
  });

Answer 2

Вы запускаете fixture.detectChanges(), внутри вас beforeEach - это проблема. В тот момент, когда вы вызываете detectChanges, ваш компонент инициализируется, поэтому измените код, как показано ниже

beforeEach(() => {
    fixture = TestBed.createComponent(DataComponent);
    component = fixture.componentInstance;
    service = TestBed.inject(DataService);

  });

it('should call get data Function', () => {
    spyOn(service, 'getData').and.returnValue(of(data));
    fixture.detectChanges();
  });