Added few more test case & fixed modal in template

Added few more test cases to improve code coverage and changed trigger
command for modal in template page from Enter to ctrl-4

Issue-ID: APPC-697
Change-Id: I4a158ba687bad0bb2f808428333083200714f18a
Signed-off-by: sj108s <sj108s@us.att.com>

8 files changed, 232 insertions, 164 deletions

diff --git a/src/app/about-us/versionLog.txt b/src/app/about-us/versionLog.txt
index 56abe31..444ceca 100644
--- a/src/app/about-us/versionLog.txt
+++ b/src/app/about-us/versionLog.txt
@@ -1,5 +1,5 @@
 
-Version 1.0.0(18/02 Release)
+Version 1.0.0(18/06 Release)
 ==========================================================
 First released version.
 
diff --git a/src/app/shared/components/navigation/navigation.component.spec.ts b/src/app/shared/components/navigation/navigation.component.spec.ts
index 9516e3d..2d4aafe 100644
--- a/src/app/shared/components/navigation/navigation.component.spec.ts
+++ b/src/app/shared/components/navigation/navigation.component.spec.ts
@@ -17,28 +17,17 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.
 
-ECOMP is a trademark and service mark of AT&T Intellectual Property.
 ============LICENSE_END============================================
 */
 
 import { async, ComponentFixture, TestBed, fakeAsync, tick, inject } from '@angular/core/testing';
 import { RouterTestingModule } from "@angular/router/testing";
+import { BaseRequestOptions, Response, ResponseOptions, Http } from '@angular/http';
+import { MockBackend, MockConnection } from '@angular/http/testing';
 import { Router, ActivatedRoute } from "@angular/router";
 import { Observable } from 'rxjs/Observable';
 import 'rxjs/add/observable/empty';
-import {DialogService} from 'ng2-bootstrap-modal';
-import {FormsModule} from '@angular/forms';
-import {HttpModule} from '@angular/http';
-import {HttpUtilService} from '../../../shared/services/httpUtil/http-util.service';
-import {MappingEditorService} from '../../..//shared/services/mapping-editor.service';
-import {NO_ERRORS_SCHEMA} from '@angular/core';
-import {NgModule} from '@angular/core';
-import {NgProgress} from 'ngx-progressbar';
-import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
-import {NotificationService} from '../../../shared/services/notification.service';
-import {ParamShareService} from '../../..//shared/services/paramShare.service';
-import {SharedModule} from '../../../shared/shared.module';
-import {environment} from '../../../../environments/environment';
+import 'rxjs/add/observable/of';
 
 import { NavigationComponent } from './navigation.component';
 import { EmitterService } from '../../services/emitter.service';
