import { async , ComponentFixture , TestBed } from '@angular/core/testing' ; import { By } from '@angular/platform-browser' ; import { NgxsModule , Store } from '@ngxs/store' ; import { HeaderComponent } from './header.component' ; import { AddToCart } from '../../state/app.actions' ; import { AppState } from '../../state/app.state' ; import { HttpClientModule } from '@angular/common/http' ; describe ( 'HeaderComponent' , ( ) => { let component ; let store ; let fixture ; beforeEach ( async ( ( ) => { TestBed . configureTestingModule ( { imports : [ NgxsModule . forRoot ( [ AppState ] ) , HttpClientModule ] , declarations : [ HeaderComponent ] } ) . compileComponents ( ) ; } ) ) ; beforeEach ( ( ) => { fixture = TestBed . createComponent ( HeaderComponent ) ; component = fixture . componentInstance ; fixture . detectChanges ( ) ; store = TestBed . get ( Store ) ; } ) ; it ( 'should create' , ( ) => { expect ( component ) . toBeTruthy ( ) ; } ) ; it ( 'should return cart(0)' , ( ) => { const { nativeElement } = fixture . debugElement . query ( By . css ( 'a[routerLink="/cart"]' ) ) ; const expected = 'cart (0)' ; expect ( ( < HTMLAnchorElement > nativeElement ) . innerText ) . toBe ( expected ) ; } ) ; it ( 'should return cart(1)' , ( ) => { const { nativeElement } = fixture . debugElement . query ( By . css ( 'a[routerLink="/cart"]' ) ) ; const expected = 'cart (1)' ; store . dispatch ( new AddToCart ( 'coffee aa' ) ) ; fixture . detectChanges ( ) ; expect ( ( < HTMLAnchorElement > nativeElement ) . innerText ) . toBe ( expected ) ; } ) ; } ) ;