added error component and coverage for new components

src/app/+collection-page/collection-page.component.html

@@ -31,6 +31,7 @@
       [title]="'collection.page.license'">
     </ds-comcol-page-content>
   </div>
+  <ds-error *ngIf="collectionData.hasFailed | async" message="Error fetching collection"></ds-error>
   <ds-loading *ngIf="collectionData.isLoading | async" message="Loading collection..."></ds-loading>
   <br>
   <div *ngIf="itemData.hasSucceeded | async">
@@ -42,5 +43,6 @@
       [hideGear]="false">
     </ds-object-list>
   </div>
+  <ds-error *ngIf="itemData.hasFailed | async" message="Error fetching items"></ds-error>
   <ds-loading *ngIf="itemData.isLoading | async" message="Loading items..."></ds-loading>
 </div>

src/app/+community-page/community-page.component.html

@@ -24,4 +24,5 @@
   </ds-comcol-page-content>
   <ds-community-page-sub-collection-list></ds-community-page-sub-collection-list>
 </div>
+<ds-error *ngIf="communityData.hasFailed | async" message="Error fetching community"></ds-error>
 <ds-loading *ngIf="communityData.isLoading | async" message="Loading community..."></ds-loading>

src/app/+home-page/top-level-community-list/top-level-community-list.component.html

@@ -9,4 +9,5 @@
     (paginationChange)="updatePage($event)">
   </ds-object-list>
 </div>
+<ds-error *ngIf="topLevelCommunities.hasFailed | async" message="Error fetching top level communities"></ds-error>
 <ds-loading *ngIf="topLevelCommunities.isLoading | async" message="Loading top level communities..."></ds-loading>

src/app/+item-page/full/full-item-page.component.html

@@ -17,4 +17,5 @@
   <ds-item-page-full-file-section [item]="item.payload | async"></ds-item-page-full-file-section>
   <ds-item-page-collections [item]="item.payload | async"></ds-item-page-collections>
 </div>
+<ds-error *ngIf="item.hasFailed | async" message="Error fetching item"></ds-error>
 <ds-loading *ngIf="item.isLoading | async" message="Loading item..."></ds-loading>

src/app/+item-page/simple/item-page.component.html

@@ -21,4 +21,5 @@
     </div>
   </div>
 </div>
+<ds-error *ngIf="item.hasFailed | async" message="Error fetching item"></ds-error>
 <ds-loading *ngIf="item.isLoading | async" message="Loading item..."></ds-loading>

src/app/app.module.ts

@@ -1,7 +1,6 @@
 import { NgModule } from '@angular/core';
 import { CommonModule, APP_BASE_HREF } from '@angular/common';
 import { HttpModule } from '@angular/http';
-import { FormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
 
 import { EffectsModule } from '@ngrx/effects';

src/app/shared/error/error.component.html

@@ -0,0 +1 @@
+<div>{{ message }}</div>

src/app/shared/error/error.component.spec.ts

@@ -0,0 +1,45 @@
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { DebugElement } from '@angular/core';
+
+import { ErrorComponent } from './error.component';
+
+describe('ErrorComponent (inline template)', () => {
+
+  let comp: ErrorComponent;
+  let fixture: ComponentFixture<ErrorComponent>;
+  let de: DebugElement;
+  let el: HTMLElement;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ErrorComponent ], // declare the test component
+    }).compileComponents();  // compile template and css
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ErrorComponent);
+
+    comp = fixture.componentInstance; // ErrorComponent test instance
+
+    // query for the title <div> by CSS element selector
+    de = fixture.debugElement.query(By.css('div'));
+    el = de.nativeElement;
+  });
+
+  it('should create', () => {
+    expect(comp).toBeTruthy();
+  });
+
+  it('should display default message', () => {
+    fixture.detectChanges();
+    expect(el.textContent).toContain(comp.message);
+  });
+
+  it('should display input message', () => {
+    comp.message = 'Test Message';
+    fixture.detectChanges();
+    expect(el.textContent).toContain('Test Message');
+  });
+
+});

src/app/shared/error/error.component.ts

@@ -0,0 +1,12 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'ds-error',
+  styleUrls: ['./error.component.scss'],
+  templateUrl: './error.component.html'
+})
+export class ErrorComponent {
+
+  @Input() message = 'Error...';
+
+}

src/app/shared/loading/loading.component.spec.ts

@@ -0,0 +1,45 @@
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { DebugElement } from '@angular/core';
+
+import { LoadingComponent } from './loading.component';
+
+describe('LoadingComponent (inline template)', () => {
+
+  let comp: LoadingComponent;
+  let fixture: ComponentFixture<LoadingComponent>;
+  let de: DebugElement;
+  let el: HTMLElement;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ LoadingComponent ], // declare the test component
+    }).compileComponents();  // compile template and css
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(LoadingComponent);
+
+    comp = fixture.componentInstance; // LoadingComponent test instance
+
+    // query for the title <div> by CSS element selector
+    de = fixture.debugElement.query(By.css('div'));
+    el = de.nativeElement;
+  });
+
+  it('should create', () => {
+    expect(comp).toBeTruthy();
+  });
+
+  it('should display default message', () => {
+    fixture.detectChanges();
+    expect(el.textContent).toContain(comp.message);
+  });
+
+  it('should display input message', () => {
+    comp.message = 'Test Message';
+    fixture.detectChanges();
+    expect(el.textContent).toContain('Test Message');
+  });
+
+});

