title: How to mock AngularFire 2 service in unit test?
body: <p>I'm trying to set up unit tests for a sample Angular 2 app using AngularFire 2 auth, the component is fairly simple:</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { AngularFire, AuthProviders } from 'angularfire2';
  
  @Component({
    moduleId: module.id,
    selector: 'app-root',
    templateUrl: 'app.component.html',
    styleUrls: ['app.component.css']
  })
  export class AppComponent {
    isLoggedIn: boolean;
  
    constructor(public af: AngularFire) {
      this.af.auth.subscribe(auth =&gt; {
        if (auth) {
          this.isLoggedIn = true;
        } else {
          this.isLoggedIn = false;
        }
      });
    }
  
    loginWithFacebook() {
      this.af.auth.login({
        provider: AuthProviders.Facebook
      });
    }
  
    logout() {
      this.af.auth.logout();
    }
  }
  </code></pre>
  
  <p>All I'm doing is wrapping around the <code>login</code> and <code>logout</code> methods in AngularFire so I was thinking about using a mock to check if the methods were called but I'm not sure where to start, I tried doing the following in my spec file:</p>
  
  <pre><code>import { provide } from '@angular/core';
  import { AngularFire } from 'angularfire2';
  import {
    beforeEach, beforeEachProviders,
    describe, xdescribe,
    expect, it, xit,
    async, inject
  } from '@angular/core/testing';
  import { AppComponent } from './app.component';
  
  spyOn(AngularFire, 'auth');
  
  beforeEachProviders(() =&gt; [
    AppComponent,
    AngularFire
  ]);
  
  describe('App Component', () =&gt; {
    it('should create the app',
      inject([AppComponent], (app: AppComponent) =&gt; {
        expect(app).toBeTruthy();
      })
    );
  
    it('should log user in',
      inject([AppComponent], (app: AppComponent) =&gt; {
        expect(app.fb.auth.login).toHaveBeenCalled();
      })
    );
  
    it('should log user out',
      inject([AppComponent], (app: AppComponent) =&gt; {
        expect(app.fb.auth.logout).toHaveBeenCalled();
      })
    );
  });
  </code></pre>
  
  <p>However I'm not sure how to mock the <code>login</code> and <code>logout</code> methods since they're part of the <code>auth</code> property, is there a way to mock <code>auth</code> and also the returning <code>login</code> and <code>logout</code> methods?</p>