added test for window resize to app.component.spec.ts

src/app/app.component.spec.ts

@@ -11,14 +11,14 @@ import {
 } from "@angular/core";
 import { By } from '@angular/platform-browser';
 import { TranslateModule } from "ng2-translate";
-import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap';
+import { Store, StoreModule } from "@ngrx/store";
-import { Store } from "@ngrx/store";
 
 // Load the implementations that should be tested
 import { AppComponent } from './app.component';
-import { HeaderComponent } from './header/header.component';
 
 import { CommonModule } from '@angular/common';
+import { HostWindowState } from "./shared/host-window.reducer";
+import { HostWindowResizeAction } from "./shared/host-window.actions";
 
 let comp:    AppComponent;
 let fixture: ComponentFixture<AppComponent>;
@@ -30,14 +30,10 @@ describe('App component', () => {
   // async beforeEach
   beforeEach(async(() => {
     return TestBed.configureTestingModule({
-      imports: [ CommonModule, TranslateModule.forRoot(), NgbCollapseModule.forRoot()],
+      imports: [ CommonModule, StoreModule.provideStore({}), TranslateModule.forRoot() ],
-      declarations: [ AppComponent, HeaderComponent ], // declare the test component
+      declarations: [ AppComponent ], // declare the test component
       providers: [
-        AppComponent,
+        AppComponent
-        {
-          provide: Store,
-          useClass: class { dispatch = jasmine.createSpy('dispatch') }
-        }
       ],
       schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
     })
@@ -47,7 +43,7 @@ describe('App component', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(AppComponent);
 
-    comp = fixture.componentInstance; // BannerComponent test instance
+    comp = fixture.componentInstance; // component test instance
 
     // query for the title <p> by CSS element selector
     de = fixture.debugElement.query(By.css('p'));
@@ -58,4 +54,24 @@ describe('App component', () => {
     // Perform test using fixture and service
     expect(app).toBeTruthy();
   }));
+
+  describe("when the window is resized", () => {
+    let width: number;
+    let height: number;
+    let store: Store<HostWindowState>;
+
+    beforeEach(() => {
+      store = fixture.debugElement.injector.get(Store);
+      spyOn(store, 'dispatch');
+
+      window.dispatchEvent(new Event('resize'));
+      width = window.innerWidth;
+      height = window.innerHeight;
+    });
+
+    it("should dispatch a HostWindowResizeAction with the width and height of the window as its payload", () => {
+      expect(store.dispatch).toHaveBeenCalledWith(new HostWindowResizeAction(width, height));
+    });
+
+  });
 });

src/app/app.component.ts

@@ -52,7 +52,7 @@ export class AppComponent implements OnDestroy, OnInit {
   @HostListener('window:resize', ['$event'])
   private onResize(event): void {
     this.store.dispatch(
-      new HostWindowResizeAction(event.target.target.innerWidth, event.target.innerHeight)
+      new HostWindowResizeAction(event.target.innerWidth, event.target.innerHeight)
     );
   }
 

src/app/header/header.component.spec.ts

@@ -1,6 +1,5 @@
 import { ComponentFixture, TestBed, async } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
 import { HeaderComponent } from "./header.component";
 import { Store, StoreModule } from "@ngrx/store";
 import { HeaderState } from "./header.reducer";