feat(tests): add missing unit tests to have 100% test coverage

Author: ghiscoding-SE

src/app/modules/angular-slickgrid/filters/__tests__/autoCompleteFilter.spec.ts

@@ -4,7 +4,7 @@ import { Filters } from '..';
 import { AutoCompleteFilter } from '../autoCompleteFilter';
 import { AutocompleteOption, Column, FieldType, FilterArguments, GridOption, OperatorType } from '../../models';
 import { CollectionService } from './../../services/collection.service';
-import { of } from 'rxjs';
+import { of, Subject } from 'rxjs';
 
 const containerId = 'demo-container';
 
@@ -109,14 +109,12 @@ describe('AutoCompleteFilter', () => {
     }
   });
 
-  xit('should throw an error when "collectionAsync" Observable does not return a valid array', (done) => {
-    try {
-      mockColumn.filter.collectionAsync = of({ hello: 'world' });
-      filter.init(filterArguments);
-    } catch (e) {
+  it('should throw an error when "collectionAsync" Observable does not return a valid array', (done) => {
+    mockColumn.filter.collectionAsync = of({ hello: 'world' });
+    filter.init(filterArguments).catch((e) => {
       expect(e.toString()).toContain(`Something went wrong while trying to pull the collection from the "collectionAsync" call in the AutoComplete Filter, the collection is not a valid array.`);
       done();
-    }
+    });
   });
 
   it('should initialize the filter', () => {
@@ -299,6 +297,33 @@ describe('AutoCompleteFilter', () => {
     });
   });
 
+  it('should create the multi-select filter with a "collectionAsync" as an Observable and be able to call next on it', (done) => {
+    const mockCollection = ['male', 'female'];
+    mockColumn.filter.collectionAsync = of(mockCollection);
+
+    filterArguments.searchTerms = ['female'];
+    filter.init(filterArguments);
+
+    setTimeout(() => {
+      const filterElm = divContainer.querySelector<HTMLInputElement>('input.filter-gender');
+      filter.setValues('male');
+
+      filterElm.focus();
+      filterElm.dispatchEvent(new (window.window as any).KeyboardEvent('keyup', { keyCode: 97, bubbles: true, cancelable: true }));
+
+      // after await (or timeout delay) we'll get the Subject Observable
+      mockCollection.push('other');
+      (mockColumn.filter.collectionAsync as Subject<any[]>).next(mockCollection);
+
+      const autocompleteUlElms = document.body.querySelectorAll<HTMLUListElement>('ul.ui-autocomplete');
+      const filterFilledElms = divContainer.querySelectorAll<HTMLInputElement>('input.filter-gender.filled');
+
+      expect(autocompleteUlElms.length).toBe(1);
+      expect(filterFilledElms.length).toBe(1);
+      done();
+    });
+  });
+
   it('should create the filter and filter the string collection when "collectionFilterBy" is set', () => {
     mockColumn.filter = {
       collection: ['other', 'male', 'female'],

src/app/modules/angular-slickgrid/filters/__tests__/selectFilter.spec.ts

@@ -539,14 +539,12 @@ describe('SelectFilter', () => {
     });
   });
 
-  xit('should throw an error when "collectionAsync" Observable does not return a valid array', (done) => {
-    try {
-      mockColumn.filter.collectionAsync = of({ hello: 'world' });
-      filter.init(filterArguments, true);
-    } catch (e) {
+  it('should throw an error when "collectionAsync" Observable does not return a valid array', (done) => {
+    mockColumn.filter.collectionAsync = of({ hello: 'world' });
+    filter.init(filterArguments, true).catch((e) => {
       expect(e.toString()).toContain(`Something went wrong while trying to pull the collection from the "collectionAsync" call in the Select Filter, the collection is not a valid array.`);
       done();
-    }
+    });
   });
 
   it('should create the multi-select filter with a default search term and have the HTML rendered when "enableRenderHtml" is set', () => {

src/app/modules/angular-slickgrid/filters/autoCompleteFilter.ts

@@ -107,7 +107,7 @@ export class AutoCompleteFilter implements Filter {
   /**
    * Initialize the filter template
    */
-  init(args: FilterArguments) {
+  init(args: FilterArguments): Promise<boolean> {
     if (!args) {
       throw new Error('[Angular-SlickGrid] A filter must always have an "init()" with valid arguments.');
     }
@@ -134,7 +134,9 @@ export class AutoCompleteFilter implements Filter {
     // if "collectionAsync" is already set by the user, it will resolve it first then after it will replace it with a Subject
     const collectionAsync = this.columnFilter && this.columnFilter.collectionAsync;
     if (collectionAsync) {
-      this.renderOptionsAsync(collectionAsync); // create Subject after resolve (createCollectionAsyncSubject)
+      return this.renderOptionsAsync(collectionAsync); // create Subject after resolve (createCollectionAsyncSubject)
+    } else {
+      return new Promise((resolve) => resolve(true));
     }
   }
 
@@ -209,7 +211,7 @@ export class AutoCompleteFilter implements Filter {
     return outputCollection;
   }
 
-  protected async renderOptionsAsync(collectionAsync: Promise<any> | Observable<any> | Subject<any>) {
+  protected async renderOptionsAsync(collectionAsync: Promise<any> | Observable<any> | Subject<any>): Promise<boolean> {
     let awaitedCollection: any = [];
 
     if (collectionAsync) {
@@ -221,6 +223,7 @@ export class AutoCompleteFilter implements Filter {
       // doing this provide the user a way to call a "collectionAsync.next()"
       this.createCollectionAsyncSubject();
     }
+    return true;
   }
 
   /** Create or recreate an Observable Subject and reassign it to the "collectionAsync" object so user can call a "collectionAsync.next()" on it */

src/app/modules/angular-slickgrid/filters/selectFilter.ts

@@ -107,7 +107,7 @@ export class SelectFilter implements Filter {
   /**
    * Initialize the filter template
    */
-  init(args: FilterArguments, isFilterFirstRender: boolean) {
+  init(args: FilterArguments, isFilterFirstRender: boolean): Promise<boolean> {
     if (!args) {
       throw new Error('[Angular-SlickGrid] A filter must always have an "init()" with valid arguments.');
     }
@@ -155,7 +155,9 @@ export class SelectFilter implements Filter {
     // if "collectionAsync" is already set by the user, it will resolve it first then after it will replace it with a Subject
     const collectionAsync = this.columnFilter && this.columnFilter.collectionAsync;
     if (collectionAsync) {
-      this.renderOptionsAsync(collectionAsync); // create Subject after resolve (createCollectionAsyncSubject)
+      return this.renderOptionsAsync(collectionAsync); // create Subject after resolve (createCollectionAsyncSubject)
+    } else {
+      return new Promise((resolve) => resolve(true));
     }
   }
 
@@ -252,7 +254,7 @@ export class SelectFilter implements Filter {
     return outputCollection;
   }
 
-  protected async renderOptionsAsync(collectionAsync: Promise<any> | Observable<any> | Subject<any>) {
+  protected async renderOptionsAsync(collectionAsync: Promise<any> | Observable<any> | Subject<any>): Promise<boolean> {
     let awaitedCollection: any = [];
 
     if (collectionAsync) {
@@ -264,6 +266,7 @@ export class SelectFilter implements Filter {
       // doing this provide the user a way to call a "collectionAsync.next()"
       this.createCollectionAsyncSubject();
     }
+    return true;
   }
 
   /** Create or recreate an Observable Subject and reassign it to the "collectionAsync" object so user can call a "collectionAsync.next()" on it */