title: "Async function did not complete within 5000ms" when creating a unit test on a page with AGM
body: <p>I just created a component with a map for my ionic+angular app.</p>
  <p>It's quite simple, just display one marker at one location:</p>
  <pre><code>&lt;ion-header&gt;
    &lt;ion-toolbar color=&quot;primary&quot;&gt;
      &lt;ion-title&gt;Spots&lt;/ion-title&gt;
    &lt;/ion-toolbar&gt;
  &lt;/ion-header&gt;
  
  &lt;ion-content&gt;
    &lt;agm-map [latitude]=&quot;lat&quot; [longitude]=&quot;lng&quot;&gt;
      &lt;agm-marker [latitude]=&quot;lat&quot; [longitude]=&quot;lng&quot;&gt;&lt;/agm-marker&gt;
    &lt;/agm-map&gt;
  &lt;/ion-content&gt;
  </code></pre>
  <p>And the TS file:</p>
  <pre><code>import { Component, OnInit } from '@angular/core';
  
  @Component({
    selector: 'app-map',
    templateUrl: './map.page.html',
    styleUrls: ['./map.page.scss'],
  })
  export class MapPage implements OnInit {
  
    lat = 51.678418;
    lng = 7.809007;
    constructor() { }
  
    ngOnInit() {
    }
  
  }
  </code></pre>
  <p>it works, I get my map displayed. For the test I had to additionally install <code>@types/googlemaps</code>:</p>
  <pre><code>npm install --save-dev @types/googlemaps
  </code></pre>
  <p>but now my test gives me this error:</p>
  <pre><code>Error: Timeout - Async function did not complete within 5000ms (set by jasmine.DEFAULT_TIMEOUT_INTERVAL)
  </code></pre>
  <p>My test is the default one of ionic(just added AGM module):</p>
  <pre><code>import { AgmCoreModule } from '@agm/core';
  import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  import { IonicModule } from '@ionic/angular';
  
  import { MapPage } from './map.page';
  
  describe('MapPage', () =&gt; {
    let component: MapPage;
    let fixture: ComponentFixture&lt;MapPage&gt;;
  
    beforeEach(async(() =&gt; {
      TestBed.configureTestingModule({
        declarations: [MapPage],
        imports: [
          IonicModule.forRoot(),
          AgmCoreModule.forRoot({
            apiKey: 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
          }),
        ],
      }).compileComponents();
  
      fixture = TestBed.createComponent(MapPage);
      component = fixture.componentInstance;
      fixture.detectChanges();
    }));
  
    it('should create', () =&gt; {
      expect(component).toBeTruthy();
    });
  });
  </code></pre>
  <p>Any idea what is going on? I've not much information in the error and I'm a bit lost what async function may not have completed and what could be wrong? Is it the test? Or the code?</p>
  <p><strong>Edit</strong>
  If I just increment the timeout like specified here, it works, but I don't understand what would take 5 seconds to complete?</p>
  <p><a href="https://stackoverflow.com/questions/41344217/i-am-getting-timeout-async-callback-was-not-invoked-within-timeout-specified-b">I am getting Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL Error</a></p>