Merge pull request #97 from Akkenar/bugfix/Fix_OnDestroy_When_Used_In_Tests

Fix an error when destroying the component

Author: mpalourdio

src/lib/components/ng-http-loader.component.ts

@@ -45,12 +45,12 @@ export class NgHttpLoaderComponent implements OnDestroy, OnInit {
     public entryComponent: any = null;
 
     constructor(private pendingInterceptorService: PendingInterceptorService, private spinnerVisibilityService: SpinnerVisibilityService) {
+        this.initializeSubscription();
     }
 
     ngOnInit(): void {
         this.nullifySpinnerIfEntryComponentIsDefined();
         this.initFilters();
-        this.initializeSubscription();
     }
 
     ngOnDestroy(): void {

src/test/components/ng-http-loader.component.spec.ts

@@ -16,14 +16,21 @@ import { NgHttpLoaderComponent } from '../../lib/components/ng-http-loader.compo
 import { PendingInterceptorServiceInterceptor } from '../../lib/services/pending-interceptor.service';
 import { SpinnerVisibilityService } from '../../lib/services/spinner-visibility.service';
 import { Spinkit, SPINKIT_COMPONENTS } from '../../lib/spinkits';
+import { Component } from '@angular/core';
+
+@Component({
+    template: '<ng-http-loader id="http-loader"></ng-http-loader>'
+})
+export class ComponentWithLoaderComponent {
+}
 
 describe('NgHttpLoaderComponent', () => {
     let component: NgHttpLoaderComponent;
     let fixture: ComponentFixture<NgHttpLoaderComponent>;
 
     beforeEach(async(() => {
         TestBed.configureTestingModule({
-            declarations: [NgHttpLoaderComponent, ...SPINKIT_COMPONENTS],
+            declarations: [NgHttpLoaderComponent, ComponentWithLoaderComponent, ...SPINKIT_COMPONENTS],
             imports: [HttpClientTestingModule],
             providers: [PendingInterceptorServiceInterceptor]
         })
@@ -33,7 +40,6 @@ describe('NgHttpLoaderComponent', () => {
     beforeEach(() => {
         fixture = TestBed.createComponent(NgHttpLoaderComponent);
         component = fixture.componentInstance;
-        component.ngOnInit();
     });
 
     it('should create the ng-http-loader component', () => {
@@ -52,6 +58,19 @@ describe('NgHttpLoaderComponent', () => {
         expect(element.className).toBe('sk-cube-grid colored');
     });
 
+    it('should destroy ng-http-loader as a view dependency without error', () => {
+        const fixtureWithLoader = TestBed.createComponent(ComponentWithLoaderComponent);
+        const componentWithLoader = fixtureWithLoader.componentInstance;
+        expect(componentWithLoader).toBeTruthy();
+
+        const element = fixtureWithLoader
+            .debugElement
+            .query(By.css('#http-loader'));
+        expect(element).toBeTruthy();
+
+        // There shouldn't be any errors in the console when the testbed cleans up the component.
+    });
+
     it('should not set the colored class if background-color is defined', () => {
         component.isSpinnerVisible = true;
         component.backgroundColor = '#ff0000';
@@ -282,7 +301,6 @@ describe('NgHttpLoaderComponent', () => {
 
             const newFixture = TestBed.createComponent(NgHttpLoaderComponent);
             const newComponent = newFixture.componentInstance;
-            newComponent.ngOnInit();
 
             tick();
             expect(newComponent.isSpinnerVisible).toBeTruthy();