How to spy a service call in Angular2 : <p>Following the code example found on Ari Lerner ng-book2, and using Angular 2 beta 7, I'm trying to mock and spy a call to a service unsuccessfully.</p>

<p>This is the main component using the service:</p>

<p><em>user-list.component.ts</em></p>

<pre class="lang-js prettyprint-override"><code>import {Component, OnInit} from 'angular2/core';
import {UserService} from './user.service';
import {IUser} from './user.model';

@Component({
  selector: 'user-list',
  providers: [UserService],
  template: `
    &lt;div *ngFor="#user of users" class="user"&gt;
      &lt;span class="username"&gt;Username: {{ user.username }}&lt;/span&gt;&lt;br&gt;
      &lt;span class="email"&gt;Email: {{ user.email }}&lt;/span&gt;
    &lt;/div&gt;
  `
})
export class UserListComponent implements OnInit {
  public users: IUser[];
  private userService: UserService;

  constructor(userService: UserService) {
    this.userService = userService;
  }

  ngOnInit(): void {
    this.userService.getAllUsers().subscribe(
      (users: IUser[]) =&gt; {
        this.users = users;
      },
      (error: any) =&gt; {
        console.log(error);
      }
    );
  }
}
</code></pre>

<p>And this is the service itself.</p>

<p><em>user.service.ts</em></p>

<pre class="lang-js prettyprint-override"><code>import {Injectable} from 'angular2/core';
import {Http} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
import 'rxjs/Rx';
import {IUser} from './user.model';

@Injectable()
export class UserService {
  private http: Http;
  private baseUrl: string = 'http://jsonplaceholder.typicode.com/users';

  constructor(http: Http) {
    this.http = http;
  }

  public getAllUsers(): Observable&lt;IUser[]&gt; {
    return this.http.get(this.baseUrl)
      .map(res =&gt; res.json());
  }
}
</code></pre>

<p>In order to test the <code>UserListComponent</code>, I'm trying to mock the <code>UserService</code> and spy its method call <code>getAllUser</code> using the following code:</p>

<p><em>user-list.component.spec.ts</em></p>

<pre class="lang-js prettyprint-override"><code>import {
  describe, 
  expect, 
  it,
  injectAsync,
  TestComponentBuilder,
  ComponentFixture,
  setBaseTestProviders,
} from 'angular2/testing';

import {SpyObject} from 'angular2/testing_internal';

import {
  TEST_BROWSER_PLATFORM_PROVIDERS, 
  TEST_BROWSER_APPLICATION_PROVIDERS
} from 'angular2/platform/testing/browser';

import {provide} from 'angular2/core';

import {UserListComponent} from './user-list.component';
import {UserService} from './user.service';

class SpyUserService extends SpyObject {
  public getAllUsers: Function;
  public fakeResponse: any = null;

  constructor() {
    super(UserService);
    this.getAllUsers = this.spy('getAllUsers').andReturn(this);
  }

  public subscribe(callback) {
    callback(this.fakeResponse);
  }

  public setResponse(data: any): void {
    this.fakeResponse = data;
  }
}

describe('When rendering the UserListComponent and mocking the UserService', () =&gt; {

  setBaseTestProviders(TEST_BROWSER_PLATFORM_PROVIDERS, TEST_BROWSER_APPLICATION_PROVIDERS);  

  it('should show one mocked user', injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) =&gt; {

    let spyUserService = new SpyUserService();
    spyUserService.setResponse([{
      username: 'ryan',
      email: 'ryan@gmail.com'
    }]);

    return tcb
      .overrideProviders(UserListComponent, [provide(UserService, {useValue: spyUserService})])
      .createAsync(UserListComponent)
      .then((fixture: ComponentFixture) =&gt; {
        fixture.detectChanges();
        expect(spyUserService.getAllUsers).toHaveBeenCalled();
      });
  }));

});
</code></pre>

<p>When using karma to run the test I'm getting the following console error:</p>

<pre class="lang-sh prettyprint-override"><code>Chrome 48.0.2564 (Mac OS X 10.11.3) ERROR
  Uncaught TypeError: Cannot read property 'isSlow' of null
  at /Users/david/apps/sandbox/angular2-testing-cookbook/src/tests.entry.ts:19430
</code></pre>

<p><strong>Do anybody know why is this error being thrown or the proper way to mock and spy a service for unit testing an Angular 2 component?</strong></p>
