feat(tests): add more unit tests & cleanup some code

src/app/modules/angular-slickgrid/editors/__tests__/autoCompleteEditor.spec.ts

@@ -454,6 +454,38 @@ describe('AutoCompleteEditor', () => {
         expect(spyCommitEdit).toHaveBeenCalled();
         expect(spySetValue).toHaveBeenCalledWith('Female');
       });
+
+      it('should expect the "onSelect" method to be called when the callback method is triggered', () => {
+        gridOptionMock.autoCommitEdit = true;
+        mockColumn.internalColumnEditor.collection = [{ value: 'm', label: 'Male' }, { value: 'f', label: 'Female' }];
+        mockItemData = { id: 123, gender: { value: 'f', label: 'Female' }, isActive: true };
+
+        const event = new CustomEvent('change');
+        editor = new AutoCompleteEditor(editorArguments);
+        const spy = jest.spyOn(editor, 'onSelect');
+        editor.autoCompleteOptions.select(event, { item: 'fem' });
+
+        expect(spy).toHaveBeenCalledWith(event, { item: 'fem' });
+      });
+
+      it('should initialize the editor with editorOptions and expect the "onSelect" method to be called when the callback method is triggered', (done) => {
+        gridOptionMock.autoCommitEdit = true;
+        mockColumn.internalColumnEditor.collection = [{ value: 'm', label: 'Male' }, { value: 'f', label: 'Female' }];
+        mockColumn.internalColumnEditor.editorOptions = { minLength: 3 } as AutocompleteOption;
+        mockItemData = { id: 123, gender: { value: 'f', label: 'Female' }, isActive: true };
+
+        const event = new CustomEvent('change');
+        editor = new AutoCompleteEditor(editorArguments);
+        const onSelectSpy = jest.spyOn(editor, 'onSelect');
+        const focusSpy = jest.spyOn(editor, 'focus');
+        editor.autoCompleteOptions.select(event, { item: 'fem' });
+
+        expect(onSelectSpy).toHaveBeenCalledWith(event, { item: 'fem' });
+        setTimeout(() => {
+          expect(focusSpy).toHaveBeenCalled();
+          done();
+        }, 51);
+      });
     });
   });
 });

src/app/modules/angular-slickgrid/editors/__tests__/dateEditor.spec.ts

