import { EditComponent } from './edit.component' ; import { TestBed } from '@angular/core/testing' ; import { Address , Person , SearchService } from '../shared' ; import { MockActivatedRoute , MockRouter } from '../shared/search/mocks/routes' ; import { ActivatedRoute , Router } from '@angular/router' ; import { FormsModule } from '@angular/forms' ; import { of } from 'rxjs' ; import { HttpClientTestingModule } from '@angular/common/http/testing' ; describe ( 'EditComponent' , ( ) => { let mockSearchService ; let mockActivatedRoute ; let mockRouter ; beforeEach ( ( ) => { mockActivatedRoute = new MockActivatedRoute ( { id : 1 } ) ; mockRouter = new MockRouter ( ) ; TestBed . configureTestingModule ( { declarations : [ EditComponent ] , providers : [ { provide : ActivatedRoute , useValue : mockActivatedRoute } , { provide : Router , useValue : mockRouter } ] , imports : [ FormsModule , HttpClientTestingModule ] } ) . compileComponents ( ) ; mockSearchService = TestBed . inject ( SearchService ) ; } ) ; it ( 'should fetch a single record' , ( ) => { const fixture = TestBed . createComponent ( EditComponent ) ; const person = new Person ( { id : 1 , name : 'Gary Harris' } ) ; person . address = new Address ( { city : 'Denver' } ) ; spyOn ( mockSearchService , 'get' ) . and . returnValue ( of ( person ) ) ; fixture . detectChanges ( ) ; expect ( mockSearchService . get ) . toHaveBeenCalledWith ( 1 ) ; const editComponent = fixture . debugElement . componentInstance ; expect ( editComponent . editAddress . city ) . toBe ( 'Denver' ) ; const compiled = fixture . debugElement . nativeElement ; expect ( compiled . querySelector ( 'h3' ) . innerHTML ) . toBe ( 'Gary Harris' ) ; } ) ; } ) ;