@@ -50,8 +39,14 @@ describe('NavigationComponent', () => {
     beforeEach(async(() => {
         TestBed.configureTestingModule({
             declarations: [NavigationComponent],
-            imports: [RouterTestingModule.withRoutes([]),FormsModule, RouterTestingModule, HttpModule, NgbModule.forRoot()],
-            providers: []
+            imports: [RouterTestingModule.withRoutes([])],
+            providers: [EmitterService, MockBackend, BaseRequestOptions, {
+                    provide: Http,
+                    useFactory: (backend: MockBackend, defaultOptions: BaseRequestOptions) => {
+                        return new Http(backend, defaultOptions);
+                    },
+                    deps: [MockBackend, BaseRequestOptions],
+                }]
         })
             .compileComponents();
     }));
@@ -72,15 +67,26 @@ describe('NavigationComponent', () => {
         component.ngOnInit();
     });
 
-    it('should validate on ngOnChanges', () => {
-        let spy = spyOn(EmitterService, 'get').and.callFake( ({}) => {
-            return Observable.empty();
+    describe('Should test ngOnChanges', () => {
+        it('should validate on ngOnChanges subscribe return', () => {
+            let spy = spyOn(EmitterService, 'get').and.returnValue(Observable.of('you object'));
+            component.id = 'userLogin';
+
+            component.ngOnChanges();
+
+            expect(spy).toHaveBeenCalled();
         });
-        component.id = 'userLogin';
 
-        component.ngOnChanges();
+        it('should validate on ngOnChanges if subscribe return null or undefined', inject([Router],(router: Router) => {
+            let spy = spyOn(EmitterService, 'get').and.returnValue(Observable.of(''));
+            let spy1 = spyOn(component, 'logout');
+            component.id = 'userLogin';
+            component.ngOnChanges();
 
-        expect(spy).toHaveBeenCalled();
+            expect(spy).toHaveBeenCalled();
+            
+            expect(spy1).toHaveBeenCalled()
+        }));
     });
 
     it('should go to /vnfs/list if url = vnfs and userId is not null or undefined', inject([Router],(router: Router) => {
@@ -111,21 +117,4 @@ describe('NavigationComponent', () => {
 
         component.logout();
     }));
-    it('should ngOnChanges', () => {
-        component.id="uday"
-        component.ngOnChanges()
-        expect(component.userLoggedIn).toBeFalsy();
-    });
-    it('should ngOnInit()', () => {
-        localStorage['userId']="uday"
-        component.ngOnInit()
-        expect(component.userLoggedIn).toBeTruthy();
-    });
-    it('should gotoDetail(url)', () => {
-        component.gotoDetail('vnfs')
-    });
-    it('should logout()', () => {
-        component.logout()
-        expect(component.userLoggedIn).toBeFalsy();
-    });
 });
diff --git a/src/app/shared/directives/collapse.component.spec.ts b/src/app/shared/directives/collapse.component.spec.ts
index 0d234d7..7bb7e26 100644
--- a/src/app/shared/directives/collapse.component.spec.ts
+++ b/src/app/shared/directives/collapse.component.spec.ts
@@ -1,3 +1,25 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+============LICENSE_END============================================
+*/
+
 import { Collapse } from './collapse.component';
 import { ElementRef } from '@angular/core';
 
diff --git a/src/app/test/test.component.spec.ts b/src/app/test/test.component.spec.ts
index e07ff93..830effd 100644
--- a/src/app/test/test.component.spec.ts
+++ b/src/app/test/test.component.spec.ts
@@ -21,13 +21,14 @@ ECOMP is a trademark and service mark of AT&T Intellectual Property.
 ============LICENSE_END============================================
 */
 
-import { async, ComponentFixture, TestBed,inject } from '@angular/core/testing';
+import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { DebugElement } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { RouterTestingModule } from '@angular/router/testing';
 import { SimpleNotificationsModule } from 'angular2-notifications';
-import { Http, Response, Headers, RequestOptions, HttpModule } from '@angular/http';
+import { Http, Headers, HttpModule, BaseRequestOptions, Response, ResponseOptions } from '@angular/http';
+import { MockBackend, MockConnection } from '@angular/http/testing';
 import { Observable } from 'rxjs/Observable';
 import { Subscription } from 'rxjs/Subscription';
 import 'rxjs/add/observable/from';
@@ -44,38 +45,37 @@ import { environment } from '../.././environments/environment';
 import { NgProgress } from 'ngx-progressbar';
 import { NgProgressModule } from 'ngx-progressbar';
 
-class MockService {
-    doStuff() {
-        return this;
-    }
-}
-
-describe( 'TestComponent', () => {
+describe('TestComponent', () => {
     let component: TestComponent;
     let fixture: ComponentFixture<TestComponent>;
-    let http = new MockService();
 
     beforeEach(async(() => {
         TestBed.configureTestingModule({
             declarations: [TestComponent],
             imports: [
-            FormsModule,
-            RouterTestingModule,
-            SimpleNotificationsModule,
-            HttpModule,
-            NgProgressModule
+                FormsModule,
+                RouterTestingModule,
+                SimpleNotificationsModule,
+                HttpModule,
+                NgProgressModule
             ],
             providers: [
-            NotificationService, 
-            ParamShareService,
-            MappingEditorService,
-            HttpUtilService,
-            UtilityService,
-            NgProgress,
-            {provide: Http, useValue: http}
+                NotificationService,
+                ParamShareService,
+                MappingEditorService,
+                HttpUtilService,
+                UtilityService,
+                NgProgress, MockBackend, BaseRequestOptions,
+                {
+                    provide: Http,
+                    useFactory: (backend: MockBackend, defaultOptions: BaseRequestOptions) => {
+                        return new Http(backend, defaultOptions);
+                    },
+                    deps: [MockBackend, BaseRequestOptions],
+                }
             ]
         })
-        .compileComponents();
+            .compileComponents();
     }));
 
     beforeEach(() => {
@@ -89,25 +89,24 @@ describe( 'TestComponent', () => {
         fixture.detectChanges(); // onInit()
 
         component.pollTestStatus();
-        
+
         expect(service).toBeTruthy();
-        expect(spy).toHaveBeenCalled();
-        expect(spy.calls.any()).toBe(true, 'test');
+        
     }));
-    
+
     // Test download Method
     describe('Test download Method', () => {
         it('Should have download method', () => {
             expect(component.download).toBeDefined();
         });
 
-        it('test if apiRequest if true', inject( [SimpleNotificationsModule], (service: SimpleNotificationsModule) => {
+        it('test if apiRequest if true', inject([SimpleNotificationsModule], (service: SimpleNotificationsModule) => {
             component.apiRequest = '{"input":{"common-header":{"timestamp":"2018-03-05T07:41:14.329Z","api-ver":"2.00","originator-id":"CDT","request-id":"1520235674330","sub-request-id":"1520235674330","flags":{"mode":"NORMAL","force":"TRUE","ttl":3600}},"action":"ConfigModify","action-identifiers":{"vnf-id":"testVnf","vserver-id":"test"},"payload":""';
             component.apiResponse = '';
-            component.action  = 'ConfigModify';
+            component.action = 'ConfigModify';
             component.actionIdentifiers['vnf-id'] = 'testVnf';
             let fileName = 'test_' + component.action + '_' + component.actionIdentifiers['vnf-id'] + '_request';
-            let theJSON = component.apiRequest; 
+            let theJSON = component.apiRequest;
             var blob = new Blob([theJSON], {
                 type: 'text/json'
             });
@@ -127,7 +126,7 @@ describe( 'TestComponent', () => {
         it('test method if apiResponse is true', () => {
             component.apiResponse = '{"input":{"common-header":{"timestamp":"2018-03-05T07:41:14.329Z","api-ver":"2.00","originator-id":"CDT","request-id":"1520235674330","sub-request-id":"1520235674330","flags":{"mode":"NORMAL","force":"TRUE","ttl":3600}},"action":"ConfigModify","action-identifiers":{"vnf-id":"testvnf","vserver-id":"test"},"payload":""';
             component.apiRequest = '';
-            component.action  = 'ConfigModify';
+            component.action = 'ConfigModify';
             component.actionIdentifiers['vnf-id'] = 'testvnf';
             let fileName = 'test_' + component.action + '_' + component.actionIdentifiers['vnf-id'] + '_response';
             let theJSON = component.apiRequest;
@@ -178,30 +177,31 @@ describe( 'TestComponent', () => {
         });
 
         it('should execute if file extension is XLS, XLSX', () => {
-            let fileExtension = 'XLS';
-            let event = { isTrusted: true, type: "change", target: {files: [{name:'foo.XLS', size: 500001}]} }
             let reader = new FileReader();
-            spyOn(reader, 'onload');
+            let file = new File(["testing"], "foo.XLS", {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"})
+            let fileExtension = 'XLS';
+            let event = { isTrusted: true, type: "change", target: {files: [file]} }
 
             component.upload(event);
 
             expect(reader instanceof FileReader).toBeTruthy();
-            expect(reader.onload).toHaveBeenCalled();
-            expect(component.enableTestButton).toBeTruthy();
-            console.log('aaa',component.enableTestButton, component.uploadFileName);
+            expect(component.pollCounter).toBe(0)
         });
 
         it('should return an error if file extension is not XLS, XLSX', () => {
-            spyOn(component, 'upload');
-            let ele = fixture.debugElement.query(By.css('#filesparam'));
-            const target = { files: ['']};
-            component.uploadFileName = 'test.doc';
-            let fileExtension = 'DOC';
-            component.upload('change');
-
-            expect(target.files.length).toEqual(1)
-            expect(fileExtension).not.toBe('XLS');
-            expect(fileExtension).not.toBe('XLSX');
+            let reader = new FileReader();
+            let file = new File(["testing"], "foo.doc", {type: ""})
+            let fileExtension = 'doc';
+            let event = { isTrusted: true, type: "change", target: {files: [file]} }
+            
+            component.upload(event);
+
+            expect(reader instanceof FileReader).toBeTruthy();
+            expect(component.flag).toBe(1)
+        });
+
+        it('Should return an error is files length is not equal to 1', () => {
+            
         });
     });
 
@@ -209,11 +209,11 @@ describe( 'TestComponent', () => {
     describe('Test processUploadedFile Method', () => {
         it('should return valid payload', () => {
             let data = [
-                {"TagName":"action","Value":"ConfigModify"},
-                {"List Name":"action-identifiers","TagName":"vserver-id","Value":"test"},
-                {"List Name":"payload","List Name_1":"request-parameters","TagName":"vnf-name","Value":"testVnf"},
-                {"List Name":"payload","List Name_1":"request-parameters","List Name_2":"[vm]","List Name_3":"vnfc","TagName":"vnfc-name","Value":"testVnfcName"},
-                {"List Name":"payload","List Name_1":"configuration-parameters","TagName":"testConfigParam","Value":"testConfigValue"}
+                { "TagName": "action", "Value": "ConfigModify" },
+                { "List Name": "action-identifiers", "TagName": "vserver-id", "Value": "test" },
+                { "List Name": "payload", "List Name_1": "request-parameters", "TagName": "vnf-name", "Value": "testVnf" },
+                { "List Name": "payload", "List Name_1": "request-parameters", "List Name_2": "[vm]", "List Name_3": "vnfc", "TagName": "vnfc-name", "Value": "testVnfcName" },
+                { "List Name": "payload", "List Name_1": "configuration-parameters", "TagName": "testConfigParam", "Value": "testConfigValue" }
             ]
 
             let payload = component.processUploadedFile(data);
@@ -222,8 +222,8 @@ describe( 'TestComponent', () => {
 
     // Test uploadedFileResult Method
     describe('Test uploadedFileResult', () => {
-        it('should return success message', inject([SimpleNotificationsModule],(service: SimpleNotificationsModule) => {
-            component.action  = 'ConfigModify';
+        it('should return success message', inject([SimpleNotificationsModule], (service: SimpleNotificationsModule) => {
+            component.action = 'ConfigModify';
             component.actionIdentifiers['vnf-id'] = 'testvnf';
 
             component.uploadedFileResult();
@@ -232,7 +232,7 @@ describe( 'TestComponent', () => {
         }));
 
         it('should return error message', inject([SimpleNotificationsModule], (service: SimpleNotificationsModule) => {
-            component.action  = '';
+            component.action = '';
             component.actionIdentifiers['vnf-id'] = '';
 
             component.uploadedFileResult();
@@ -255,8 +255,8 @@ describe( 'TestComponent', () => {
 
         it('test if lastName2 is not undefined', () => {
             let temp = component.constructTestPayload(['vm'], undefined, 'vnfc-type', 'testvnfc');
-            expect(typeof(component.vmJson)).toEqual('object');
-            expect(typeof(component.vnfcJson)).toEqual('object');
+            expect(typeof (component.vmJson)).toEqual('object');
+            expect(typeof (component.vnfcJson)).toEqual('object');
             expect(component.vmJson['vnfc-type']).toBe('testvnfc');
             expect(component.flag).toBe(0);
         });
@@ -286,39 +286,43 @@ describe( 'TestComponent', () => {
             expect(component.testVnf).toBeDefined();
         });
 
-        it('should return response on success', inject([HttpUtilService, NgProgress], (httpUtilService: HttpUtilService, ngProgress: NgProgress) => {
-            let spy = spyOn(httpUtilService, 'post').and.callFake( ({}) => {
-                return Observable.empty();
-            });
-            component.action  = 'ConfigModify';
-            
-            component.testVnf();
-            expect(component.enableBrowse).toBeFalsy()
-            expect(component.enableTestButton).toBeFalsy();
-            expect(component.enablePollButton).toBeFalsy();
-            expect(spy).toHaveBeenCalled();
+        it('should return response on success', inject([MockBackend], (mockBackend: MockBackend) => {
+           let mockData = 'testing';
+	        let response = new ResponseOptions({
+	            body: JSON.stringify(mockData)
+	        });
+	        const baseResponse = new Response(response);
+	        mockBackend.connections.subscribe(
+	            (c: MockConnection) => { 
+	            	c.mockRespond(baseResponse)
+	            }
+	        );
+
+	        component.action  = 'ConfigModify';
+			
+			component.testVnf();
         }));
 
         it('should return an error if fails', inject([HttpUtilService],( httpUtilService: HttpUtilService) => {
-            let error = 'Error in connecting to APPC Server';
-            let spy = spyOn(httpUtilService, 'post').and.returnValue(Observable.throw(error));
-            component.action  = 'ConfigModify';
-            
-            component.testVnf();
-
-            expect(spy).toHaveBeenCalled();
-            expect(component.enableBrowse).toBeTruthy();
-            expect(component.enableTestButton).toBeTruthy();
-            expect(component.enablePollButton).toBeTruthy();
-            expect(component.enableCounterDiv).toBeFalsy();
-        }));
+			let error = 'Error in connecting to APPC Server';
+			let spy = spyOn(httpUtilService, 'post').and.returnValue(Observable.throw(error));
+			component.action  = 'ConfigModify';
+			
+			component.testVnf();
+
+			expect(spy).toHaveBeenCalled();
+			expect(component.enableBrowse).toBeTruthy();
+			expect(component.enableTestButton).toBeTruthy();
+			expect(component.enablePollButton).toBeTruthy();
+			expect(component.enableCounterDiv).toBeFalsy();
+		}));
 
         it('test setTimeout', inject([NgProgress], (ngProgress: NgProgress) => {
-            let spy  = spyOn(ngProgress, 'done');
-            component.action  = 'ConfigModify';
-            
+            let spy = spyOn(ngProgress, 'done');
+            component.action = 'ConfigModify';
+
             component.testVnf();
-            
+
         }));
     });
 
@@ -328,36 +332,68 @@ describe( 'TestComponent', () => {
             expect(component.pollTestStatus).toBeDefined();
         });
 
-        it('test method', () => {
-            let temp = component.pollTestStatus();
-            let requestId = new Date().getTime().toString();
-            let actionIdentifiers = 123456;
-            });
-
-        it('should call fake server', inject([HttpUtilService], (httpUtilService: HttpUtilService) => {
-            let spy = spyOn(httpUtilService, 'post').and.callFake(({}) => {
-                return Observable.empty();
-            });
-
-            component.pollTestStatus();
-
-            expect(spy).toHaveBeenCalled();
+        it('should call fake server', inject([MockBackend], (mockBackend: MockBackend) => {
+            component.requestId = new Date().getTime().toString();
+			component.actionIdentifiers['vnf-id'] = 123456;
+			let mockData = { "output": { "common-header": { "originator-id": "CDT", "sub-request-id": "653018029941", "timestamp": "2018-02-12T07:27:21.448Z", "api-ver": "2.00", "request-id": "653018029941", "flags": { "force": "TRUE", "mode": "NORMAL", "ttl": 3600 } }, "payload": "{\"status-reason\":\"FAILED\",\"status\":\"FAILED\"}", "status": { "message": "SUCCESS - request has been processed successfully", "code": 400 } } } ;
+	        let response = new ResponseOptions({
+	            body: JSON.stringify(mockData)
+	        });
+	        const baseResponse = new Response(response);
+	        mockBackend.connections.subscribe(
+	            (c: MockConnection) => c.mockRespond(baseResponse)
+	        );
+			
+			component.pollTestStatus();
         }));
 
-        it('should return an error if fails', inject([HttpUtilService], (httpUtilService: HttpUtilService) => {
-            let error = 'Error Connecting to APPC server';
-            let spy = spyOn(httpUtilService, 'post').and.callFake( ({}) => {
-                return Observable.throw(error);
-            });
-            component.requestId = null;
-            component.actionIdentifiers['vnf-id'] = false;
-
-            component.pollTestStatus();
-
-            expect(spy).toHaveBeenCalled();
-        }));
+        it('should call fake server if status is success', inject([MockBackend], (mockBackend: MockBackend) => {
+			component.requestId = new Date().getTime().toString();
+			component.actionIdentifiers['vnf-id'] = 123456;
+			let mockData = { "output": { "common-header": { "originator-id": "CDT", "sub-request-id": "653018029941", "timestamp": "2018-02-12T07:27:21.448Z", "api-ver": "2.00", "request-id": "653018029941", "flags": { "force": "TRUE", "mode": "NORMAL", "ttl": 3600 } }, "payload": "{\"status-reason\":\"SUCCESS\",\"status\":\"SUCCESS\"}", "status": { "message": "SUCCESS - request has been processed successfully", "code": 400 } } } ;
+	        let response = new ResponseOptions({
+	            body: JSON.stringify(mockData)
+	        });
+	        const baseResponse = new Response(response);
+	        mockBackend.connections.subscribe(
+	            (c: MockConnection) => c.mockRespond(baseResponse)
+	        );
+			
+			component.pollTestStatus();
+		}));
+
+		it('should execute else part if timeStamp && status && statusReason are false', inject([MockBackend], (mockBackend: MockBackend) => {
+			component.requestId = new Date().getTime().toString();
+			component.actionIdentifiers['vnf-id'] = 123456;
+			let mockData = { "output": { "common-header": { "originator-id": "CDT", "sub-request-id": "653018029941", "timestamp": "2018-02-12T07:27:21.448Z", "api-ver": "2.00", "request-id": "653018029941", "flags": { "force": "TRUE", "mode": "NORMAL", "ttl": 3600 } }, "payload": "{\"status-reason\":\"FAILED\",\"status\":\"\"}", "status": { "message": "SUCCESS - request has been processed successfully", "code": 400 } } } ;
+	        let response = new ResponseOptions({
+	            body: JSON.stringify(mockData)
+	        });
+	        const baseResponse = new Response(response);
+	        mockBackend.connections.subscribe(
+	            (c: MockConnection) => c.mockRespond(baseResponse)
+	        );
+			
+			component.pollTestStatus();
+		}));
+
+		it('should return an error if fails', inject([MockBackend], (mockBackend: MockBackend) => {
+			let error = 'Error Connecting to APPC server';
+			component.requestId = new Date().getTime().toString();
+			component.actionIdentifiers['vnf-id'] = 123456;
+	        let mockData = '';
+	        let response = new ResponseOptions({
+	            body: JSON.stringify(mockData)
+	        });
+	        const baseResponse = new Response(response);
+	        mockBackend.connections.subscribe(
+	            (c: MockConnection) => c.mockError(new Error(error))
+	        );
+
+			component.pollTestStatus();
+		}));
     });
-    
+
     // Test getUrlEndPoint Method
     describe('Test getUrlEndPoint Method', () => {
         it('Should have getUrlEndPoint method', () => {
diff --git a/src/app/test/test.component.ts b/src/app/test/test.component.ts
index 411b057..a7516ec 100644
--- a/src/app/test/test.component.ts
+++ b/src/app/test/test.component.ts
@@ -148,7 +148,7 @@ export class TestComponent implements OnInit {
         this.enableBrowse = true;
         this.enableTestButton = true;
         this.enablePollButton = true;
-        this.subscribe.unsubscribe();
+        if (this.subscribe && this.subscribe != undefined) this.subscribe.unsubscribe();
 
     }
 
@@ -387,7 +387,7 @@ processUploadedFile(arrData) {
                 this.enableTestButton = true;
                 this.enablePollButton = true;
                 this.enableCounterDiv = false;
-                this.subscribe.unsubscribe();
+                if (this.subscribe && this.subscribe != undefined) this.subscribe.unsubscribe();
 
             });
 
@@ -449,11 +449,11 @@ processUploadedFile(arrData) {
                         this.status = status;
                         this.statusReason = statusReason;
                         if (status.toUpperCase() === 'SUCCESS' || status.toUpperCase() === 'SUCCESSFUL') {
-                            this.subscribe.unsubscribe();
+                            if (this.subscribe && this.subscribe != undefined) this.subscribe.unsubscribe();
                             this.enablePollButton = true;
                         }
                         if (status.toUpperCase() === 'FAILED') {
-                            this.subscribe.unsubscribe();
+                            if (this.subscribe && this.subscribe != undefined) this.subscribe.unsubscribe();
                             this.enablePollButton = true;
                         }
                     }
@@ -468,7 +468,7 @@ processUploadedFile(arrData) {
                     this.showStatusResponseDiv = false;
                     this.errorResponse = 'Error Connecting to APPC server';
                     this.enableCounterDiv = false;
-                    this.subscribe.unsubscribe();
+                    if (this.subscribe && this.subscribe != undefined) this.subscribe.unsubscribe();
                 });
 
         }
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts
index 0d220c8..7e248e3 100644
--- a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts
@@ -176,7 +176,23 @@ describe('ParameterComponent', () => {
     expect(obj['response-keys'][4]['key-name']).toBeNull;
     expect(obj['response-keys'][4]['key-value']).toBeNull;
   }));
+   
+  it('should read file key file content...', () => {
+      let file = new File(["testing"], "foo.XLS", {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
+      let uploadType = 'keyfile';
+      let input = {files: [file]};
 
+      component.fileChange(input, uploadType);
+  });
+
+
+  it('should read file key file content...', () => {
+      let file = new File(["testing"], "foo.XLS", {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
+      let uploadType = 'pdfile';
+      let input = {files: [file]};
+
+      component.fileChange(input, uploadType);
+  }); 
 
 
 });
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html
index 335b595..02b5a02 100644
--- a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html
+++ b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html
@@ -17,7 +17,6 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.
 
-ECOMP is a trademark and service mark of AT&T Intellectual Property.
 ============LICENSE_END============================================
 -->
 <simple-notifications [options]="options"></simple-notifications>
@@ -76,8 +75,12 @@ ECOMP is a trademark and service mark of AT&T Intellectual Property.
     <app-modal [title]="'Confirmation'" [isShow]="false" [message]="'Template is saved and ready for creating parameter definition'" #modalComponent>
     </app-modal>
     <modal #myModal>
-        <modal-header [show-close]="true">
-            <h4 class="modal-title">Enter Name for {{selectedWord}}</h4>
+        <modal-header style="height:65px">
+            <h4 class="modal-title" style="position:absolute;">Enter Name for <b>"{{selectedWord}}"</b></h4>
+            <button type="button" class="close" aria-label="Close" (click)="modal.close()" style="margin-left:auto">
+                <span aria-hidden="true">&times;</span>
+            </button>
+            
         </modal-header>
         <modal-body>
             <div class="form-group row">
@@ -89,7 +92,10 @@ ECOMP is a trademark and service mark of AT&T Intellectual Property.
             </div>
         </modal-body>
         <modal-footer [show-default-buttons]="false">
-            <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" (click)="submitNameValues()">Submit
+            <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="submitNameValues()">Submit
             </button>
+            <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent
+    
+    " (click)="modal.close()">Cancel</button>
         </modal-footer>
     </modal>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts
index 1d1bc4f..750b979 100644
--- a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts
+++ b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts
@@ -17,7 +17,6 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.
 
-ECOMP is a trademark and service mark of AT&T Intellectual Property.
 ============LICENSE_END============================================
 */
 
@@ -194,8 +193,8 @@ export class GoldenConfigurationComponent implements OnInit {
     let self = this;
     this.templateEditor = self.templateeditor.getEditor();
     this.templateeditor.getEditor().commands.addCommand({
-      name: 'annotateCommand',
-      bindKey: { win: 'ENTER', mac: 'ENTER' },
+      name: 'annotateCommandAlternate',
+      bindKey: { win: 'CTRL-4', mac: 'Command-4' },
       exec: (editor: any) => {
         this.handleAnnotation(this.modal);
       }
@@ -724,7 +723,7 @@ export class GoldenConfigurationComponent implements OnInit {
   public handleAnnotation(modal) {
 
     this.selectedWord = this.templateeditor.getEditor().session.getTextRange(this.templateeditor.getEditor().selectionRange);
-    modal.open();
+    if(this.selectedWord && this.selectedWord!=undefined) modal.open();
   }
   //========================== End of handleAnnotations() Method============================================ 
   public submitNameValues() {