Extract test contact to a shared service

apps/parent-form/src/app/app.component.ts

@@ -1,42 +1,35 @@
+import { ContactService } from './../../../../libs/contact-model/src/lib/contact.service';
 import { Contact } from '@nested-forms/contact-model';
-import { Component } from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
 import { FormGroup, FormBuilder } from '@angular/forms';
+import { Subscription } from 'rxjs';
 
 @Component({
   selector: 'nested-forms-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
 })
-export class AppComponent {
+export class AppComponent implements OnInit, OnDestroy {
   title = 'parent-form';
 
-  contact: Contact = {
+  contact: Contact;
-    name: {
-      firstName: 'John',
-      lastName: 'Public',
-      middleName: 'Q',
-      prefix: 'Mr',
-      suffix: 'III',
-    },
-    addresses: [
-      {
-        line_1: '123 Main Street',
-        city: 'New York',
-        state: 'NY',
-        postalCode: '12345',
-      },
-      {
-        line_1: '123 South Street',
-        city: 'Boston',
-        state: 'MA',
-        postalCode: '54321',
-      },
-    ],
-  };
-
   form: FormGroup;
 
-  constructor(private fb: FormBuilder) {
+  private subscription: Subscription
+
+  constructor(private fb: FormBuilder, private service: ContactService) {
     this.form = this.fb.group({});
   }
+
+  public ngOnInit() {
+    this.subscription = this.service.loadContact().subscribe((data: Contact) => {
+      this.contact = data;
+    });
+  }
+
+  public ngOnDestroy() {
+    if (this.subscription) {
+      this.subscription.unsubscribe();
+    }
+  }
 }

libs/contact-model/jest.config.js

@@ -5,5 +5,6 @@ module.exports = {
     '^.+\\.[tj]sx?$': 'ts-jest'
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'html'],
-  coverageDirectory: '../../coverage/libs/contact-model'
+  coverageDirectory: '../../coverage/libs/contact-model',
+  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts']
 };

libs/contact-model/src/index.ts

@@ -1 +1,2 @@
 export * from './lib/contact-model';
+export * from './lib/contact.service';

libs/contact-model/src/lib/contact.service.spec.ts

@@ -0,0 +1,22 @@
+import { Contact } from './contact-model';
+import { TestBed, async } from '@angular/core/testing';
+
+import { ContactService } from './contact.service';
+
+describe('ContactService', () => {
+  let service: ContactService;
+
+  beforeEach(() => {
+    service = new ContactService();
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+
+  it('should return a contact', async(() => {
+    service.loadContact().subscribe((data: Contact) => {
+      expect(data).toBeTruthy();
+    });
+  }));
+});

libs/contact-model/src/lib/contact.service.ts

@@ -0,0 +1,39 @@
+import { Injectable } from '@angular/core';
+
+import { Contact } from '@nested-forms/contact-model';
+import { Observable, of } from 'rxjs';
+
+const contact: Contact = {
+  name: {
+    firstName: 'John',
+    lastName: 'Public',
+    middleName: 'Q',
+    prefix: 'Mr',
+    suffix: 'III',
+  },
+  addresses: [
+    {
+      line_1: '123 Main Street',
+      city: 'New York',
+      state: 'NY',
+      postalCode: '12345',
+    },
+    {
+      line_1: '123 South Street',
+      city: 'Boston',
+      state: 'MA',
+      postalCode: '54321',
+    },
+  ],
+};
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ContactService {
+  constructor() { }
+
+  public loadContact(): Observable<Contact> {
+    return of({...contact});
+  }
+}

libs/contact-model/src/test-setup.ts

@@ -0,0 +1 @@
+import 'jest-preset-angular';