Merge branch 'master' into Environments

.gitignore

@@ -11,6 +11,7 @@ npm-debug.log
 /coverage
 
 /dist/
+/coverage/
 
 .idea
 *.ngfactory.ts

README.md

@@ -143,6 +143,7 @@ and run:
 
 ## Other commands
 There are many more commands in the `scripts` section of `package.json`. Most of these are executed by one of the commands mentioned above.
+
 A command with a name that starts with `pre` or `post` will be executed automatically before or after the script with the matching name. e.g. if you type `npm run start` the `prestart` script will run first, then the `start` script will trigger.
 
 
@@ -172,6 +173,7 @@ dspace-angular
 ├── e2e                         * Folder for e2e test files
 ├── karma.conf.js               * Unit Test configuration file
 ├── nodemon.json                * Nodemon (https://nodemon.io/) configuration
+├── npm-shrinkwrap.json         * Npm dependency lockfile (https://docs.npmjs.com/cli/shrinkwrap)
 ├── package.json                * This file describes the npm package for this project, its dependencies, scripts, etc.
 ├── postcss.config.json         * PostCSS (http://postcss.org/) configuration file
 ├── protractor.conf.js          * E2E tests configuration file
@@ -241,6 +243,13 @@ If you're importing a module that uses CommonJS you need to import as
 import * as _ from 'lodash';
 ```
 
+## npm-shrinkwrap
+This project makes use of [npm-shrinkwrap](https://docs.npmjs.com/cli/shrinkwrap) to ensure that the exact same dependency versions are used every time you install it.
+
+npm-shrinkwrap creates the file `npm-shrinkwrap.json` to track those versions. That file is updated automatically every time you install a new dependency from the commandline (by using `npm install some-lib --save` or `npm install some-lib --save-dev`). 
+
+If you manually add a package or change a version in `package.json` you'll have to update npm-shrinkwrap's lock file as well. You can do so by running `npm run rewrap` 
+
 ## Frequently asked questions
 * Why is my service, aka provider, is not injecting a parameter correctly?
   * Please use `@Injectable()` for your service for typescript to correctly attach the metadata

package.json

@@ -59,7 +59,8 @@
     "test:watch": "karma start --no-single-run --auto-watch",
     "coverage": "http-server -c-1 -o -p 9875 ./coverage",
     "webdriver:start": "node node_modules/protractor/bin/webdriver-manager start --seleniumPort 4444",
-    "webdriver:update": "node node_modules/protractor/bin/webdriver-manager update --standalone"
+    "webdriver:update": "node node_modules/protractor/bin/webdriver-manager update --standalone",
+    "rewrap": "npm shrinkwrap --dev"
   },
   "dependencies": {
     "@angular/common": "2.2.3",
@@ -106,6 +107,7 @@
     "@types/body-parser": "0.0.33",
     "@types/compression": "0.0.33",
     "@types/cookie-parser": "1.3.30",
+    "@types/deep-freeze": "0.0.29",
     "@types/express": "4.0.34",
     "@types/express-serve-static-core": "4.0.39",
     "@types/hammerjs": "2.0.33",
@@ -126,6 +128,7 @@
     "cookie-parser": "1.4.3",
     "copy-webpack-plugin": "4.0.1",
     "css-loader": "^0.26.0",
+    "deep-freeze": "0.0.1",
     "html-webpack-plugin": "^2.21.0",
     "imports-loader": "0.7.0",
     "istanbul-instrumenter-loader": "^0.2.0",

src/app/app.component.spec.ts

@@ -10,15 +10,16 @@ import {
   DebugElement
 } from "@angular/core";
 import { By } from '@angular/platform-browser';
-import { TranslateModule } from "ng2-translate";
-import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap';
-import { Store } from "@ngrx/store";
+import { TranslateModule, TranslateLoader } from "ng2-translate";
+import { Store, StoreModule } 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";
+import { MockTranslateLoader } from "./shared/testing/mock-translate-loader";
 
 let comp: AppComponent;
 let fixture: ComponentFixture<AppComponent>;
@@ -30,16 +31,15 @@ describe('App component', () => {
   // async beforeEach
   beforeEach(async(() => {
     return TestBed.configureTestingModule({
-      imports: [ CommonModule, TranslateModule.forRoot(), NgbCollapseModule.forRoot()],
-      declarations: [ AppComponent, HeaderComponent ], // declare the test component
+      imports: [CommonModule, StoreModule.provideStore({}), TranslateModule.forRoot({
+        provide: TranslateLoader,
+        useClass: MockTranslateLoader
+      })],
+      declarations: [AppComponent], // declare the test component
       providers: [
-        AppComponent,
-        {
-          provide: Store,
-          useClass: class { dispatch = jasmine.createSpy('dispatch') }
-        }
+        AppComponent
       ],
-      schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
+      schemas: [CUSTOM_ELEMENTS_SCHEMA]
     })
   }));
 
@@ -47,7 +47,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 +58,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

@@ -8,7 +8,7 @@ import {
 import { TranslateService } from "ng2-translate";
 import { HostWindowState } from "./shared/host-window.reducer";
 import { Store } from "@ngrx/store";
-import { HostWindowActions } from "./shared/host-window.actions";
+import { HostWindowResizeAction } from "./shared/host-window.actions";
 import { GlobalConfig } from "../config";
 
 @Component({
@@ -59,7 +59,7 @@ export class AppComponent implements OnDestroy, OnInit {
   @HostListener('window:resize', ['$event'])
   private onResize(event): void {
     this.store.dispatch(
-      HostWindowActions.resize(event.target.innerWidth, event.target.innerHeight)
+      new HostWindowResizeAction(event.target.innerWidth, event.target.innerHeight)
     );
   }
 

src/app/header/header.actions.ts

@@ -1,24 +1,43 @@
 import { Action } from "@ngrx/store";
+import { type } from "../shared/ngrx/type";
 
-export class HeaderActions {
-  static COLLAPSE = 'dspace/header/COLLAPSE';
-  static collapse(): Action {
-    return {
-      type: HeaderActions.COLLAPSE
-    }
-  }
+ /**
+ * For each action type in an action group, make a simple
+ * enum object for all of this group's action types.
+ *
+ * The 'type' utility function coerces strings into string
+ * literal types and runs a simple check to guarantee all
+ * action types in the application are unique.
+ */
+export const HeaderActionTypes = {
+  COLLAPSE: type('dspace/header/COLLAPSE'),
+  EXPAND: type('dspace/header/EXPAND'),
+  TOGGLE: type('dspace/header/TOGGLE')
+};
 
-  static EXPAND = 'dspace/header/EXPAND';
-  static expand(): Action {
-    return {
-      type: HeaderActions.EXPAND
-    }
-  }
+export class HeaderCollapseAction implements Action {
+  type = HeaderActionTypes.COLLAPSE;
 
-  static TOGGLE = 'dspace/header/TOGGLE';
-  static toggle(): Action {
-    return {
-      type: HeaderActions.TOGGLE
-    }
-  }
+  constructor() {}
 }
+
+export class HeaderExpandAction implements Action {
+  type = HeaderActionTypes.EXPAND;
+
+  constructor() {}
+}
+
+export class HeaderToggleAction implements Action {
+  type = HeaderActionTypes.TOGGLE;
+
+  constructor() {}
+}
+
+/**
+ * Export a type alias of all actions in this action group
+ * so that reducers can easily compose action types
+ */
+export type HeaderAction
+  = HeaderCollapseAction
+  | HeaderExpandAction
+  | HeaderToggleAction

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

@@ -0,0 +1,81 @@
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { HeaderComponent } from "./header.component";
+import { Store, StoreModule } from "@ngrx/store";
+import { HeaderState } from "./header.reducer";
+import Spy = jasmine.Spy;
+import { HeaderToggleAction } from "./header.actions";
+import { TranslateModule } from "ng2-translate";
+import { NgbCollapseModule } from "@ng-bootstrap/ng-bootstrap";
+import { Observable } from "rxjs";
+
+let comp: HeaderComponent;
+let fixture: ComponentFixture<HeaderComponent>;
+let store: Store<HeaderState>;
+
+describe('HeaderComponent', () => {
+
+  // async beforeEach
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [ StoreModule.provideStore({}), TranslateModule.forRoot(), NgbCollapseModule.forRoot() ],
+      declarations: [ HeaderComponent ]
+    })
+      .compileComponents();  // compile template and css
+  }));
+
+  // synchronous beforeEach
+  beforeEach(() => {
+    fixture = TestBed.createComponent(HeaderComponent);
+
+    comp = fixture.componentInstance;
+
+
+    store = fixture.debugElement.injector.get(Store);
+    spyOn(store, 'dispatch');
+  });
+
+  describe('when the toggle button is clicked', () => {
+
+    beforeEach(() => {
+      let navbarToggler = fixture.debugElement.query(By.css('.navbar-toggler'));
+      navbarToggler.triggerEventHandler('click', null);
+    });
+
+    it("should dispatch a HeaderToggleAction", () => {
+      expect(store.dispatch).toHaveBeenCalledWith(new HeaderToggleAction());
+    });
+
+  });
+
+  describe("when navCollapsed in the store is true", () => {
+    let menu: HTMLElement;
+
+    beforeEach(() => {
+      menu = fixture.debugElement.query(By.css('#collapsingNav')).nativeElement;
+      spyOn(store, 'select').and.returnValue(Observable.of({ navCollapsed: true }));
+      fixture.detectChanges();
+    });
+
+    it("should close the menu", () => {
+      expect(menu.classList).not.toContain('in');
+    });
+
+  });
+
+  describe("when navCollapsed in the store is false", () => {
+    let menu: HTMLElement;
+
+    beforeEach(() => {
+      menu = fixture.debugElement.query(By.css('#collapsingNav')).nativeElement;
+      spyOn(store, 'select').and.returnValue(Observable.of({ navCollapsed: false }));
+      fixture.detectChanges();
+    });
+
+    it("should open the menu", () => {
+      expect(menu.classList).toContain('in');
+    });
+
+  });
+
+});

src/app/header/header.component.ts

@@ -1,9 +1,8 @@
 import { Component, OnInit } from "@angular/core";
 import { Store } from "@ngrx/store";
 import { HeaderState } from "./header.reducer";
-import { HeaderActions } from "./header.actions";
 import { Observable } from "rxjs";
-import 'rxjs/add/operator/filter';
+import { HeaderToggleAction } from "./header.actions";
 
 @Component({
   selector: 'ds-header',
@@ -24,16 +23,8 @@ export class HeaderComponent implements OnInit {
       .map(({ navCollapsed }: HeaderState) => navCollapsed);
   }
 
-  private collapse(): void {
-    this.store.dispatch(HeaderActions.collapse());
-  }
-
-  private expand(): void {
-    this.store.dispatch(HeaderActions.expand());
-  }
-
   public toggle(): void {
-    this.store.dispatch(HeaderActions.toggle());
+    this.store.dispatch(new HeaderToggleAction());
   }
 
 }

src/app/header/header.effects.spec.ts

@@ -0,0 +1,53 @@
+import { TestBed, inject } from "@angular/core/testing";
+import { EffectsTestingModule, EffectsRunner } from '@ngrx/effects/testing';
+import { HeaderEffects } from "./header.effects";
+import { HeaderCollapseAction } from "./header.actions";
+import { HostWindowResizeAction } from "../shared/host-window.actions";
+import { routerActions } from "@ngrx/router-store";
+
+describe('HeaderEffects', () => {
+  beforeEach(() => TestBed.configureTestingModule({
+    imports: [
+      EffectsTestingModule
+    ],
+    providers: [
+      HeaderEffects
+    ]
+  }));
+
+  let runner: EffectsRunner;
+  let headerEffects: HeaderEffects;
+
+  beforeEach(inject([
+      EffectsRunner, HeaderEffects
+    ],
+    (_runner, _headerEffects) => {
+      runner = _runner;
+      headerEffects = _headerEffects;
+    }
+  ));
+
+  describe('resize$', () => {
+
+    it('should return a COLLAPSE action in response to a RESIZE action', () => {
+      runner.queue(new HostWindowResizeAction(800,600));
+
+      headerEffects.resize$.subscribe(result => {
+        expect(result).toEqual(new HeaderCollapseAction());
+      });
+    });
+
+  });
+
+  describe('routeChange$', () => {
+
+    it('should return a COLLAPSE action in response to an UPDATE_LOCATION action', () => {
+      runner.queue({ type: routerActions.UPDATE_LOCATION });
+
+      headerEffects.resize$.subscribe(result => {
+        expect(result).toEqual(new HeaderCollapseAction());
+      });
+    });
+
+  });
+});

src/app/header/header.effects.ts

@@ -1,8 +1,8 @@
 import { Injectable } from "@angular/core";
 import { Effect, Actions } from '@ngrx/effects'
-import { HeaderActions } from "./header.actions";
-import { HostWindowActions } from "../shared/host-window.actions";
+import { HostWindowActionTypes } from "../shared/host-window.actions";
 import { routerActions } from "@ngrx/router-store";
+import { HeaderCollapseAction } from "./header.actions";
 
 @Injectable()
 export class HeaderEffects {
@@ -12,10 +12,10 @@ export class HeaderEffects {
   ) { }
 
   @Effect() resize$ = this.actions$
-    .ofType(HostWindowActions.RESIZE)
-    .map(() => HeaderActions.collapse());
+    .ofType(HostWindowActionTypes.RESIZE)
+    .map(() => new HeaderCollapseAction());
 
   @Effect() routeChange$ = this.actions$
     .ofType(routerActions.UPDATE_LOCATION)
-    .map(() => HeaderActions.collapse());
+    .map(() => new HeaderCollapseAction());
 }

src/app/header/header.reducer.spec.ts

@@ -0,0 +1,89 @@
+import * as deepFreeze from "deep-freeze";
+
+import { headerReducer } from "./header.reducer";
+import {
+  HeaderCollapseAction,
+  HeaderExpandAction,
+  HeaderToggleAction
+} from "./header.actions";
+
+class NullAction extends HeaderCollapseAction {
+  type = null;
+
+  constructor() {
+    super();
+  }
+}
+
+describe("headerReducer", () => {
+  it("should return the current state when no valid actions have been made", () => {
+    const state = { navCollapsed: false };
+    const action = new NullAction();
+    const newState = headerReducer(state, action);
+
+    expect(newState).toEqual(state);
+  });
+
+  it("should start with navCollapsed = true", () => {
+    const action = new NullAction();
+    const initialState = headerReducer(undefined, action);
+
+    // The navigation starts collapsed
+    expect(initialState.navCollapsed).toEqual(true);
+  });
+
+  it("should set navCollapsed to true in response to the COLLAPSE action", () => {
+    const state = { navCollapsed: false };
+    const action = new HeaderCollapseAction();
+    const newState = headerReducer(state, action);
+
+    expect(newState.navCollapsed).toEqual(true);
+  });
+
+  it("should perform the COLLAPSE action without affecting the previous state", () => {
+    const state = { navCollapsed: false };
+    deepFreeze(state);
+
+    const action = new HeaderCollapseAction();
+    headerReducer(state, action);
+
+    //no expect required, deepFreeze will ensure an exception is thrown if the state
+    //is mutated, and any uncaught exception will cause the test to fail
+  });
+
+  it("should set navCollapsed to false in response to the EXPAND action", () => {
+    const state = { navCollapsed: true };
+    const action = new HeaderExpandAction();
+    const newState = headerReducer(state, action);
+
+    expect(newState.navCollapsed).toEqual(false);
+  });
+
+  it("should perform the EXPAND action without affecting the previous state", () => {
+    const state = { navCollapsed: true };
+    deepFreeze(state);
+
+    const action = new HeaderExpandAction();
+    headerReducer(state, action);
+  });
+
+  it("should flip the value of navCollapsed in response to the TOGGLE action", () => {
+    const state1 = { navCollapsed: true };
+    const action = new HeaderToggleAction();
+
+    const state2 = headerReducer(state1, action);
+    const state3 = headerReducer(state2, action);
+
+    expect(state2.navCollapsed).toEqual(false);
+    expect(state3.navCollapsed).toEqual(true);
+  });
+
+  it("should perform the TOGGLE action without affecting the previous state", () => {
+    const state = { navCollapsed: true };
+    deepFreeze(state);
+
+    const action = new HeaderToggleAction();
+    headerReducer(state, action);
+  });
+
+});

src/app/header/header.reducer.ts

@@ -1,5 +1,4 @@
-import { Action } from "@ngrx/store";
-import { HeaderActions } from "./header.actions";
+import { HeaderAction, HeaderActionTypes } from "./header.actions";
 
 export interface HeaderState {
   navCollapsed: boolean;
@@ -9,23 +8,23 @@ const initialState: HeaderState = {
   navCollapsed: true
 };
 
-export const headerReducer = (state = initialState, action: Action): HeaderState => {
+export const headerReducer = (state = initialState, action: HeaderAction): HeaderState => {
   switch (action.type) {
 
-    case HeaderActions.COLLAPSE: {
+    case HeaderActionTypes.COLLAPSE: {
       return Object.assign({}, state, {
         navCollapsed: true
       });
     }
 
-    case HeaderActions.EXPAND: {
+    case HeaderActionTypes.EXPAND: {
       return Object.assign({}, state, {
         navCollapsed: false
       });
 
     }
 
-    case HeaderActions.TOGGLE: {
+    case HeaderActionTypes.TOGGLE: {
       return Object.assign({}, state, {
         navCollapsed: !state.navCollapsed
       });

src/app/shared/host-window.actions.ts

@@ -1,14 +1,21 @@
 import { Action } from "@ngrx/store";
+import { type } from "./ngrx/type";
 
-export class HostWindowActions {
-  static RESIZE = 'dspace/host-window/RESIZE';
-  static resize(newWidth: number, newHeight: number): Action {
-    return {
-      type: HostWindowActions.RESIZE,
+export const HostWindowActionTypes = {
+  RESIZE: type('dspace/host-window/RESIZE')
+};
+
+export class HostWindowResizeAction implements Action {
+  type = HostWindowActionTypes.RESIZE;
   payload: {
-        width: newWidth,
-        height: newHeight
-      }
-    }
+    width: number;
+    height: number;
+  };
+
+  constructor(width: number, height: number) {
+    this.payload = { width, height }
   }
 }
+
+export type HostWindowAction
+  = HostWindowResizeAction;

src/app/shared/host-window.reducer.spec.ts

@@ -0,0 +1,48 @@
+import * as deepFreeze from "deep-freeze";
+import { hostWindowReducer } from "./host-window.reducer";
+import { HostWindowResizeAction } from "./host-window.actions";
+
+class NullAction extends HostWindowResizeAction {
+  type = null;
+
+  constructor() {
+    super(0,0);
+  }
+}
+
+describe('hostWindowReducer', () => {
+
+  it("should return the current state when no valid actions have been made", () => {
+    const state = { width: 800, height: 600 };
+    const action = new NullAction();
+    const newState = hostWindowReducer(state, action);
+
+    expect(newState).toEqual(state);
+  });
+
+  it("should start with width = null and height = null", () => {
+    const action = new NullAction();
+    const initialState = hostWindowReducer(undefined, action);
+
+    expect(initialState.width).toEqual(null);
+    expect(initialState.height).toEqual(null);
+  });
+
+  it("should update the width and height in the state in response to a RESIZE action", () => {
+    const state = { width: 800, height: 600 };
+    const action = new HostWindowResizeAction(1024, 768);
+    const newState = hostWindowReducer(state, action);
+
+    expect(newState.width).toEqual(1024);
+    expect(newState.height).toEqual(768);
+  });
+
+  it("should perform the RESIZE action without affecting the previous state", () => {
+    const state = { width: 800, height: 600 };
+    deepFreeze(state);
+
+    const action = new HostWindowResizeAction(1024, 768);
+    hostWindowReducer(state, action);
+  });
+
+});

src/app/shared/host-window.reducer.ts

@@ -1,5 +1,4 @@
-import { Action } from "@ngrx/store";
-import { HostWindowActions } from "./host-window.actions";
+import { HostWindowAction, HostWindowActionTypes } from "./host-window.actions";
 
 export interface HostWindowState {
   width: number;
@@ -11,10 +10,10 @@ const initialState: HostWindowState = {
   height: null
 };
 
-export const hostWindowReducer = (state = initialState, action: Action): HostWindowState => {
+export const hostWindowReducer = (state = initialState, action: HostWindowAction): HostWindowState => {
   switch (action.type) {
 
-    case HostWindowActions.RESIZE: {
+    case HostWindowActionTypes.RESIZE: {
       return Object.assign({}, state, action.payload);
     }
 

src/app/shared/ngrx/type.ts

@@ -0,0 +1,24 @@
+
+/**
+ * Based on
+ * https://github.com/ngrx/example-app/blob/master/src/app/util.ts
+ *
+ * This function coerces a string into a string literal type.
+ * Using tagged union types in TypeScript 2.0, this enables
+ * powerful typechecking of our reducers.
+ *
+ * Since every action label passes through this function it
+ * is a good place to ensure all of our action labels
+ * are unique.
+ */
+
+let typeCache: { [label: string]: boolean } = {};
+export function type<T>(label: T | ''): T {
+  if (typeCache[<string>label]) {
+    throw new Error(`Action type "${label}" is not unique"`);
+  }
+
+  typeCache[<string>label] = true;
+
+  return <T>label;
+}

src/app/shared/testing/mock-translate-loader.ts

@@ -0,0 +1,8 @@
+import { TranslateLoader } from "ng2-translate";
+import { Observable } from "rxjs";
+
+export class MockTranslateLoader implements TranslateLoader {
+  getTranslation(lang: string): Observable<any> {
+    return Observable.of({});
+  }
+}