@@ -175,6 +175,7 @@ describe('DateEditor', () => {
       const spy = jest.spyOn(editor.flatInstance, 'open');
       const calendarElm = document.body.querySelector<HTMLDivElement>('.flatpickr-calendar');
       editor.show();
+      editor.focus();
 
       expect(calendarElm).toBeTruthy();
       expect(spy).toHaveBeenCalled();

src/app/modules/angular-slickgrid/editors/__tests__/selectEditor.spec.ts

@@ -352,8 +352,10 @@ describe('SelectEditor', () => {
         editor = new SelectEditor(editorArguments, true);
         editor.loadValue(mockItemData);
         const output = editor.serializeValue();
+        const currentValue = editor.currentValue;
 
         expect(output).toEqual([]);
+        expect(currentValue).toEqual('');
       });
 
       it('should return value as a string when using a dot (.) notation for complex object with a collection of string values', () => {
@@ -374,8 +376,10 @@ describe('SelectEditor', () => {
         editor = new SelectEditor(editorArguments, true);
         editor.loadValue(mockItemData);
         const output = editor.serializeValue();
+        const currentValue = editor.currentValue;
 
         expect(output).toEqual([{ label: 'male', value: 'male' }, { label: 'other', value: 'other' }]);
+        expect(currentValue).toEqual({});
       });
 
       it('should return object value when using a dot (.) notation and we override the object path using "complexObjectPath" to find correct values', () => {

src/app/modules/angular-slickgrid/editors/__tests__/singleSelectEditor.spec.ts

@@ -241,7 +241,7 @@ describe('SelectEditor', () => {
         const editorListElm = divContainer.querySelectorAll<HTMLInputElement>(`[name=editor-gender].ms-drop ul>li span`);
         editorBtnElm.click();
 
-        expect(editor.getValue()).toEqual(undefined);
+        expect(editor.getValue()).toEqual('');
         expect(editorListElm.length).toBe(2);
         expect(editorListElm[0].innerHTML).toBe('<i class="fa fa-check"></i> True');
       });

src/app/modules/angular-slickgrid/editors/autoCompleteEditor.ts

@@ -24,6 +24,7 @@ const MIN_LENGTH = 3;
  * KeyDown events are also handled to provide handling for Tab, Shift-Tab, Esc and Ctrl-Enter.
  */
 export class AutoCompleteEditor implements Editor {
+  private _autoCompleteOptions: AutocompleteOption;
   private _currentValue: any;
   private _defaultTextValue: string;
   private _elementCollection: any[];
@@ -51,6 +52,11 @@ export class AutoCompleteEditor implements Editor {
     this.init();
   }
 
+  /** Getter for the Autocomplete Option */
+  get autoCompleteOptions(): Partial<AutocompleteOption> {
+    return this._autoCompleteOptions || {};
+  }
+
   /** Get the Collection */
   get editorCollection(): any[] {
     return this.columnDef && this.columnDef.internalColumnEditor && this.columnDef.internalColumnEditor.collection || [];
@@ -289,13 +295,16 @@ export class AutoCompleteEditor implements Editor {
     // we still need to provide our own "select" callback implementation
     if (autoCompleteOptions) {
       autoCompleteOptions.select = (event: Event, ui: any) => this.onSelect(event, ui);
+      this._autoCompleteOptions = { ...autoCompleteOptions };
       this._$editorElm.autocomplete(autoCompleteOptions);
     } else {
-      this._$editorElm.autocomplete({
+      const definedOptions: AutocompleteOption = {
         source: finalCollection,
         minLength: 0,
         select: (event: Event, ui: any) => this.onSelect(event, ui),
-      });
+      };
+      this._autoCompleteOptions = { ...definedOptions, ...(this.columnEditor.editorOptions as AutocompleteOption) };
+      this._$editorElm.autocomplete(this._autoCompleteOptions);
     }
 
     setTimeout(() => this.focus(), 50);

src/app/modules/angular-slickgrid/editors/dateEditor.ts

@@ -139,10 +139,9 @@ export class DateEditor implements Editor {
   }
 
   focus() {
+    this._$input.focus();
     if (this._$inputWithData && typeof this._$inputWithData.focus === 'function') {
       this._$inputWithData.focus().select();
-    } else if (this._$input && typeof this._$input.focus === 'function') {
-      this._$input.focus().select();
     }
   }
 

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

@@ -473,5 +473,28 @@ describe('AutoCompleteFilter', () => {
       expect(spySetValue).toHaveBeenCalledWith('Female');
       expect(spyCallback).toHaveBeenCalledWith(null, { columnDef: mockColumn, operator: 'EQ', searchTerms: ['f'], shouldTriggerQuery: true });
     });
+
+    it('should expect the "onSelect" method to be called when the callback method is triggered', () => {
+      const spy = jest.spyOn(filter, 'onSelect');
+      const event = new CustomEvent('change');
+
+      mockColumn.filter.collection = [{ value: 'male', label: 'male' }, { value: 'female', label: 'female' }];
+      filter.init(filterArguments);
+      filter.autoCompleteOptions.select(event, { item: 'fem' });
+
+      expect(spy).toHaveBeenCalledWith(event, { item: 'fem' });
+    });
+
+    it('should initialize the filter with filterOptions and expect the "onSelect" method to be called when the callback method is triggered', () => {
+      const spy = jest.spyOn(filter, 'onSelect');
+      const event = new CustomEvent('change');
+
+      mockColumn.filter.collection = [{ value: 'male', label: 'male' }, { value: 'female', label: 'female' }];
+      mockColumn.filter.filterOptions = { minLength: 3 } as AutocompleteOption;
+      filter.init(filterArguments);
+      filter.autoCompleteOptions.select(event, { item: 'fem' });
+
+      expect(spy).toHaveBeenCalledWith(event, { item: 'fem' });
+    });
   });
 });

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

@@ -228,4 +228,23 @@ describe('SliderRangeFilter', () => {
     expect(filter.currentValues).toEqual([4, 69]);
     expect(spyCallback).toHaveBeenLastCalledWith(null, { columnDef: mockColumn, clearFilterTriggered: true, shouldTriggerQuery: false });
   });
+
+  it('should expect the slider values to be rendered when the callback method is triggered', () => {
+    const spy = jest.spyOn(filter, 'renderSliderValues');
+
+    mockColumn.filter = { minValue: 4, maxValue: 69, valueStep: 5 };
+    filter.init(filterArguments);
+    filter.sliderOptions.slide(new CustomEvent('change'), { handle: document.createElement('div'), handleIndex: 1, value: 2, values: [2, 3] });
+
+    expect(spy).toHaveBeenCalledWith(2, 3);
+    expect(filter.sliderOptions).toEqual({
+      change: expect.anything(),
+      max: 69,
+      min: 4,
+      range: true,
+      slide: expect.anything(),
+      step: 5,
+      values: [4, 69],
+    });
+  });
 });

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

@@ -23,6 +23,7 @@ declare var $: any;
 
 @Injectable()
 export class AutoCompleteFilter implements Filter {
+  private _autoCompleteOptions: AutocompleteOption;
   private _clearFilterTriggered = false;
   private _collection: any[];
   private _shouldTriggerQuery = true;
@@ -56,6 +57,11 @@ export class AutoCompleteFilter implements Filter {
    */
   constructor(protected translate: TranslateService, protected collectionService: CollectionService) { }
 
+  /** Getter for the Autocomplete Option */
+  get autoCompleteOptions(): Partial<AutocompleteOption> {
+    return this._autoCompleteOptions || {};
+  }
+
   /** Getter for the Collection Options */
   protected get collectionOptions(): CollectionOption {
     return this.columnDef && this.columnDef.filter && this.columnDef.filter.collectionOptions || {};
@@ -337,13 +343,16 @@ export class AutoCompleteFilter implements Filter {
     // we still need to provide our own "select" callback implementation
     if (autoCompleteOptions) {
       autoCompleteOptions.select = (event: Event, ui: any) => this.onSelect(event, ui);
+      this._autoCompleteOptions = { ...autoCompleteOptions };
       $filterElm.autocomplete(autoCompleteOptions);
     } else {
-      $filterElm.autocomplete({
+      const definedOptions: AutocompleteOption = {
         minLength: 0,
         source: collection,
         select: (event: Event, ui: any) => this.onSelect(event, ui),
-      });
+      };
+      this._autoCompleteOptions = { ...definedOptions, ...(this.columnFilter.filterOptions as AutocompleteOption) };
+      $filterElm.autocomplete(this._autoCompleteOptions);
     }
 
     $filterElm.val(searchTermInput);

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

@@ -124,6 +124,23 @@ export class SliderRangeFilter implements Filter {
     }
   }
 
+  /**
+   * Render both slider values (low/high) on screen
+   * @param lowestValue number
+   * @param highestValue number
+   */
+  renderSliderValues(lowestValue: number | string, highestValue: number | string) {
+    const columndId = this.columnDef && this.columnDef.id;
+    const lowerElm = document.querySelector(`.lowest-range-${columndId}`);
+    const highestElm = document.querySelector(`.highest-range-${columndId}`);
+    if (lowerElm && lowerElm.innerHTML) {
+      lowerElm.innerHTML = lowestValue.toString();
+    }
+    if (highestElm && highestElm.innerHTML) {
+      highestElm.innerHTML = highestValue.toString();
+    }
+  }
+
   /**
    * Set value(s) on the DOM element
    * @params searchTerms
@@ -253,21 +270,4 @@ export class SliderRangeFilter implements Filter {
     this._clearFilterTriggered = false;
     this._shouldTriggerQuery = true;
   }
-
-  /**
-   * Render both slider values (low/high) on screen
-   * @param lowestValue number
-   * @param highestValue number
-   */
-  private renderSliderValues(lowestValue: number | string, highestValue: number | string) {
-    const fieldId = this.columnDef && this.columnDef.id;
-    const lowerElm = document.querySelector(`.lowest-range-${fieldId}`);
-    const highestElm = document.querySelector(`.highest-range-${fieldId}`);
-    if (lowerElm && lowerElm.innerHTML) {
-      lowerElm.innerHTML = lowestValue.toString();
-    }
-    if (highestElm && highestElm.innerHTML) {
-      highestElm.innerHTML = highestValue.toString();
-    }
-  }
 }

src/app/modules/angular-slickgrid/formatters/decimalFormatter.ts

@@ -18,7 +18,7 @@ export const decimalFormatter: Formatter = (row: number, cell: number, value: an
     minDecimal = (params.minDecimalPlaces !== null && params.minDecimalPlaces) || (params.decimalPlaces !== null && params.decimalPlaces);
   }
   if (params.maxDecimalPlaces !== null && params.maxDecimalPlaces) {
-    console.warn('[Angular-Slickgrid] please consider using "maxDecimalPlaces" (instead of "maxDecimalPlacesPlaces").');
+    console.warn('[Angular-Slickgrid] please consider using "maxDecimal" (instead of "maxDecimalPlaces").');
     maxDecimal = (params.maxDecimalPlaces !== null && params.maxDecimalPlaces);
   }
 

src/app/modules/angular-slickgrid/services/grid.service.ts

@@ -261,13 +261,13 @@ export class GridService {
 
   /** @deprecated please use "addItem" method instead */
   addItemToDatagrid(item: any, shouldHighlightRow = true, shouldResortGrid = false, shouldTriggerEvent = true, shouldSelectRow = true): number {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "addItem" method since "addItemToDatagrid" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "addItem" method since "addItemToDatagrid" will be deprecated in the future');
     return this.addItem(item, { highlightRow: shouldHighlightRow, resortGrid: shouldResortGrid, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
   }
 
   /** @deprecated please use "addItems" method instead */
   addItemsToDatagrid(items: any[], shouldHighlightRow = true, shouldResortGrid = false, shouldTriggerEvent = true, shouldSelectRow = true): number[] {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "addItems" method since "addItemsToDatagrid" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "addItems" method since "addItemsToDatagrid" will be deprecated in the future');
     return this.addItems(items, { highlightRow: shouldHighlightRow, resortGrid: shouldResortGrid, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
   }
 
@@ -377,25 +377,25 @@ export class GridService {
 
   /** @deprecated please use "deleteItem" method instead */
   deleteDataGridItem(item: any, shouldTriggerEvent = true) {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "deleteItem" method since "deleteDataGridItem" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "deleteItem" method since "deleteDataGridItem" will be deprecated in the future');
     this.deleteItem(item, { triggerEvent: shouldTriggerEvent });
   }
 
   /** @deprecated please use "deleteItems" method instead */
   deleteDataGridItems(items: any[], shouldTriggerEvent = true) {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "deleteItems" method since "deleteDataGridItems" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "deleteItems" method since "deleteDataGridItems" will be deprecated in the future');
     this.deleteItems(items, { triggerEvent: shouldTriggerEvent });
   }
 
   /** @deprecated please use "deleteItemById" method instead */
   deleteDataGridItemById(itemId: string | number, shouldTriggerEvent = true) {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "deleteItemById" method since "deleteDataGridItemById" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "deleteItemById" method since "deleteDataGridItemById" will be deprecated in the future');
     this.deleteItemById(itemId, { triggerEvent: shouldTriggerEvent });
   }
 
   /** @deprecated please use "deleteItemByIds" method instead */
   deleteDataGridItemByIds(itemIds: number[] | string[], shouldTriggerEvent = true) {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "deleteItemByIds" method since "deleteDataGridItemByIds" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "deleteItemByIds" method since "deleteDataGridItemByIds" will be deprecated in the future');
     this.deleteItemByIds(itemIds, { triggerEvent: shouldTriggerEvent });
   }
 
@@ -498,19 +498,19 @@ export class GridService {
 
   /** @deprecated please use "updateItem" method instead */
   updateDataGridItem(item: any, shouldHighlightRow = true, shouldTriggerEvent = true, shouldSelectRow = true): number {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "updateItem" method since "updateDataGridItem" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "updateItem" method since "updateDataGridItem" will be deprecated in the future');
     return this.updateItem(item, { highlightRow: shouldHighlightRow, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
   }
 
   /** @deprecated please use "updateItems" method instead */
   updateDataGridItems(items: any | any[], shouldHighlightRow = true, shouldTriggerEvent = true, shouldSelectRow = true): number[] {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "updateItems" method since "updateDataGridItems" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "updateItems" method since "updateDataGridItems" will be deprecated in the future');
     return this.updateItems(items, { highlightRow: shouldHighlightRow, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
   }
 
   /** @deprecated please use "updateItemById" method instead */
   updateDataGridItemById(itemId: number | string, item: any, shouldHighlightRow = true, shouldTriggerEvent = true, shouldSelectRow = true): number {
-    console.warn('[Angular-Slickgrid - FilterService] please consider using the new "updateItemById" method since "updateDataGridItemById" will be deprecated in the future');
+    console.warn('[Angular-Slickgrid - GridService] please consider using the new "updateItemById" method since "updateDataGridItemById" will be deprecated in the future');
     return this.updateItemById(itemId, item, { highlightRow: shouldHighlightRow, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
   }