Connections test seems to be using the mock service now.

ngapp/src/app/connections/connections.component.spec.ts

@@ -19,21 +19,22 @@ describe("ConnectionsComponent", () => {
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       imports: [ CoreModule, FormsModule, HttpModule, ModalModule.forRoot(), RouterTestingModule, SharedModule ],
-      declarations: [ ConnectionsComponent, ConnectionsListComponent, ConnectionsCardsComponent ],
-      providers: [
-        { provide: ConnectionService, useValue: MockConnectionService },
-      ]
-    })
-    .compileComponents().then(() => {
-      // Nothing
+      declarations: [ ConnectionsComponent, ConnectionsListComponent, ConnectionsCardsComponent ]
+    });
+
+    // use mock service
+    TestBed.overrideComponent( ConnectionsComponent, {
+      set: {
+        providers: [
+          { provide: ConnectionService, useClass: MockConnectionService },
+        ]
+      }
     });
-  }));
 
-  beforeEach(() => {
     fixture = TestBed.createComponent(ConnectionsComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
-  });
+  }));
 
   it("should be created", () => {
     expect(component).toBeTruthy();
@@ -52,27 +53,27 @@ describe("ConnectionsComponent", () => {
     expect(de).toBeDefined();
   });
 
-  // it("should have Connections", () => {
-  //   // Check component object
-  //   const connections = component.allConnections;
-  //   expect(connections.length).toEqual(3);
-  //
-  //   // Check html has the same number of connection cards
-  //   const cardDebugElems = fixture.debugElement.queryAll(By.css(".connection-card-title"));
-  //   expect(cardDebugElems).toBeDefined();
-  //   expect(cardDebugElems.length).toEqual(3);
-  // });
+  it("should have Connections", () => {
+    // Check component object
+    const connections = component.allConnections;
+    expect(connections.length).toEqual(3);
 
-  // it("should have initial card layout", () => {
-  //   // app-connections-cards should be present
-  //   let debugEl = fixture.debugElement.query(By.css("app-connections-cards"));
-  //   const element = debugEl.nativeElement;
-  //   expect(element).toBeDefined();
-  //
-  //   // app-connections-list should not be present
-  //   debugEl = fixture.debugElement.query(By.css("app-connections-list"));
-  //   expect(debugEl).toBeNull();
-  // });
+    // Check html has the same number of connection cards
+    const cardDebugElems = fixture.debugElement.queryAll(By.css(".connection-card-title"));
+    expect(cardDebugElems).toBeDefined();
+    expect(cardDebugElems.length).toEqual(3);
+  });
+
+  it("should have initial card layout", () => {
+    // app-connections-cards should be present
+    let debugEl = fixture.debugElement.query(By.css("app-connections-cards"));
+    const element = debugEl.nativeElement;
+    expect(element).toBeDefined();
+
+    // app-connections-list should not be present
+    debugEl = fixture.debugElement.query(By.css("app-connections-list"));
+    expect(debugEl).toBeNull();
+  });
 
   // it("should toggle layout", () => {
   //   // Initial layout should be Card Layout

ngapp/src/app/connections/connections.component.ts

@@ -221,10 +221,25 @@ export class ConnectionsComponent extends AbstractPageComponent {
       }
     }
     this.filteredConns.sort( (c1: Connection, c2: Connection) => {
-      let rval: number = c1.getId().localeCompare(c2.getId());
-      if (this.sortDirection === SortDirection.DESC) {
+      let rval = 0;
+
+      if ( c1.getId() ) {
+        if ( c2.getId() ) {
+          // both connections have an ID
+          rval = c1.getId().localeCompare( c2.getId() );
+        } else {
+          // c2 does not have an ID
+          rval = 1;
+        }
+      } else if ( c2.getId() ) {
+        // c1 does not have an ID and c2 does
+        rval = -1;
+      }
+
+      if ( this.sortDirection === SortDirection.DESC ) {
         rval *= -1;
       }
+
       return rval;
     });