Skip to content

Commit 644e1dc

Browse files
ghiscoding-SEghiscoding-SE
committed
feat(tests): add more unit tests & cleanup some code
1 parent e116340 commit 644e1dc

12 files changed

+130
-34
lines changed

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

+32
Original file line numberDiff line numberDiff line change
@@ -454,6 +454,38 @@ describe('AutoCompleteEditor', () => {
454454
expect(spyCommitEdit).toHaveBeenCalled();
455455
expect(spySetValue).toHaveBeenCalledWith('Female');
456456
});
457+
458+
it('should expect the "onSelect" method to be called when the callback method is triggered', () => {
459+
gridOptionMock.autoCommitEdit = true;
460+
mockColumn.internalColumnEditor.collection = [{ value: 'm', label: 'Male' }, { value: 'f', label: 'Female' }];
461+
mockItemData = { id: 123, gender: { value: 'f', label: 'Female' }, isActive: true };
462+
463+
const event = new CustomEvent('change');
464+
editor = new AutoCompleteEditor(editorArguments);
465+
const spy = jest.spyOn(editor, 'onSelect');
466+
editor.autoCompleteOptions.select(event, { item: 'fem' });
467+
468+
expect(spy).toHaveBeenCalledWith(event, { item: 'fem' });
469+
});
470+
471+
it('should initialize the editor with editorOptions and expect the "onSelect" method to be called when the callback method is triggered', (done) => {
472+
gridOptionMock.autoCommitEdit = true;
473+
mockColumn.internalColumnEditor.collection = [{ value: 'm', label: 'Male' }, { value: 'f', label: 'Female' }];
474+
mockColumn.internalColumnEditor.editorOptions = { minLength: 3 } as AutocompleteOption;
475+
mockItemData = { id: 123, gender: { value: 'f', label: 'Female' }, isActive: true };
476+
477+
const event = new CustomEvent('change');
478+
editor = new AutoCompleteEditor(editorArguments);
479+
const onSelectSpy = jest.spyOn(editor, 'onSelect');
480+
const focusSpy = jest.spyOn(editor, 'focus');
481+
editor.autoCompleteOptions.select(event, { item: 'fem' });
482+
483+
expect(onSelectSpy).toHaveBeenCalledWith(event, { item: 'fem' });
484+
setTimeout(() => {
485+
expect(focusSpy).toHaveBeenCalled();
486+
done();
487+
}, 51);
488+
});
457489
});
458490
});
459491
});

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

+1
Original file line numberDiff line numberDiff line change
@@ -175,6 +175,7 @@ describe('DateEditor', () => {
175175
const spy = jest.spyOn(editor.flatInstance, 'open');
176176
const calendarElm = document.body.querySelector<HTMLDivElement>('.flatpickr-calendar');
177177
editor.show();
178+
editor.focus();
178179

179180
expect(calendarElm).toBeTruthy();
180181
expect(spy).toHaveBeenCalled();

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

+4
Original file line numberDiff line numberDiff line change
@@ -352,8 +352,10 @@ describe('SelectEditor', () => {
352352
editor = new SelectEditor(editorArguments, true);
353353
editor.loadValue(mockItemData);
354354
const output = editor.serializeValue();
355+
const currentValue = editor.currentValue;
355356

356357
expect(output).toEqual([]);
358+
expect(currentValue).toEqual('');
357359
});
358360

359361
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', () => {
374376
editor = new SelectEditor(editorArguments, true);
375377
editor.loadValue(mockItemData);
376378
const output = editor.serializeValue();
379+
const currentValue = editor.currentValue;
377380

378381
expect(output).toEqual([{ label: 'male', value: 'male' }, { label: 'other', value: 'other' }]);
382+
expect(currentValue).toEqual({});
379383
});
380384

381385
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

+1-1
Original file line numberDiff line numberDiff line change
@@ -241,7 +241,7 @@ describe('SelectEditor', () => {
241241
const editorListElm = divContainer.querySelectorAll<HTMLInputElement>(`[name=editor-gender].ms-drop ul>li span`);
242242
editorBtnElm.click();
243243

244-
expect(editor.getValue()).toEqual(undefined);
244+
expect(editor.getValue()).toEqual('');
245245
expect(editorListElm.length).toBe(2);
246246
expect(editorListElm[0].innerHTML).toBe('<i class="fa fa-check"></i> True');
247247
});

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

