title: Function is never called inside a switchMap with unit test angular + jasmine and SpyOn
body: <p>i'm trying do a test to know if a function of a service is called, but always it returns me that is not calling. I do not know what I'm doing wrong. 
  The function that i want know if it's called this inside a switchMap, this function is a service. (this.heroSearchService.search(term))</p>
  
  <p>This is the message that shows <code>Expected spy search to have been called.</code></p>
  
  <p>This is my component. </p>
  
  <pre><code>export class HeroSearchComponent implements OnInit {
    heroes: Observable&lt;Hero[]&gt;;
    private searchTerms = new Subject&lt;string&gt;();
  
    constructor(
      private heroSearchService: HeroSearchService
    ) {}
  
    search(term: string): void {
      // Push a search term into the observable stream.
      this.searchTerms.next(term);
    }
  
    ngOnInit(): void {    
      this.heroes = this.searchTerms.pipe(
        debounceTime(300), // wait for 300ms pause in events
        distinctUntilChanged(), // ignore if next search term is same as previous
        switchMap(term =&gt; term ? this.heroSearchService.search(term) : of&lt;Hero[]&gt;([])),
        catchError(error =&gt; {
          // TODO: real error handling
          console.log(`Error in component ... ${error}`);
          return of&lt;Hero[]&gt;([]);
        })
      );    
    }
  }
  </code></pre>
  
  <p>This is my mock service. </p>
  
  <pre><code>export const MockHeroSearchService = {
      search: (term: string): Observable&lt;Array&lt;Hero&gt;&gt; =&gt; {
          let heroes = defaultHeroes.filter(hero =&gt; hero.name.includes(term)) as Array&lt;Hero&gt;;
          return of(heroes);
      }
  }
  </code></pre>
  
  <p>This is my test file. Inside this file this the test where i created the spy (<code>spyOn(heroSearchService, 'search').and.callThrough();</code>) and the expect that fails is <code>expect(heroSearchService.search).toHaveBeenCalled();</code></p>
  
  <pre><code>beforeEach(async(() =&gt; {
          TestBed.configureTestingModule({
              imports: [CommonModule, HttpClientTestingModule, RouterTestingModule, FormsModule], //If our component uses routing, httpclient
              declarations: [HeroSearchComponent], //Here we put all the components that use our component. 
              providers: [
                  //Here we can inject the dependencies that our component needs.
                  //If our dependecies are services, we can create a simulated service.
                  { provide: HeroSearchService, useValue: MockHeroSearchService },
              ]
          }).compileComponents();
      }));
  
      //Arrange
      beforeEach(() =&gt; {
          heroSearchService = TestBed.get(HeroSearchService);
          fixture = TestBed.createComponent(HeroSearchComponent);
          debugElement = fixture.debugElement;
          heroSearchComponent = fixture.componentInstance;
          //fixture.detectChanges();// Comments, so that it does run the of method ngOnInit();
      });
  
     fit('should with the correct search term, the variable heros have at least a hero', fakeAsync(() =&gt; {
          spyOn(heroSearchService, 'search').and.callThrough();
          fixture.detectChanges();
  
          const input = fixture.debugElement.query(By.css('#search-box'));
          input.nativeElement.value = 'And';
          input.triggerEventHandler('keyup', null);
  
          tick(600);
          fixture.detectChanges();
  
          expect(heroSearchService.search).toHaveBeenCalled();                       
      }));
  </code></pre>
  
  <p>I too run the code coverage and this is result. Where is shows that line is execute. </p>
  
  <p><a href="https://i.stack.imgur.com/A2FjC.png" rel="noreferrer"><img src="https://i.stack.imgur.com/A2FjC.png" alt="enter image description here"></a></p>
  
  <p>I hope you can help me. excuse me for my english.</p>