Can't pass provider to component while testing


#1

My app is running on ionic version 2.0.0-rc.0 , so i am facing this issue while testing a component that has a dependencies defined. like below.

import { Component } from '@angular/core';

import { NavController } from 'ionic-angular';
import {CityService} from '../../services/city.service';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
  //providers: [CityService]
})
export class HomePage {

  constructor(public navCtrl: NavController, private cs: CityService) {
  	console.log(cs);
  }
}

in my AppModule,

@NgModule({
  declarations: [
    MyApp,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage
  ],
  imports: [
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage
  ],
  providers: [
    CityService
  ]
})
export class AppModule {}

and my test,

import { HomePage } from '../pages/home/home';
import { async, TestBed, inject } from '@angular/core/testing';
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { mockNavController } from 'ionic-angular/util/mock-providers';
import { NavController } from 'ionic-angular';
import {CityService} from './city.service';

describe('Sample test', () => {

    beforeEach((done) => {

        TestBed.configureTestingModule({
            declarations: [HomePage],
            schemas: [CUSTOM_ELEMENTS_SCHEMA],
            providers: [
                CityService,
                {provide: NavController, useValue: mockNavController},
            ]
        });
        TestBed.compileComponents();
        done();
    });

    it('should load component', async(() => {
        const fixture = TestBed.createComponent(HomePage);
        fixture.detectChanges();
        expect(fixture).toBeDefined();
    }));

    it('inject providers', inject([CityService], (cs: CityService) => {
        expect(cs.name).toEqual('wow');
    }));
});

The issue is when i run test, it complains,
Failed: Error in ./HomePage class HomePage_Host - inline template:0:0 caused by: No provider for CityService!

The CityService dependencies is being passed and the HomePage component gets the insntace of CityService and i can also console.log(cs) on HomePage constructor it logs correct but it still complains. However, if i add the CityService in HomePage providers array the error doesnt come. but it stops me to mock CityService