+11-2
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ const MIN_LENGTH = 3;
2424
* KeyDown events are also handled to provide handling for Tab, Shift-Tab, Esc and Ctrl-Enter.
2525
*/
2626
export class AutoCompleteEditor implements Editor {
27+
private _autoCompleteOptions: AutocompleteOption;
2728
private _currentValue: any;
2829
private _defaultTextValue: string;
2930
private _elementCollection: any[];
@@ -51,6 +52,11 @@ export class AutoCompleteEditor implements Editor {
5152
this.init();
5253
}
5354

55+
/** Getter for the Autocomplete Option */
56+
get autoCompleteOptions(): Partial<AutocompleteOption> {
57+
return this._autoCompleteOptions || {};
58+
}
59+
5460
/** Get the Collection */
5561
get editorCollection(): any[] {
5662
return this.columnDef && this.columnDef.internalColumnEditor && this.columnDef.internalColumnEditor.collection || [];
@@ -289,13 +295,16 @@ export class AutoCompleteEditor implements Editor {
289295
// we still need to provide our own "select" callback implementation
290296
if (autoCompleteOptions) {
291297
autoCompleteOptions.select = (event: Event, ui: any) => this.onSelect(event, ui);
298+
this._autoCompleteOptions = { ...autoCompleteOptions };
292299
this._$editorElm.autocomplete(autoCompleteOptions);
293300
} else {
294-
this._$editorElm.autocomplete({
301+
const definedOptions: AutocompleteOption = {
295302
source: finalCollection,
296303
minLength: 0,
297304
select: (event: Event, ui: any) => this.onSelect(event, ui),
298-
});
305+
};
306+
this._autoCompleteOptions = { ...definedOptions, ...(this.columnEditor.editorOptions as AutocompleteOption) };
307+
this._$editorElm.autocomplete(this._autoCompleteOptions);
299308
}
300309

301310
setTimeout(() => this.focus(), 50);

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

+1-2
Original file line numberDiff line numberDiff line change
@@ -139,10 +139,9 @@ export class DateEditor implements Editor {
139139
}
140140

141141
focus() {
142+
this._$input.focus();
142143
if (this._$inputWithData && typeof this._$inputWithData.focus === 'function') {
143144
this._$inputWithData.focus().select();
144-
} else if (this._$input && typeof this._$input.focus === 'function') {
145-
this._$input.focus().select();
146145
}
147146
}
148147

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

+23
Original file line numberDiff line numberDiff line change
@@ -473,5 +473,28 @@ describe('AutoCompleteFilter', () => {
473473
expect(spySetValue).toHaveBeenCalledWith('Female');
474474
expect(spyCallback).toHaveBeenCalledWith(null, { columnDef: mockColumn, operator: 'EQ', searchTerms: ['f'], shouldTriggerQuery: true });
475475
});
476+
477+
it('should expect the "onSelect" method to be called when the callback method is triggered', () => {
478+
const spy = jest.spyOn(filter, 'onSelect');
479+
const event = new CustomEvent('change');
480+
481+
mockColumn.filter.collection = [{ value: 'male', label: 'male' }, { value: 'female', label: 'female' }];
482+
filter.init(filterArguments);
483+
filter.autoCompleteOptions.select(event, { item: 'fem' });
484+
485+
expect(spy).toHaveBeenCalledWith(event, { item: 'fem' });
486+
});
487+
488+
it('should initialize the filter with filterOptions and expect the "onSelect" method to be called when the callback method is triggered', () => {
489+
const spy = jest.spyOn(filter, 'onSelect');
490+
const event = new CustomEvent('change');
491+
492+
mockColumn.filter.collection = [{ value: 'male', label: 'male' }, { value: 'female', label: 'female' }];
493+
mockColumn.filter.filterOptions = { minLength: 3 } as AutocompleteOption;
494+
filter.init(filterArguments);
495+
filter.autoCompleteOptions.select(event, { item: 'fem' });
496+
497+
expect(spy).toHaveBeenCalledWith(event, { item: 'fem' });
498+
});
476499
});
477500
});

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

+19
Original file line numberDiff line numberDiff line change
@@ -228,4 +228,23 @@ describe('SliderRangeFilter', () => {
228228
expect(filter.currentValues).toEqual([4, 69]);
229229
expect(spyCallback).toHaveBeenLastCalledWith(null, { columnDef: mockColumn, clearFilterTriggered: true, shouldTriggerQuery: false });
230230
});
231+
232+
it('should expect the slider values to be rendered when the callback method is triggered', () => {
233+
const spy = jest.spyOn(filter, 'renderSliderValues');
234+
235+
mockColumn.filter = { minValue: 4, maxValue: 69, valueStep: 5 };
236+
filter.init(filterArguments);
237+
filter.sliderOptions.slide(new CustomEvent('change'), { handle: document.createElement('div'), handleIndex: 1, value: 2, values: [2, 3] });
238+
239+
expect(spy).toHaveBeenCalledWith(2, 3);
240+
expect(filter.sliderOptions).toEqual({
241+
change: expect.anything(),
242+
max: 69,
243+
min: 4,
244+
range: true,
245+
slide: expect.anything(),
246+
step: 5,
247+
values: [4, 69],
248+
});
249+
});
231250
});

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

