Ionic 2 NavController unit testing

Question

I'm kinda new to unit testing in Angular 2 and Ionic 2.

I am trying to test the login() method below

export class LoginPage {

  constructor(public navCtrl: NavController) {}

  login() {
    this.navCtrl.setRoot(TabsPage);
  }
}

With the following test

import { ComponentFixture, async } from '@angular/core/testing';
import { TestUtils } from '../../test';
import { LoginPage } from './login';
import { TabsPage } from '../tabs/tabs';

let fixture: ComponentFixture<LoginPage> = null;
let instance: any = null;

describe('Login Page', () => {

  beforeEach(async(() => TestUtils.beforeEachCompiler([LoginPage]).then(compiled => {
    fixture = compiled.fixture;
    instance = compiled.instance;
  })));

  it('changes root nav to TabsPage on login()', () => {
    spyOn(instance.navCtrl, 'setRoot');
    instance.login();
    expect(instance.navCtrl.setRoot).toHaveBeenCalledWith(TabsPage);
  });
});

But I get the following error

Error: <spyOn> : setRoot() method does not exist

I followed this tutorial for set up.

I must be missing something. Is instance.navCtrl the right thing to be spying on?

Answer 1

It ended being a typo. I was using useValue instead of useClass in the provide, so the setRoot method had to be accessed through prototype.

I had

{provide: NavController, useValue: NavMock}

Instead of

{provide: NavController, useClass: NavMock}