src/app/shared/loading/loading.component.ts

@@ -7,6 +7,6 @@ import { Component, Input } from '@angular/core';
 })
 export class LoadingComponent {
 
-  @Input() message: 'Loading...';
+  @Input() message = 'Loading...';
 
 }

src/app/shared/shared.module.ts

@@ -9,25 +9,26 @@ import { TranslateModule } from '@ngx-translate/core';
 
 import { NgxPaginationModule } from 'ngx-pagination';
 
-import { PaginationComponent } from './pagination/pagination.component';
+import { EnumKeysPipe } from './utils/enum-keys-pipe';
 import { FileSizePipe } from './utils/file-size-pipe';
-import { ThumbnailComponent } from '../thumbnail/thumbnail.component';
 import { SafeUrlPipe } from './utils/safe-url-pipe';
+import { TruncatePipe } from './utils/truncate.pipe';
 
+import { CollectionListElementComponent } from '../object-list/collection-list-element/collection-list-element.component';
 import { ComcolPageContentComponent } from './comcol-page-content/comcol-page-content.component';
 import { ComcolPageHeaderComponent } from './comcol-page-header/comcol-page-header.component';
 import { ComcolPageLogoComponent } from './comcol-page-logo/comcol-page-logo.component';
-import { EnumKeysPipe } from './utils/enum-keys-pipe';
+import { CommunityListElementComponent } from '../object-list/community-list-element/community-list-element.component';
+import { ErrorComponent } from './error/error.component';
+import { LoadingComponent } from './loading/loading.component';
+import { ItemListElementComponent } from '../object-list/item-list-element/item-list-element.component';
 import { ObjectListComponent } from './object-list/object-list.component';
 import { ObjectListElementComponent } from '../object-list/object-list-element/object-list-element.component';
-import { ItemListElementComponent } from '../object-list/item-list-element/item-list-element.component';
-import { CommunityListElementComponent } from '../object-list/community-list-element/community-list-element.component';
-import { CollectionListElementComponent } from '../object-list/collection-list-element/collection-list-element.component';
-import { TruncatePipe } from './utils/truncate.pipe';
-import { WrapperListElementComponent } from '../object-list/wrapper-list-element/wrapper-list-element.component';
+import { PaginationComponent } from './pagination/pagination.component';
+import { ThumbnailComponent } from '../thumbnail/thumbnail.component';
 import { SearchResultListElementComponent } from '../object-list/search-result-list-element/search-result-list-element.component';
 import { SearchFormComponent } from './search-form/search-form.component';
-import { LoadingComponent } from './loading/loading.component';
+import { WrapperListElementComponent } from '../object-list/wrapper-list-element/wrapper-list-element.component';
 
 const MODULES = [
   // Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -42,31 +43,32 @@ const MODULES = [
 
 const PIPES = [
   // put shared pipes here
+  EnumKeysPipe,
   FileSizePipe,
   SafeUrlPipe,
-  EnumKeysPipe,
   TruncatePipe
 ];
 
 const COMPONENTS = [
   // put shared components here
-  PaginationComponent,
-  ThumbnailComponent,
   ComcolPageContentComponent,
   ComcolPageHeaderComponent,
   ComcolPageLogoComponent,
+  ErrorComponent,
+  LoadingComponent,
   ObjectListComponent,
   ObjectListElementComponent,
-  WrapperListElementComponent,
+  PaginationComponent,
   SearchFormComponent,
-  LoadingComponent
+  ThumbnailComponent,
+  WrapperListElementComponent
 ];
 
 const ENTRY_COMPONENTS = [
   // put shared entry components (components that are created dynamically) here
-  ItemListElementComponent,
   CollectionListElementComponent,
   CommunityListElementComponent,
+  ItemListElementComponent,
   SearchResultListElementComponent
 ];
 

webpack/webpack.test.js

@@ -5,9 +5,10 @@ const {
 /**
  * Webpack Plugins
  */
-const ProvidePlugin = require('webpack/lib/ProvidePlugin');
+const ContextReplacementPlugin = require('webpack/lib/ContextReplacementPlugin');
 const DefinePlugin = require('webpack/lib/DefinePlugin');
 const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin');
+const ProvidePlugin = require('webpack/lib/ProvidePlugin');
 
 /**
  * Webpack Constants
@@ -75,8 +76,9 @@ module.exports = function (options) {
           loader: 'source-map-loader',
           exclude: [
             // these packages have problems with their sourcemaps
-            root('node_modules/rxjs'),
-            root('node_modules/@angular')
+            root('node_modules/@angular'),
+            root('node_modules/@nguniversal'),
+            root('node_modules/rxjs')
           ]
         },
 
@@ -221,6 +223,12 @@ module.exports = function (options) {
      */
     plugins: [
 
+      new ContextReplacementPlugin(
+        /angular(\\|\/)core(\\|\/)@angular/,
+        root('./src'),
+        {}
+      ),
+
       /**
        * Plugin: DefinePlugin
        * Description: Define free variables.