+11-2
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ declare var $: any;
2323

2424
@Injectable()
2525
export class AutoCompleteFilter implements Filter {
26+
private _autoCompleteOptions: AutocompleteOption;
2627
private _clearFilterTriggered = false;
2728
private _collection: any[];
2829
private _shouldTriggerQuery = true;
@@ -56,6 +57,11 @@ export class AutoCompleteFilter implements Filter {
5657
*/
5758
constructor(protected translate: TranslateService, protected collectionService: CollectionService) { }
5859

60+
/** Getter for the Autocomplete Option */
61+
get autoCompleteOptions(): Partial<AutocompleteOption> {
62+
return this._autoCompleteOptions || {};
63+
}
64+
5965
/** Getter for the Collection Options */
6066
protected get collectionOptions(): CollectionOption {
6167
return this.columnDef && this.columnDef.filter && this.columnDef.filter.collectionOptions || {};
@@ -337,13 +343,16 @@ export class AutoCompleteFilter implements Filter {
337343
// we still need to provide our own "select" callback implementation
338344
if (autoCompleteOptions) {
339345
autoCompleteOptions.select = (event: Event, ui: any) => this.onSelect(event, ui);
346+
this._autoCompleteOptions = { ...autoCompleteOptions };
340347
$filterElm.autocomplete(autoCompleteOptions);
341348
} else {
342-
$filterElm.autocomplete({
349+
const definedOptions: AutocompleteOption = {
343350
minLength: 0,
344351
source: collection,
345352
select: (event: Event, ui: any) => this.onSelect(event, ui),
346-
});
353+
};
354+
this._autoCompleteOptions = { ...definedOptions, ...(this.columnFilter.filterOptions as AutocompleteOption) };
355+
$filterElm.autocomplete(this._autoCompleteOptions);
347356
}
348357

349358
$filterElm.val(searchTermInput);

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

+17-17
Original file line numberDiff line numberDiff line change
@@ -124,6 +124,23 @@ export class SliderRangeFilter implements Filter {
124124
}
125125
}
126126

127+
/**
128+
* Render both slider values (low/high) on screen
129+
* @param lowestValue number
130+
* @param highestValue number
131+
*/
132+
renderSliderValues(lowestValue: number | string, highestValue: number | string) {
133+
const columndId = this.columnDef && this.columnDef.id;
134+
const lowerElm = document.querySelector(`.lowest-range-${columndId}`);
135+
const highestElm = document.querySelector(`.highest-range-${columndId}`);
136+
if (lowerElm && lowerElm.innerHTML) {
137+
lowerElm.innerHTML = lowestValue.toString();
138+
}
139+
if (highestElm && highestElm.innerHTML) {
140+
highestElm.innerHTML = highestValue.toString();
141+
}
142+
}
143+
127144
/**
128145
* Set value(s) on the DOM element
129146
* @params searchTerms
@@ -253,21 +270,4 @@ export class SliderRangeFilter implements Filter {
253270
this._clearFilterTriggered = false;
254271
this._shouldTriggerQuery = true;
255272
}
256-
257-
/**
258-
* Render both slider values (low/high) on screen
259-
* @param lowestValue number
260-
* @param highestValue number
261-
*/
262-
private renderSliderValues(lowestValue: number | string, highestValue: number | string) {
263-
const fieldId = this.columnDef && this.columnDef.id;
264-
const lowerElm = document.querySelector(`.lowest-range-${fieldId}`);
265-
const highestElm = document.querySelector(`.highest-range-${fieldId}`);
266-
if (lowerElm && lowerElm.innerHTML) {
267-
lowerElm.innerHTML = lowestValue.toString();
268-
}
269-
if (highestElm && highestElm.innerHTML) {
270-
highestElm.innerHTML = highestValue.toString();
271-
}
272-
}
273273
}

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export const decimalFormatter: Formatter = (row: number, cell: number, value: an
1818
minDecimal = (params.minDecimalPlaces !== null && params.minDecimalPlaces) || (params.decimalPlaces !== null && params.decimalPlaces);
1919
}
2020
if (params.maxDecimalPlaces !== null && params.maxDecimalPlaces) {
21-
console.warn('[Angular-Slickgrid] please consider using "maxDecimalPlaces" (instead of "maxDecimalPlacesPlaces").');
21+
console.warn('[Angular-Slickgrid] please consider using "maxDecimal" (instead of "maxDecimalPlaces").');
2222
maxDecimal = (params.maxDecimalPlaces !== null && params.maxDecimalPlaces);
2323
}
2424

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

+9-9
Original file line numberDiff line numberDiff line change
@@ -261,13 +261,13 @@ export class GridService {
261261

262262
/** @deprecated please use "addItem" method instead */
263263
addItemToDatagrid(item: any, shouldHighlightRow = true, shouldResortGrid = false, shouldTriggerEvent = true, shouldSelectRow = true): number {
264-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "addItem" method since "addItemToDatagrid" will be deprecated in the future');
264+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "addItem" method since "addItemToDatagrid" will be deprecated in the future');
265265
return this.addItem(item, { highlightRow: shouldHighlightRow, resortGrid: shouldResortGrid, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
266266
}
267267

268268
/** @deprecated please use "addItems" method instead */
269269
addItemsToDatagrid(items: any[], shouldHighlightRow = true, shouldResortGrid = false, shouldTriggerEvent = true, shouldSelectRow = true): number[] {
270-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "addItems" method since "addItemsToDatagrid" will be deprecated in the future');
270+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "addItems" method since "addItemsToDatagrid" will be deprecated in the future');
271271
return this.addItems(items, { highlightRow: shouldHighlightRow, resortGrid: shouldResortGrid, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
272272
}
273273

@@ -377,25 +377,25 @@ export class GridService {
377377

378378
/** @deprecated please use "deleteItem" method instead */
379379
deleteDataGridItem(item: any, shouldTriggerEvent = true) {
380-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "deleteItem" method since "deleteDataGridItem" will be deprecated in the future');
380+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "deleteItem" method since "deleteDataGridItem" will be deprecated in the future');
381381
this.deleteItem(item, { triggerEvent: shouldTriggerEvent });
382382
}
383383

384384
/** @deprecated please use "deleteItems" method instead */
385385
deleteDataGridItems(items: any[], shouldTriggerEvent = true) {
386-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "deleteItems" method since "deleteDataGridItems" will be deprecated in the future');
386+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "deleteItems" method since "deleteDataGridItems" will be deprecated in the future');
387387
this.deleteItems(items, { triggerEvent: shouldTriggerEvent });
388388
}
389389

390390
/** @deprecated please use "deleteItemById" method instead */
391391
deleteDataGridItemById(itemId: string | number, shouldTriggerEvent = true) {
392-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "deleteItemById" method since "deleteDataGridItemById" will be deprecated in the future');
392+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "deleteItemById" method since "deleteDataGridItemById" will be deprecated in the future');
393393
this.deleteItemById(itemId, { triggerEvent: shouldTriggerEvent });
394394
}
395395

396396
/** @deprecated please use "deleteItemByIds" method instead */
397397
deleteDataGridItemByIds(itemIds: number[] | string[], shouldTriggerEvent = true) {
398-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "deleteItemByIds" method since "deleteDataGridItemByIds" will be deprecated in the future');
398+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "deleteItemByIds" method since "deleteDataGridItemByIds" will be deprecated in the future');
399399
this.deleteItemByIds(itemIds, { triggerEvent: shouldTriggerEvent });
400400
}
401401

@@ -498,19 +498,19 @@ export class GridService {
498498

499499
/** @deprecated please use "updateItem" method instead */
500500
updateDataGridItem(item: any, shouldHighlightRow = true, shouldTriggerEvent = true, shouldSelectRow = true): number {
501-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "updateItem" method since "updateDataGridItem" will be deprecated in the future');
501+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "updateItem" method since "updateDataGridItem" will be deprecated in the future');
502502
return this.updateItem(item, { highlightRow: shouldHighlightRow, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
503503
}
504504

505505
/** @deprecated please use "updateItems" method instead */
506506
updateDataGridItems(items: any | any[], shouldHighlightRow = true, shouldTriggerEvent = true, shouldSelectRow = true): number[] {
507-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "updateItems" method since "updateDataGridItems" will be deprecated in the future');
507+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "updateItems" method since "updateDataGridItems" will be deprecated in the future');
508508
return this.updateItems(items, { highlightRow: shouldHighlightRow, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
509509
}
510510

511511
/** @deprecated please use "updateItemById" method instead */
512512
updateDataGridItemById(itemId: number | string, item: any, shouldHighlightRow = true, shouldTriggerEvent = true, shouldSelectRow = true): number {
513-
console.warn('[Angular-Slickgrid - FilterService] please consider using the new "updateItemById" method since "updateDataGridItemById" will be deprecated in the future');
513+
console.warn('[Angular-Slickgrid - GridService] please consider using the new "updateItemById" method since "updateDataGridItemById" will be deprecated in the future');
514514
return this.updateItemById(itemId, item, { highlightRow: shouldHighlightRow, triggerEvent: shouldTriggerEvent, selectRow: shouldSelectRow });
515515
}
516516

0 commit comments

Comments
 (0)