From b4ffd6e2ea8a550d7d1bafe9ee9ce83ca1076e7e Mon Sep 17 00:00:00 2001 From: Ghislain B Date: Wed, 30 Nov 2022 00:45:40 -0500 Subject: [PATCH] chore: fix some TS Types in a few unit tests (#827) --- .../slickCellExternalCopyManager.spec.ts | 2 +- .../__tests__/slickCellMenu.plugin.spec.ts | 112 ++--- .../__tests__/slickCellRangeDecorator.spec.ts | 16 +- .../__tests__/slickCellSelectionModel.spec.ts | 8 +- .../__tests__/slickColumnPicker.spec.ts | 80 ++-- .../__tests__/slickContextMenu.spec.ts | 134 +++--- .../__tests__/slickGridMenu.spec.ts | 424 +++++++++--------- .../slickGroupItemMetadataProvider.spec.ts | 16 +- .../__tests__/slickHeaderButtons.spec.ts | 42 +- .../__tests__/slickRowSelectionModel.spec.ts | 14 +- .../src/extensions/slickCellSelectionModel.ts | 2 +- .../src/extensions/slickRowSelectionModel.ts | 4 +- 12 files changed, 427 insertions(+), 427 deletions(-) diff --git a/packages/common/src/extensions/__tests__/slickCellExternalCopyManager.spec.ts b/packages/common/src/extensions/__tests__/slickCellExternalCopyManager.spec.ts index 285461b30..69c9ce27b 100644 --- a/packages/common/src/extensions/__tests__/slickCellExternalCopyManager.spec.ts +++ b/packages/common/src/extensions/__tests__/slickCellExternalCopyManager.spec.ts @@ -118,7 +118,7 @@ describe('CellExternalCopyManager', () => { plugin.init(gridStub); const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; - mockCellSelectionModel.onSelectedRangesChanged.notify({ fromCell: 0, fromRow: 0, toCell: 0, toRow: 0 }, eventData, gridStub); + mockCellSelectionModel.onSelectedRangesChanged.notify([{ fromCell: 0, fromRow: 0, toCell: 0, toRow: 0 }], eventData, gridStub); expect(gridFocusSpy).toHaveBeenCalled(); }); diff --git a/packages/common/src/extensions/__tests__/slickCellMenu.plugin.spec.ts b/packages/common/src/extensions/__tests__/slickCellMenu.plugin.spec.ts index b33453005..3001798e4 100644 --- a/packages/common/src/extensions/__tests__/slickCellMenu.plugin.spec.ts +++ b/packages/common/src/extensions/__tests__/slickCellMenu.plugin.spec.ts @@ -183,10 +183,10 @@ describe('CellMenu Plugin', () => { eventData.target = slickCellElm; jest.spyOn(SharedService.prototype, 'slickGrid', 'get').mockReturnValue(gridStub); - columnsMock[3].cellMenu.commandItems = deepCopy(commandItemsMock); - delete (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).action; - delete (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride; - delete (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride; + columnsMock[3].cellMenu!.commandItems = deepCopy(commandItemsMock); + delete (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).action; + delete (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride; + delete (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride; cellMenuDiv = document.createElement('div'); cellMenuDiv.className = 'slick-header-column'; gridContainerDiv = document.createElement('div'); @@ -209,7 +209,7 @@ describe('CellMenu Plugin', () => { plugin.dispose(); plugin.init(); - gridStub.onClick.notify(null, eventData, gridStub); + gridStub.onClick.notify(null as any, eventData, gridStub); let cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; expect(cellMenuElm).toBeTruthy(); @@ -247,7 +247,7 @@ describe('CellMenu Plugin', () => { it('should not populate and automatically return when the Cell Menu item "commandItems" array of the cell menu is undefined', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems) = undefined as any; + (columnsMock[3].cellMenu!.commandItems) = undefined as any; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -258,8 +258,8 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu to be create and show up when item visibility & usability callbacks returns true', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => true; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => true; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => true; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => true; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -295,8 +295,8 @@ describe('CellMenu Plugin', () => { it('should expect a Cell Menu to be created when cell is clicked with a list of commands defined but without "Command 1" when "itemVisibilityOverride" and "itemUsabilityOverride" return undefined', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => undefined; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => undefined; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => undefined as any; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => undefined as any; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -325,8 +325,8 @@ describe('CellMenu Plugin', () => { it('should expect a Cell Menu to be created when cell is clicked with a list of commands defined but without "Command 1" when "itemVisibilityOverride" and "itemUsabilityOverride" return false', () => { plugin.dispose(); plugin.init({ maxHeight: 290, width: 400 }); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => false; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => false; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => false; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => false; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -349,8 +349,8 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu and a 2nd button item usability callback returns false and expect button to be disabled', () => { plugin.dispose(); plugin.init({ maxWidth: 310, width: 'auto' }); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => true; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => false; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => true; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => false; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -373,7 +373,7 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu and a 2nd item is "disabled" and expect button to be disabled', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).disabled = true; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).disabled = true; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -389,7 +389,7 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu and expect button to be disabled when command property is hidden', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).hidden = true; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).hidden = true; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -405,7 +405,7 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu item with "iconCssClass" and expect extra css classes added to the icon element', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).iconCssClass = 'bold red'; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).iconCssClass = 'bold red'; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -423,8 +423,8 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu item with "textCssClass" and expect extra css classes added to the item text DOM element', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).title = 'Help'; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).textCssClass = 'italic blue'; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).title = 'Help'; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).textCssClass = 'italic blue'; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -441,7 +441,7 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu item with "tooltip" and expect a title attribute to be added the item text DOM element', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).tooltip = 'some tooltip'; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).tooltip = 'some tooltip'; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -457,8 +457,8 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu item with a title for the command list when "commandTitle" is provided', () => { plugin.dispose(); plugin.init({ commandTitle: 'The Commands!' }); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).title = 'Help'; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).textCssClass = 'italic blue'; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).title = 'Help'; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).textCssClass = 'italic blue'; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -472,9 +472,9 @@ describe('CellMenu Plugin', () => { it('should expect all menu related to Sorting when "enableSorting" is set', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu as CellMenu).commandTitleKey = 'COMMANDS'; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).command = 'help'; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).titleKey = 'HELP'; + (columnsMock[3].cellMenu! as CellMenu).commandTitleKey = 'COMMANDS'; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).command = 'help'; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).titleKey = 'HELP'; translateService.use('fr'); plugin.translateCellMenu(); @@ -575,12 +575,12 @@ describe('CellMenu Plugin', () => { plugin.dispose(); plugin.init(); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).action = actionMock; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).action = actionMock; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; const commandListElm = cellMenuElm.querySelector('.slick-menu-command-list') as HTMLDivElement; - commandListElm.querySelector('[data-command="command2"]').dispatchEvent(new Event('click')); + commandListElm.querySelector('[data-command="command2"]')!.dispatchEvent(new Event('click')); expect(commandListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(actionMock).toHaveBeenCalled(); @@ -596,7 +596,7 @@ describe('CellMenu Plugin', () => { const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; const commandListElm = cellMenuElm.querySelector('.slick-menu-command-list') as HTMLDivElement; - commandListElm.querySelector('[data-command="command2"]').dispatchEvent(new Event('click')); + commandListElm.querySelector('[data-command="command2"]')!.dispatchEvent(new Event('click')); expect(commandListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(onCommandMock).toHaveBeenCalled(); @@ -605,8 +605,8 @@ describe('CellMenu Plugin', () => { it('should not populate a Cell Menu when "menuUsabilityOverride" is defined and returns False', () => { plugin.dispose(); plugin.init({ menuUsabilityOverride: () => false }); - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => true; - (columnsMock[3].cellMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => true; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => true; + (columnsMock[3].cellMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => true; gridStub.onClick.notify({ cell: 3, row: 1, grid: gridStub }, eventData, gridStub); expect(plugin.menuElement).toBeFalsy(); @@ -615,16 +615,16 @@ describe('CellMenu Plugin', () => { describe('with Options Items', () => { beforeEach(() => { - columnsMock[4].cellMenu.optionItems = deepCopy(optionItemsMock); - delete (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride; - delete (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride; + columnsMock[4].cellMenu!.optionItems = deepCopy(optionItemsMock); + delete (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride; + delete (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride; jest.spyOn(gridStub, 'getCellFromEvent').mockReturnValue({ cell: 4, row: 1 }); }); it('should not populate and automatically return when the Cell Menu item "optionItems" array of the cell menu is undefined', () => { plugin.dispose(); plugin.init({ onAfterMenuShow: undefined }); - (columnsMock[4].cellMenu.optionItems) = undefined; + (columnsMock[4].cellMenu!.optionItems) = undefined; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -635,8 +635,8 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu to be create and show up when item visibility & usability callbacks returns true', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => true; - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => true; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => true; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => true; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -670,8 +670,8 @@ describe('CellMenu Plugin', () => { it('should expect a Cell Menu to be created when cell is clicked with a list of commands defined but without "Option 1" when "itemVisibilityOverride" and "itemUsabilityOverride" return undefined', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => undefined; - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => undefined; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => undefined as any; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => undefined as any; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -700,8 +700,8 @@ describe('CellMenu Plugin', () => { it('should expect a Cell Menu to be created when cell is clicked with a list of options defined but without "Option 1" when "itemVisibilityOverride" and "itemUsabilityOverride" return false', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => false; - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => false; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => false; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => false; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -722,8 +722,8 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu and a 2nd button item usability callback returns false and expect button to be disabled', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => true; - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => false; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => true; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => false; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -744,7 +744,7 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu and a 2nd item is "disabled" and expect button to be disabled', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).disabled = true; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).disabled = true; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -760,7 +760,7 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu and expect button to be disabled when option property is hidden', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).hidden = true; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).hidden = true; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -776,7 +776,7 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu item with "iconCssClass" and expect extra css classes added to the icon element', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).iconCssClass = 'underline sky'; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).iconCssClass = 'underline sky'; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -794,8 +794,8 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu item with "textCssClass" and expect extra css classes added to the item text DOM element', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).title = 'Help'; - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).textCssClass = 'italic blue'; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).title = 'Help'; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).textCssClass = 'italic blue'; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -812,7 +812,7 @@ describe('CellMenu Plugin', () => { it('should create a Cell Menu item with "tooltip" and expect a title attribute to be added the item text DOM element', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).tooltip = 'some tooltip'; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).tooltip = 'some tooltip'; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -829,8 +829,8 @@ describe('CellMenu Plugin', () => { plugin.dispose(); plugin.init(); plugin.setOptions({ optionTitle: 'The Options!' }); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).title = 'Help'; - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).textCssClass = 'italic blue'; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).title = 'Help'; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).textCssClass = 'italic blue'; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; @@ -845,8 +845,8 @@ describe('CellMenu Plugin', () => { plugin.dispose(); plugin.init(); (columnsMock[4].cellMenu as CellMenu).optionTitleKey = 'OPTIONS_LIST'; - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).option = 'none'; - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).titleKey = 'NONE'; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).option = 'none'; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).titleKey = 'NONE'; translateService.use('fr'); plugin.translateCellMenu(); @@ -886,12 +886,12 @@ describe('CellMenu Plugin', () => { plugin.dispose(); plugin.init(); - (columnsMock[4].cellMenu.optionItems[1] as MenuOptionItem).action = actionMock; + (columnsMock[4].cellMenu!.optionItems![1] as MenuOptionItem).action = actionMock; gridStub.onClick.notify({ cell: 4, row: 1, grid: gridStub }, eventData, gridStub); const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; const optionListElm = cellMenuElm.querySelector('.slick-menu-option-list') as HTMLDivElement; - optionListElm.querySelector('[data-option="option2"]').dispatchEvent(new Event('click')); + optionListElm.querySelector('[data-option="option2"]')!.dispatchEvent(new Event('click')); expect(optionListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(actionMock).toHaveBeenCalled(); @@ -908,7 +908,7 @@ describe('CellMenu Plugin', () => { const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; const optionListElm = cellMenuElm.querySelector('.slick-menu-option-list') as HTMLDivElement; - optionListElm.querySelector('[data-option="option2"]').dispatchEvent(new Event('click')); + optionListElm.querySelector('[data-option="option2"]')!.dispatchEvent(new Event('click')); expect(optionListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(onOptionSelectedMock).toHaveBeenCalled(); @@ -925,7 +925,7 @@ describe('CellMenu Plugin', () => { const cellMenuElm = document.body.querySelector('.slick-cell-menu.slickgrid12345') as HTMLDivElement; const optionListElm = cellMenuElm.querySelector('.slick-menu-option-list') as HTMLDivElement; - optionListElm.querySelector('[data-option="option2"]').dispatchEvent(new Event('click')); + optionListElm.querySelector('[data-option="option2"]')!.dispatchEvent(new Event('click')); expect(optionListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(onOptionSelectedMock).not.toHaveBeenCalled(); diff --git a/packages/common/src/extensions/__tests__/slickCellRangeDecorator.spec.ts b/packages/common/src/extensions/__tests__/slickCellRangeDecorator.spec.ts index 71842361a..672a2ac57 100644 --- a/packages/common/src/extensions/__tests__/slickCellRangeDecorator.spec.ts +++ b/packages/common/src/extensions/__tests__/slickCellRangeDecorator.spec.ts @@ -61,10 +61,10 @@ describe('CellRangeDecorator Plugin', () => { plugin = new SlickCellRangeDecorator(gridStub, { offset: { top: 20, left: 5, width: 12, height: 33 } }); plugin.show({ fromCell: 1, fromRow: 2, toCell: 3, toRow: 4 }); - expect(plugin.addonElement.style.top).toEqual(''); - expect(plugin.addonElement.style.left).toEqual(''); - expect(plugin.addonElement.style.height).toEqual(''); - expect(plugin.addonElement.style.width).toEqual(''); + expect(plugin.addonElement!.style.top).toEqual(''); + expect(plugin.addonElement!.style.left).toEqual(''); + expect(plugin.addonElement!.style.height).toEqual(''); + expect(plugin.addonElement!.style.width).toEqual(''); }); it('should Show range when called and calculate new position when getCellNodeBox returns a cell position', () => { @@ -75,9 +75,9 @@ describe('CellRangeDecorator Plugin', () => { plugin = new SlickCellRangeDecorator(gridStub, { offset: { top: 20, left: 5, width: 12, height: 33 } }); plugin.show({ fromCell: 1, fromRow: 2, toCell: 3, toRow: 4 }); - expect(plugin.addonElement.style.top).toEqual('45px'); // 25 + 20px - expect(plugin.addonElement.style.left).toEqual('31px'); // 26 + 5px - expect(plugin.addonElement.style.height).toEqual('20px'); // 12 - 25 + 33px - expect(plugin.addonElement.style.width).toEqual('13px'); // 27 - 26 + 12px + expect(plugin.addonElement!.style.top).toEqual('45px'); // 25 + 20px + expect(plugin.addonElement!.style.left).toEqual('31px'); // 26 + 5px + expect(plugin.addonElement!.style.height).toEqual('20px'); // 12 - 25 + 33px + expect(plugin.addonElement!.style.width).toEqual('13px'); // 27 - 26 + 12px }); }); \ No newline at end of file diff --git a/packages/common/src/extensions/__tests__/slickCellSelectionModel.spec.ts b/packages/common/src/extensions/__tests__/slickCellSelectionModel.spec.ts index f5cc97a2a..534bb0d44 100644 --- a/packages/common/src/extensions/__tests__/slickCellSelectionModel.spec.ts +++ b/packages/common/src/extensions/__tests__/slickCellSelectionModel.spec.ts @@ -117,7 +117,7 @@ describe('CellSelectionModel Plugin', () => { it('should create the plugin and initialize it with just "selectActiveCell" option and still expect the same result', () => { const registerSpy = jest.spyOn(gridStub, 'registerPlugin'); - plugin = new SlickCellSelectionModel({ selectActiveCell: false, cellRangeSelector: undefined }); + plugin = new SlickCellSelectionModel({ selectActiveCell: false, cellRangeSelector: undefined as any }); plugin.init(gridStub); expect(plugin.cellRangeSelector).toBeTruthy(); @@ -142,7 +142,7 @@ describe('CellSelectionModel Plugin', () => { it('should expect that "setSelectedRanges" is being triggered when "refreshSelections" is called', () => { const registerSpy = jest.spyOn(gridStub, 'registerPlugin'); - plugin = new SlickCellSelectionModel({ selectActiveCell: false, cellRangeSelector: undefined }); + plugin = new SlickCellSelectionModel({ selectActiveCell: false, cellRangeSelector: undefined as any }); plugin.init(gridStub); jest.spyOn(plugin, 'getSelectedRanges').mockReturnValue([ @@ -187,7 +187,7 @@ describe('CellSelectionModel Plugin', () => { }); it('should call "setSelectedRanges" with Slick Ranges when triggered by "onActiveCellChanged" and "selectActiveCell" is True', () => { - plugin = new SlickCellSelectionModel({ selectActiveCell: true, cellRangeSelector: undefined }); + plugin = new SlickCellSelectionModel({ selectActiveCell: true, cellRangeSelector: undefined as any }); plugin.init(gridStub); const setSelectRangeSpy = jest.spyOn(plugin, 'setSelectedRanges'); const mouseEvent = addJQueryEventPropagation(new Event('mouseenter')); @@ -200,7 +200,7 @@ describe('CellSelectionModel Plugin', () => { }); it('should call "setSelectedRanges" with empty array when triggered by "onActiveCellChanged" and "selectActiveCell" is False', () => { - plugin = new SlickCellSelectionModel({ selectActiveCell: false, cellRangeSelector: undefined }); + plugin = new SlickCellSelectionModel({ selectActiveCell: false, cellRangeSelector: undefined as any }); plugin.init(gridStub); const setSelectRangeSpy = jest.spyOn(plugin, 'setSelectedRanges'); const mouseEvent = addJQueryEventPropagation(new Event('mouseenter')); diff --git a/packages/common/src/extensions/__tests__/slickColumnPicker.spec.ts b/packages/common/src/extensions/__tests__/slickColumnPicker.spec.ts index 5356e32c9..8713a0914 100644 --- a/packages/common/src/extensions/__tests__/slickColumnPicker.spec.ts +++ b/packages/common/src/extensions/__tests__/slickColumnPicker.spec.ts @@ -82,8 +82,8 @@ describe('ColumnPickerControl', () => { describe('registered control', () => { afterEach(() => { - gridOptionsMock.columnPicker.headerColumnValueExtractor = null; - gridOptionsMock.columnPicker.onColumnsChanged = null; + gridOptionsMock.columnPicker!.headerColumnValueExtractor = null as any; + gridOptionsMock.columnPicker!.onColumnsChanged = null as any; }); it('should expect the Control to be created', () => { @@ -93,7 +93,7 @@ describe('ColumnPickerControl', () => { it('should query an input checkbox change event and expect "setSelectedRows" method to be called using Row Selection when enabled', () => { const mockRowSelection = [0, 3, 5]; jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); jest.spyOn(gridStub, 'getSelectedRows').mockReturnValue(mockRowSelection); const setSelectionSpy = jest.spyOn(gridStub, 'setSelectedRows'); @@ -102,7 +102,7 @@ describe('ColumnPickerControl', () => { const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - const inputElm = control.menuElement.querySelector('input[type="checkbox"]'); + const inputElm = control.menuElement.querySelector('input[type="checkbox"]') as HTMLInputElement; inputElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); expect(control.menuElement.style.display).toBe('block'); @@ -114,7 +114,7 @@ describe('ColumnPickerControl', () => { it('should open the column picker via "onHeaderContextMenu" and then expect it to hide when clicking anywhere in the DOM body', () => { const mockRowSelection = [0, 3, 5]; jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); jest.spyOn(gridStub, 'getSelectedRows').mockReturnValue(mockRowSelection); gridOptionsMock.enableRowSelection = true; @@ -133,7 +133,7 @@ describe('ColumnPickerControl', () => { it('should query an input checkbox change event and expect "readjustFrozenColumnIndexWhenNeeded" method to be called when the grid is detected to be a frozen grid', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); const readjustSpy = jest.spyOn(extensionUtility, 'readjustFrozenColumnIndexWhenNeeded'); gridOptionsMock.frozenColumn = 0; @@ -141,7 +141,7 @@ describe('ColumnPickerControl', () => { control.init(); gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); + control.menuElement.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); expect(handlerSpy).toHaveBeenCalledTimes(2); expect(readjustSpy).toHaveBeenCalledWith(0, columnsMock, columnsMock); @@ -151,15 +151,15 @@ describe('ColumnPickerControl', () => { it('should query an input checkbox change event and expect "headerColumnValueExtractor" method to be called when defined', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); const readjustSpy = jest.spyOn(extensionUtility, 'readjustFrozenColumnIndexWhenNeeded'); - gridOptionsMock.columnPicker.headerColumnValueExtractor = (column: Column) => `${column?.columnGroup || ''} - ${column.name}`; + gridOptionsMock.columnPicker!.headerColumnValueExtractor = (column: Column) => `${column?.columnGroup || ''} - ${column.name}`; control.columns = columnsMock; control.init(); gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); + control.menuElement.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); const liElmList = control.menuElement.querySelectorAll('li'); expect(handlerSpy).toHaveBeenCalledTimes(2); @@ -171,17 +171,17 @@ describe('ColumnPickerControl', () => { it('should open the column picker via "onHeaderContextMenu" and expect "Forcefit" to be checked when "hideForceFitButton" is false', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); - gridOptionsMock.columnPicker.hideForceFitButton = false; + gridOptionsMock.columnPicker!.hideForceFitButton = false; gridOptionsMock.forceFitColumns = true; control.columns = columnsMock; control.init(); gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); - const inputForcefitElm = control.menuElement.querySelector('#slickgrid_124343-colpicker-forcefit'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-forcefit]'); + control.menuElement.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); + const inputForcefitElm = control.menuElement.querySelector('#slickgrid_124343-colpicker-forcefit') as HTMLInputElement; + const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-forcefit]') as HTMLDivElement; expect(handlerSpy).toHaveBeenCalledTimes(2); expect(control.getAllColumns()).toEqual(columnsMock); @@ -193,17 +193,17 @@ describe('ColumnPickerControl', () => { it('should open the column picker via "onHeaderContextMenu" and expect "Sync Resize" to be checked when "hideSyncResizeButton" is false', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); - gridOptionsMock.columnPicker.hideSyncResizeButton = false; + gridOptionsMock.columnPicker!.hideSyncResizeButton = false; gridOptionsMock.syncColumnCellResize = true; control.columns = columnsMock; control.init(); gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-colpicker-syncresize'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-syncresize]'); + control.menuElement.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); + const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-colpicker-syncresize') as HTMLInputElement; + const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-syncresize]') as HTMLDivElement; expect(handlerSpy).toHaveBeenCalledTimes(2); expect(control.getAllColumns()).toEqual(columnsMock); @@ -217,14 +217,14 @@ describe('ColumnPickerControl', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); const pubSubSpy = jest.spyOn(pubSubServiceStub, 'publish'); const onColChangedMock = jest.fn(); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); - gridOptionsMock.columnPicker.onColumnsChanged = onColChangedMock; + gridOptionsMock.columnPicker!.onColumnsChanged = onColChangedMock; control.columns = columnsMock; control.init(); gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); + control.menuElement.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); const expectedCallbackArgs = { columnId: 'field1', @@ -243,19 +243,19 @@ describe('ColumnPickerControl', () => { it('should open the column picker via "onHeaderContextMenu", click on "Force Fit Columns" checkbox and expect "setOptions" and "setColumns" to be called with previous visible columns', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); jest.spyOn(control, 'getVisibleColumns').mockReturnValue(columnsMock.slice(1)); const setOptionSpy = jest.spyOn(gridStub, 'setOptions'); const setColumnSpy = jest.spyOn(gridStub, 'setColumns'); - gridOptionsMock.columnPicker.hideForceFitButton = false; - gridOptionsMock.columnPicker.forceFitTitle = 'Custom Force Fit'; + gridOptionsMock.columnPicker!.hideForceFitButton = false; + gridOptionsMock.columnPicker!.forceFitTitle = 'Custom Force Fit'; control.columns = columnsMock; control.init(); gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - const inputForcefitElm = control.menuElement.querySelector('#slickgrid_124343-colpicker-forcefit'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-forcefit]'); + const inputForcefitElm = control.menuElement.querySelector('#slickgrid_124343-colpicker-forcefit') as HTMLInputElement; + const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-forcefit]') as HTMLDivElement; inputForcefitElm.dispatchEvent(new Event('click', { bubbles: true })); expect(handlerSpy).toHaveBeenCalledTimes(2); @@ -269,19 +269,19 @@ describe('ColumnPickerControl', () => { it('should open the column picker via "onHeaderContextMenu", click on "syncresize" checkbox and expect "setOptions" to be called with "syncColumnCellResize" property', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); jest.spyOn(control, 'getVisibleColumns').mockReturnValue(columnsMock.slice(1)); const setOptionSpy = jest.spyOn(gridStub, 'setOptions'); - gridOptionsMock.columnPicker.hideSyncResizeButton = false; - gridOptionsMock.columnPicker.syncResizeTitle = 'Custom Resize Title'; + gridOptionsMock.columnPicker!.hideSyncResizeButton = false; + gridOptionsMock.columnPicker!.syncResizeTitle = 'Custom Resize Title'; gridOptionsMock.syncColumnCellResize = true; control.columns = columnsMock; control.init(); gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-colpicker-syncresize'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-syncresize]'); + const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-colpicker-syncresize') as HTMLInputElement; + const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-syncresize]') as HTMLDivElement; inputSyncElm.dispatchEvent(new Event('click', { bubbles: true })); expect(handlerSpy).toHaveBeenCalledTimes(2); @@ -306,7 +306,7 @@ describe('ColumnPickerControl', () => { { id: 'field3', field: 'field3', name: 'Field 3', width: 75, columnGroup: 'Billing' }, { id: 'field4', field: 'field4', name: 'Field 4', width: 75, excludeFromColumnPicker: true, } ]; - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValueOnce(0).mockReturnValueOnce(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValueOnce(0).mockReturnValueOnce(1); const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); control.columns = columnsUnorderedMock; @@ -314,7 +314,7 @@ describe('ColumnPickerControl', () => { gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); gridStub.onColumnsReordered.notify({ impactedColumns: columnsUnorderedMock, grid: gridStub }, eventData, gridStub); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); + control.menuElement.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); const col4 = control.menuElement.querySelector('li.hidden input[data-columnid=field4]'); expect(handlerSpy).toHaveBeenCalledTimes(2); @@ -331,9 +331,9 @@ describe('ColumnPickerControl', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); const utilitySpy = jest.spyOn(extensionUtility, 'getPickerTitleOutputString'); const translateSpy = jest.spyOn(extensionUtility, 'translateItems'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); - gridOptionsMock.columnPicker.hideForceFitButton = false; + gridOptionsMock.columnPicker!.hideForceFitButton = false; gridOptionsMock.syncColumnCellResize = true; gridOptionsMock.forceFitColumns = true; control.columns = columnsMock; @@ -341,9 +341,9 @@ describe('ColumnPickerControl', () => { control.translateColumnPicker(); gridStub.onHeaderContextMenu.notify({ column: columnsMock[1], grid: gridStub }, eventData, gridStub); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); - const labelForcefitElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-forcefit]'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-syncresize]'); + control.menuElement.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); + const labelForcefitElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-forcefit]') as HTMLDivElement; + const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-colpicker-syncresize]') as HTMLDivElement; expect(handlerSpy).toHaveBeenCalledTimes(2); expect(labelForcefitElm.textContent).toBe('Ajustement forcé des colonnes'); diff --git a/packages/common/src/extensions/__tests__/slickContextMenu.spec.ts b/packages/common/src/extensions/__tests__/slickContextMenu.spec.ts index 131f93c57..367233db6 100644 --- a/packages/common/src/extensions/__tests__/slickContextMenu.spec.ts +++ b/packages/common/src/extensions/__tests__/slickContextMenu.spec.ts @@ -208,10 +208,10 @@ describe('ContextMenu Plugin', () => { eventData.target = slickCellElm; jest.spyOn(SharedService.prototype, 'slickGrid', 'get').mockReturnValue(gridStub); - gridOptionsMock.contextMenu.commandItems = deepCopy(commandItemsMock); - delete (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).action; - delete (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride; - delete (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride; + gridOptionsMock.contextMenu!.commandItems = deepCopy(commandItemsMock); + delete (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).action; + delete (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride; + delete (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride; contextMenuDiv = document.createElement('div'); contextMenuDiv.className = 'slick-header-column'; gridContainerDiv = document.createElement('div'); @@ -234,7 +234,7 @@ describe('ContextMenu Plugin', () => { plugin.dispose(); plugin.init(); - gridStub.onContextMenu.notify(null, eventData, gridStub); + gridStub.onContextMenu.notify(null as any, eventData, gridStub); let contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; expect(contextMenuElm).toBeTruthy(); @@ -270,14 +270,14 @@ describe('ContextMenu Plugin', () => { describe('with Command Items', () => { beforeEach(() => { - gridOptionsMock.contextMenu.hideCopyCellValueCommand = true; - gridOptionsMock.contextMenu.commandItems = deepCopy(commandItemsMock); + gridOptionsMock.contextMenu!.hideCopyCellValueCommand = true; + gridOptionsMock.contextMenu!.commandItems = deepCopy(commandItemsMock); }); it('should not populate and automatically return when the Context Menu item "commandItems" array of the context menu is undefined', () => { plugin.dispose(); plugin.init(); - (gridOptionsMock.contextMenu.commandItems) = undefined as any; + (gridOptionsMock.contextMenu!.commandItems) = undefined as any; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -288,8 +288,8 @@ describe('ContextMenu Plugin', () => { it('should expect a Context Menu to be created and show up when item visibility & usability callbacks returns true', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => true; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -325,8 +325,8 @@ describe('ContextMenu Plugin', () => { it('should NOT expect a Context Menu to be created the column is not found in "commandShownOverColumnIds"', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock), commandShownOverColumnIds: ['Age'] }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => true; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -337,8 +337,8 @@ describe('ContextMenu Plugin', () => { it('should expect a Context Menu to be created when cell is clicked with a list of commands defined but without "Command 1" when "itemVisibilityOverride" and "itemUsabilityOverride" return undefined', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => undefined; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => undefined; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => undefined as any; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => undefined as any; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -367,8 +367,8 @@ describe('ContextMenu Plugin', () => { it('should expect a Context Menu to be created when cell is clicked with a list of commands defined but without "Command 1" when "itemVisibilityOverride" and "itemUsabilityOverride" return false', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => false; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => false; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => false; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => false; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -389,8 +389,8 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu and a 2nd button item usability callback returns false and expect button to be disabled', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => true; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => false; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => false; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -411,7 +411,7 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu and a 2nd item is "disabled" and expect button to be disabled', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock), maxHeight: 290 }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).disabled = true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).disabled = true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -428,7 +428,7 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu and expect button to be disabled when command property is hidden', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock), maxWidth: 310 }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).hidden = true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).hidden = true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -445,7 +445,7 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu item with "iconCssClass" and expect extra css classes added to the icon element', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).iconCssClass = 'bold red'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).iconCssClass = 'bold red'; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -463,8 +463,8 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu item with a bullet character when "iconCssClass" is not provided', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).title = 'Help'; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).iconCssClass = undefined; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).title = 'Help'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).iconCssClass = undefined; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -481,8 +481,8 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu item with "textCssClass" and expect extra css classes added to the item text DOM element', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).title = 'Help'; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).textCssClass = 'italic blue'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).title = 'Help'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).textCssClass = 'italic blue'; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -499,7 +499,7 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu item with "tooltip" and expect a title attribute to be added the item text DOM element', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).tooltip = 'some tooltip'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).tooltip = 'some tooltip'; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -515,8 +515,8 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu item with a title for the command list when "commandTitle" is provided', () => { plugin.dispose(); plugin.init({ commandTitle: 'The Commands!', commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).title = 'Help'; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).textCssClass = 'italic blue'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).title = 'Help'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).textCssClass = 'italic blue'; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -530,8 +530,8 @@ describe('ContextMenu Plugin', () => { it('should expect all menu related to Sorting when "enableSorting" is set', () => { plugin.dispose(); plugin.init({ commandTitleKey: 'COMMANDS', commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).command = 'help'; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).titleKey = 'HELP'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).command = 'help'; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).titleKey = 'HELP'; translateService.use('fr'); plugin.translateContextMenu(); @@ -632,12 +632,12 @@ describe('ContextMenu Plugin', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock) }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).action = actionMock; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).action = actionMock; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; const commandListElm = contextMenuElm.querySelector('.slick-menu-command-list') as HTMLDivElement; - commandListElm.querySelector('[data-command="command2"]').dispatchEvent(new Event('click')); + commandListElm.querySelector('[data-command="command2"]')!.dispatchEvent(new Event('click')); expect(commandListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(actionMock).toHaveBeenCalled(); @@ -653,7 +653,7 @@ describe('ContextMenu Plugin', () => { const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; const commandListElm = contextMenuElm.querySelector('.slick-menu-command-list') as HTMLDivElement; - commandListElm.querySelector('[data-command="command2"]').dispatchEvent(new Event('click')); + commandListElm.querySelector('[data-command="command2"]')!.dispatchEvent(new Event('click')); expect(commandListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(onCommandMock).toHaveBeenCalled(); @@ -662,8 +662,8 @@ describe('ContextMenu Plugin', () => { it('should not populate a Context Menu when "menuUsabilityOverride" is defined and returns False', () => { plugin.dispose(); plugin.init({ commandItems: deepCopy(commandItemsMock), menuUsabilityOverride: () => false }); - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride = () => true; - (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride = () => true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride = () => true; + (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride = () => true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); expect(plugin.menuElement).toBeFalsy(); @@ -678,10 +678,10 @@ describe('ContextMenu Plugin', () => { eventData.target = slickCellElm; jest.spyOn(SharedService.prototype, 'slickGrid', 'get').mockReturnValue(gridStub); - gridOptionsMock.contextMenu.commandItems = deepCopy(commandItemsMock); - delete (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).action; - delete (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemVisibilityOverride; - delete (gridOptionsMock.contextMenu.commandItems[1] as MenuCommandItem).itemUsabilityOverride; + gridOptionsMock.contextMenu!.commandItems = deepCopy(commandItemsMock); + delete (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).action; + delete (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemVisibilityOverride; + delete (gridOptionsMock.contextMenu!.commandItems![1] as MenuCommandItem).itemUsabilityOverride; contextMenuDiv = document.createElement('div'); contextMenuDiv.className = 'slick-header-column'; gridContainerDiv = document.createElement('div'); @@ -716,7 +716,7 @@ describe('ContextMenu Plugin', () => { // -- Copy to Clipboard -- // it('should populate menuCommandItems with Copy cell action when "hideCopyCellValueCommand" is disabled', () => { const execSpy = jest.spyOn(window.document, 'execCommand'); - gridOptionsMock.contextMenu.hideCopyCellValueCommand = false; + gridOptionsMock.contextMenu!.hideCopyCellValueCommand = false; plugin.dispose(); plugin.init({ commandItems: [], hideCopyCellValueCommand: false }); gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); @@ -1221,14 +1221,14 @@ describe('ContextMenu Plugin', () => { describe('with Options Items', () => { beforeEach(() => { - gridOptionsMock.contextMenu.hideCopyCellValueCommand = true; - gridOptionsMock.contextMenu.optionItems = undefined; + gridOptionsMock.contextMenu!.hideCopyCellValueCommand = true; + gridOptionsMock.contextMenu!.optionItems = undefined; }); it('should not populate and automatically return when the Context Menu item "optionItems" array of the context menu is undefined', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock), onAfterMenuShow: undefined }); - (gridOptionsMock.contextMenu.optionItems) = undefined; + (gridOptionsMock.contextMenu!.optionItems) = undefined; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1239,8 +1239,8 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu to be create and show up when item visibility & usability callbacks returns true', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => true; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => true; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => true; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1274,8 +1274,8 @@ describe('ContextMenu Plugin', () => { it('should expect a Context Menu to be created when cell is clicked with a list of commands defined but without "Option 1" when "itemVisibilityOverride" and "itemUsabilityOverride" return undefined', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => undefined; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => undefined; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => undefined as any; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => undefined as any; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1304,8 +1304,8 @@ describe('ContextMenu Plugin', () => { it('should NOT expect a Context Menu to be created the column is not found in "commandShownOverColumnIds"', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock), optionShownOverColumnIds: ['Age'] }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => true; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => true; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => true; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1316,8 +1316,8 @@ describe('ContextMenu Plugin', () => { it('should expect a Context Menu to be created when cell is clicked with a list of options defined but without "Option 1" when "itemVisibilityOverride" and "itemUsabilityOverride" return false', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => false; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => false; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => false; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => false; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1338,8 +1338,8 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu and a 2nd button item usability callback returns false and expect button to be disabled', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemVisibilityOverride = () => true; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).itemUsabilityOverride = () => false; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemVisibilityOverride = () => true; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).itemUsabilityOverride = () => false; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1360,7 +1360,7 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu and a 2nd item is "disabled" and expect button to be disabled', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).disabled = true; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).disabled = true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1376,7 +1376,7 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu and expect button to be disabled when option property is hidden', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).hidden = true; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).hidden = true; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1392,7 +1392,7 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu item with "iconCssClass" and expect extra css classes added to the icon element', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).iconCssClass = 'underline sky'; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).iconCssClass = 'underline sky'; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1410,8 +1410,8 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu item with "textCssClass" and expect extra css classes added to the item text DOM element', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).title = 'Help'; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).textCssClass = 'italic blue'; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).title = 'Help'; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).textCssClass = 'italic blue'; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1428,7 +1428,7 @@ describe('ContextMenu Plugin', () => { it('should create a Context Menu item with "tooltip" and expect a title attribute to be added the item text DOM element', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).tooltip = 'some tooltip'; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).tooltip = 'some tooltip'; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1445,8 +1445,8 @@ describe('ContextMenu Plugin', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); plugin.setOptions({ optionTitle: 'The Options!' }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).title = 'Help'; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).textCssClass = 'italic blue'; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).title = 'Help'; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).textCssClass = 'italic blue'; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; @@ -1461,8 +1461,8 @@ describe('ContextMenu Plugin', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); (gridOptionsMock.contextMenu as ContextMenu).optionTitleKey = 'OPTIONS_LIST'; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).option = 'none'; - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).titleKey = 'NONE'; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).option = 'none'; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).titleKey = 'NONE'; translateService.use('fr'); plugin.translateContextMenu(); @@ -1502,12 +1502,12 @@ describe('ContextMenu Plugin', () => { plugin.dispose(); plugin.init({ optionItems: deepCopy(optionItemsMock) }); - (gridOptionsMock.contextMenu.optionItems[1] as MenuOptionItem).action = actionMock; + (gridOptionsMock.contextMenu!.optionItems![1] as MenuOptionItem).action = actionMock; gridStub.onContextMenu.notify({ grid: gridStub }, eventData, gridStub); const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; const optionListElm = contextMenuElm.querySelector('.slick-menu-option-list') as HTMLDivElement; - optionListElm.querySelector('[data-option="option2"]').dispatchEvent(new Event('click')); + optionListElm.querySelector('[data-option="option2"]')!.dispatchEvent(new Event('click')); expect(optionListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(actionMock).toHaveBeenCalled(); @@ -1524,7 +1524,7 @@ describe('ContextMenu Plugin', () => { const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; const optionListElm = contextMenuElm.querySelector('.slick-menu-option-list') as HTMLDivElement; - optionListElm.querySelector('[data-option="option2"]').dispatchEvent(new Event('click')); + optionListElm.querySelector('[data-option="option2"]')!.dispatchEvent(new Event('click')); expect(optionListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(onOptionSelectedMock).toHaveBeenCalled(); @@ -1541,7 +1541,7 @@ describe('ContextMenu Plugin', () => { const contextMenuElm = document.body.querySelector('.slick-context-menu.slickgrid12345') as HTMLDivElement; const optionListElm = contextMenuElm.querySelector('.slick-menu-option-list') as HTMLDivElement; - optionListElm.querySelector('[data-option="option2"]').dispatchEvent(new Event('click')); + optionListElm.querySelector('[data-option="option2"]')!.dispatchEvent(new Event('click')); expect(optionListElm.querySelectorAll('.slick-menu-item').length).toBe(5); expect(onOptionSelectedMock).not.toHaveBeenCalled(); diff --git a/packages/common/src/extensions/__tests__/slickGridMenu.spec.ts b/packages/common/src/extensions/__tests__/slickGridMenu.spec.ts index b0420d2ee..7191937f9 100644 --- a/packages/common/src/extensions/__tests__/slickGridMenu.spec.ts +++ b/packages/common/src/extensions/__tests__/slickGridMenu.spec.ts @@ -186,7 +186,7 @@ describe('GridMenuControl', () => { }); afterEach(() => { - gridMenuOptionsMock.onBeforeMenuShow = undefined; + gridMenuOptionsMock.onBeforeMenuShow = undefined as any; control?.eventHandler.unsubscribeAll(); gridOptionsMock.gridMenu = gridMenuOptionsMock; jest.clearAllMocks(); @@ -200,19 +200,19 @@ describe('GridMenuControl', () => { it('should query an input checkbox change event and expect "setSelectedRows" method to be called using Row Selection when enabled', () => { const mockRowSelection = [0, 3, 5]; jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); jest.spyOn(gridStub, 'getSelectedRows').mockReturnValue(mockRowSelection); const setSelectionSpy = jest.spyOn(gridStub, 'setSelectedRows'); gridOptionsMock.enableRowSelection = true; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const inputElm = control.menuElement.querySelector('input[type="checkbox"]'); + const inputElm = control.menuElement!.querySelector('input[type="checkbox"]') as HTMLInputElement; inputElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - expect(control.menuElement.style.display).toBe('block'); + expect(control.menuElement!.style.display).toBe('block'); expect(setSelectionSpy).toHaveBeenCalledWith(mockRowSelection); expect(control.getAllColumns()).toEqual(columnsMock); expect(control.getVisibleColumns()).toEqual(columnsMock); @@ -221,40 +221,40 @@ describe('GridMenuControl', () => { it('should open the Grid Menu and then expect it to hide when clicking anywhere in the DOM body', () => { const mockRowSelection = [0, 3, 5]; jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); jest.spyOn(gridStub, 'getSelectedRows').mockReturnValue(mockRowSelection); gridOptionsMock.enableRowSelection = true; gridOptionsMock.showHeaderRow = true; - gridOptionsMock.gridMenu.menuWidth = 16; - gridOptionsMock.gridMenu.resizeOnShowHeaderRow = true; + gridOptionsMock.gridMenu!.menuWidth = 16; + gridOptionsMock.gridMenu!.resizeOnShowHeaderRow = true; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); const headerRowElm = document.querySelector('.slick-headerrow') as HTMLDivElement; - expect(control.menuElement.style.display).toBe('block'); + expect(control.menuElement!.style.display).toBe('block'); expect(headerRowElm.style.width).toBe(`calc(100% - 16px)`) const bodyElm = document.body; bodyElm.dispatchEvent(new Event('mousedown', { bubbles: true })); - expect(control.menuElement.style.display).toBe('none'); + expect(control.menuElement!.style.display).toBe('none'); }); it('should query an input checkbox change event and expect "readjustFrozenColumnIndexWhenNeeded" method to be called when the grid is detected to be a frozen grid', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); const readjustSpy = jest.spyOn(extensionUtility, 'readjustFrozenColumnIndexWhenNeeded'); gridOptionsMock.frozenColumn = 0; control.columns = columnsMock; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); expect(handlerSpy).toHaveBeenCalledTimes(3); expect(readjustSpy).toHaveBeenCalledWith(0, columnsMock, columnsMock); @@ -264,16 +264,16 @@ describe('GridMenuControl', () => { it('should query an input checkbox change event and expect "readjustFrozenColumnIndexWhenNeeded" method to be called when the grid is detected to be a frozen grid', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); const readjustSpy = jest.spyOn(extensionUtility, 'readjustFrozenColumnIndexWhenNeeded'); gridOptionsMock.frozenColumn = 0; control.columns = columnsMock; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); expect(handlerSpy).toHaveBeenCalledTimes(3); expect(readjustSpy).toHaveBeenCalledWith(0, columnsMock, columnsMock); @@ -295,18 +295,18 @@ describe('GridMenuControl', () => { it('should query an input checkbox change event and expect "headerColumnValueExtractor" method to be called when defined', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); const readjustSpy = jest.spyOn(extensionUtility, 'readjustFrozenColumnIndexWhenNeeded'); - gridOptionsMock.gridMenu.headerColumnValueExtractor = (column: Column) => `${column?.columnGroup || ''} - ${column.name}`; + gridOptionsMock.gridMenu!.headerColumnValueExtractor = (column: Column) => `${column?.columnGroup || ''} - ${column.name}`; control.columns = columnsMock; gridOptionsMock.frozenColumn = 0; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); - const liElmList = control.menuElement.querySelectorAll('li'); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); + const liElmList = control.menuElement!.querySelectorAll('li'); expect(handlerSpy).toHaveBeenCalledTimes(3); expect(readjustSpy).toHaveBeenCalledWith(0, columnsMock, columnsMock); @@ -317,18 +317,18 @@ describe('GridMenuControl', () => { it('should query an input checkbox change event and expect "headerColumnValueExtractor" method to be called from default option when it is not provided', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); const readjustSpy = jest.spyOn(extensionUtility, 'readjustFrozenColumnIndexWhenNeeded'); - gridOptionsMock.gridMenu.headerColumnValueExtractor = null; + gridOptionsMock.gridMenu!.headerColumnValueExtractor = null as any; control.columns = columnsMock; gridOptionsMock.frozenColumn = 0; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); - const liElmList = control.menuElement.querySelectorAll('li'); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); + const liElmList = control.menuElement!.querySelectorAll('li'); expect(handlerSpy).toHaveBeenCalledTimes(3); expect(readjustSpy).toHaveBeenCalledWith(0, columnsMock, columnsMock); @@ -338,12 +338,12 @@ describe('GridMenuControl', () => { }); it('should open the Grid Menu and expect its minWidth and height to be overriden when provided as grid menu options', () => { - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); - gridOptionsMock.gridMenu.contentMinWidth = 200; - gridOptionsMock.gridMenu.height = 300; + gridOptionsMock.gridMenu!.contentMinWidth = 200; + gridOptionsMock.gridMenu!.height = 300; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); const gridMenuElm = document.querySelector('.slick-grid-menu') as HTMLDivElement; @@ -352,7 +352,7 @@ describe('GridMenuControl', () => { }); it('should open the Grid Menu via "showGridMenu" method from an external button which has span inside it and expect the Grid Menu still work, with drop aligned on left when defined', () => { - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); const repositionSpy = jest.spyOn(control, 'repositionMenu'); control.init(); @@ -371,7 +371,7 @@ describe('GridMenuControl', () => { }); it('should open the Grid Menu via "showGridMenu" method from an external button which has span inside it and expect the Grid Menu still work, with drop aligned on right when defined', () => { - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); const repositionSpy = jest.spyOn(control, 'repositionMenu'); control.init(); @@ -391,18 +391,18 @@ describe('GridMenuControl', () => { it('should open the Grid Menu and expect "Forcefit" to be checked when "hideForceFitButton" is false', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); - gridOptionsMock.gridMenu.hideForceFitButton = false; + gridOptionsMock.gridMenu!.hideForceFitButton = false; gridOptionsMock.forceFitColumns = true; control.columns = columnsMock; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); - const inputForcefitElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-forcefit]'); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); + const inputForcefitElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit') as HTMLInputElement; + const labelSyncElm = control.menuElement!.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-forcefit]') as HTMLLabelElement; expect(handlerSpy).toHaveBeenCalledTimes(3); expect(control.getAllColumns()).toEqual(columnsMock); @@ -414,18 +414,18 @@ describe('GridMenuControl', () => { it('should open the Grid Menu and expect "Sync Resize" to be checked when "hideSyncResizeButton" is false', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); - gridOptionsMock.gridMenu.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; gridOptionsMock.syncColumnCellResize = true; control.columns = columnsMock; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-syncresize]'); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); + const inputSyncElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize') as HTMLInputElement; + const labelSyncElm = control.menuElement!.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-syncresize]') as HTMLLabelElement; expect(handlerSpy).toHaveBeenCalledTimes(3); expect(control.getAllColumns()).toEqual(columnsMock); @@ -439,15 +439,15 @@ describe('GridMenuControl', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); const pubSubSpy = jest.spyOn(pubSubServiceStub, 'publish'); const onColChangedMock = jest.fn(); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); - gridOptionsMock.gridMenu.onColumnsChanged = onColChangedMock; + gridOptionsMock.gridMenu!.onColumnsChanged = onColChangedMock; control.columns = columnsMock; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); const expectedCallbackArgs = { columnId: 'field1', @@ -466,20 +466,20 @@ describe('GridMenuControl', () => { it('should open the grid menu via its hamburger menu and click on "Force Fit Columns" checkbox and expect "setOptions" and "setColumns" to be called with previous visible columns', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any as any).mockReturnValue(1); jest.spyOn(control, 'getVisibleColumns').mockReturnValue(columnsMock.slice(1)); const setOptionSpy = jest.spyOn(gridStub, 'setOptions'); const setColumnSpy = jest.spyOn(gridStub, 'setColumns'); - gridOptionsMock.gridMenu.hideForceFitButton = false; - gridOptionsMock.gridMenu.forceFitTitle = 'Custom Force Fit'; + gridOptionsMock.gridMenu!.hideForceFitButton = false; + gridOptionsMock.gridMenu!.forceFitTitle = 'Custom Force Fit'; control.columns = columnsMock; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const inputForcefitElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-forcefit]'); + const inputForcefitElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit') as HTMLInputElement; + const labelSyncElm = control.menuElement!.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-forcefit]') as HTMLLabelElement; inputForcefitElm.dispatchEvent(new Event('click', { bubbles: true })); expect(handlerSpy).toHaveBeenCalledTimes(3); @@ -493,20 +493,20 @@ describe('GridMenuControl', () => { it('should open the grid menu via its hamburger menu and click on "syncresize" checkbox and expect "setOptions" to be called with "syncColumnCellResize" property', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); jest.spyOn(control, 'getVisibleColumns').mockReturnValue(columnsMock.slice(1)); const setOptionSpy = jest.spyOn(gridStub, 'setOptions'); - gridOptionsMock.gridMenu.hideSyncResizeButton = false; - gridOptionsMock.gridMenu.syncResizeTitle = 'Custom Resize Title'; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.syncResizeTitle = 'Custom Resize Title'; gridOptionsMock.syncColumnCellResize = true; control.columns = columnsMock; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-syncresize]'); + const inputSyncElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize') as HTMLInputElement; + const labelSyncElm = control.menuElement!.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-syncresize]') as HTMLLabelElement; inputSyncElm.dispatchEvent(new Event('click', { bubbles: true })); expect(handlerSpy).toHaveBeenCalledTimes(3); @@ -518,35 +518,35 @@ describe('GridMenuControl', () => { }); it('should NOT show the Grid Menu when user defines the callback "menuUsabilityOverride" which returns False', () => { - gridOptionsMock.gridMenu.menuUsabilityOverride = () => false; - gridOptionsMock.gridMenu.hideForceFitButton = false; - gridOptionsMock.gridMenu.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.menuUsabilityOverride = () => false; + gridOptionsMock.gridMenu!.hideForceFitButton = false; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const forceFitElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit'); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize'); + const forceFitElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit') as HTMLInputElement; + const inputSyncElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize') as HTMLInputElement; - expect(control.menuElement.style.display).toBe('none'); + expect(control.menuElement!.style.display).toBe('none'); expect(forceFitElm).toBeFalsy(); expect(inputSyncElm).toBeFalsy(); }); it('should NOT show the Grid Menu when user defines the callback "onBeforeMenuShow" which returns False', () => { - gridOptionsMock.gridMenu.menuUsabilityOverride = () => true; + gridOptionsMock.gridMenu!.menuUsabilityOverride = () => true; const pubSubSpy = jest.spyOn(pubSubServiceStub, 'publish'); - gridOptionsMock.gridMenu.onBeforeMenuShow = () => false; - gridOptionsMock.gridMenu.hideForceFitButton = false; - gridOptionsMock.gridMenu.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.onBeforeMenuShow = () => false; + gridOptionsMock.gridMenu!.hideForceFitButton = false; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const forceFitElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit'); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize'); + const forceFitElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit') as HTMLInputElement; + const inputSyncElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize') as HTMLInputElement; - expect(control.menuElement.style.display).toBe('none'); + expect(control.menuElement!.style.display).toBe('none'); expect(forceFitElm).toBeFalsy(); expect(inputSyncElm).toBeFalsy(); expect(pubSubSpy).toHaveBeenCalledWith('onGridMenuBeforeMenuShow', { @@ -559,35 +559,35 @@ describe('GridMenuControl', () => { }); it('should show the Grid Menu when user defines the callback "onBeforeMenuShow" which returns True', () => { - gridOptionsMock.gridMenu.onBeforeMenuShow = () => true; - gridOptionsMock.gridMenu.hideForceFitButton = false; - gridOptionsMock.gridMenu.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.onBeforeMenuShow = () => true; + gridOptionsMock.gridMenu!.hideForceFitButton = false; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const forceFitElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit'); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize'); + const forceFitElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit') as HTMLInputElement; + const inputSyncElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize') as HTMLInputElement; - expect(control.menuElement.style.display).toBe('block'); + expect(control.menuElement!.style.display).toBe('block'); expect(forceFitElm).toBeTruthy(); expect(inputSyncElm).toBeTruthy(); }); it('should execute "onAfterMenuShow" callback when defined', () => { const pubSubSpy = jest.spyOn(pubSubServiceStub, 'publish'); - gridOptionsMock.gridMenu.onAfterMenuShow = () => true; - const onAfterSpy = jest.spyOn(gridOptionsMock.gridMenu, 'onAfterMenuShow'); + gridOptionsMock.gridMenu!.onAfterMenuShow = () => true; + const onAfterSpy = jest.spyOn(gridOptionsMock.gridMenu!, 'onAfterMenuShow'); control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); expect(onAfterSpy).toHaveBeenCalled(); - expect(control.menuElement.style.display).toBe('block'); + expect(control.menuElement!.style.display).toBe('block'); control.hideMenu(new Event('click', { bubbles: true, cancelable: true, composed: false }) as DOMEvent); - expect(control.menuElement.style.display).toBe('none'); + expect(control.menuElement!.style.display).toBe('none'); expect(pubSubSpy).toHaveBeenCalledWith('onGridMenuAfterMenuShow', { grid: gridStub, menu: document.querySelector('.slick-grid-menu'), @@ -600,22 +600,22 @@ describe('GridMenuControl', () => { it('should NOT close the Grid Menu by calling "hideMenu" when user defines the callback "onMenuClose" which returns False', () => { const pubSubSpy = jest.spyOn(pubSubServiceStub, 'publish'); - gridOptionsMock.gridMenu.onMenuClose = () => false; - gridOptionsMock.gridMenu.hideForceFitButton = false; - gridOptionsMock.gridMenu.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.onMenuClose = () => false; + gridOptionsMock.gridMenu!.hideForceFitButton = false; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const forceFitElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit'); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize'); + const forceFitElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit') as HTMLInputElement; + const inputSyncElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize') as HTMLInputElement; - expect(control.menuElement.style.display).toBe('block'); + expect(control.menuElement!.style.display).toBe('block'); expect(forceFitElm).toBeTruthy(); expect(inputSyncElm).toBeTruthy(); control.hideMenu(new Event('click', { bubbles: true, cancelable: true, composed: false }) as DOMEvent); - expect(control.menuElement.style.display).toBe('block'); + expect(control.menuElement!.style.display).toBe('block'); expect(pubSubSpy).toHaveBeenCalledWith('onGridMenuMenuClose', { grid: gridStub, menu: document.querySelector('.slick-grid-menu'), @@ -627,50 +627,50 @@ describe('GridMenuControl', () => { it('should close the Grid Menu by calling "hideMenu" when user defines the callback "onMenuClose" which returns True', () => { const autosizeSpy = jest.spyOn(gridStub, 'autosizeColumns'); - gridOptionsMock.gridMenu.onMenuClose = () => true; - gridOptionsMock.gridMenu.hideForceFitButton = false; - gridOptionsMock.gridMenu.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.onMenuClose = () => true; + gridOptionsMock.gridMenu!.hideForceFitButton = false; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const forceFitElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit'); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize'); + const forceFitElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit') as HTMLInputElement; + const inputSyncElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize') as HTMLInputElement; - expect(control.menuElement.style.display).toBe('block'); + expect(control.menuElement!.style.display).toBe('block'); expect(forceFitElm).toBeTruthy(); expect(inputSyncElm).toBeTruthy(); control.hideMenu(new Event('click', { bubbles: true, cancelable: true, composed: false }) as DOMEvent); - expect(control.menuElement.style.display).toBe('none'); + expect(control.menuElement!.style.display).toBe('none'); expect(autosizeSpy).not.toHaveBeenCalled(); }); it('should close the Grid Menu by calling "hideMenu" and call "autosizeColumns" when "enableAutoSizeColumns" is enabled and the columns are different', () => { - gridOptionsMock.gridMenu.hideForceFitButton = false; - gridOptionsMock.gridMenu.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.hideForceFitButton = false; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; gridOptionsMock.enableAutoSizeColumns = true; const autosizeSpy = jest.spyOn(gridStub, 'autosizeColumns'); jest.spyOn(gridStub, 'getOptions').mockReturnValue(gridOptionsMock); control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const forceFitElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit'); - const inputSyncElm = control.menuElement.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize'); + const forceFitElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-forcefit') as HTMLInputElement; + const inputSyncElm = control.menuElement!.querySelector('#slickgrid_124343-gridmenu-colpicker-syncresize') as HTMLInputElement; const pickerField1Elm = document.querySelector('input[type="checkbox"][data-columnid="field1"]') as HTMLInputElement; expect(pickerField1Elm.checked).toBeTrue(); pickerField1Elm.checked = false; pickerField1Elm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - expect(control.menuElement.style.display).toBe('block'); + expect(control.menuElement!.style.display).toBe('block'); expect(forceFitElm).toBeTruthy(); expect(inputSyncElm).toBeTruthy(); expect(pickerField1Elm.checked).toBeFalse(); control.hideMenu(new Event('click', { bubbles: true, cancelable: true, composed: false }) as DOMEvent); - expect(control.menuElement.style.display).toBe('none'); + expect(control.menuElement!.style.display).toBe('none'); expect(autosizeSpy).toHaveBeenCalled(); }); @@ -679,13 +679,13 @@ describe('GridMenuControl', () => { const onCommandMock = jest.fn(); const pubSubSpy = jest.spyOn(pubSubServiceStub, 'publish'); - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', action: helpFnMock }]; - gridOptionsMock.gridMenu.onCommand = onCommandMock; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', action: helpFnMock }]; + gridOptionsMock.gridMenu!.onCommand = onCommandMock; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); helpCommandElm.dispatchEvent(clickEvent); @@ -705,13 +705,13 @@ describe('GridMenuControl', () => { const helpFnMock = jest.fn(); const onCommandMock = jest.fn(); - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', action: helpFnMock, disabled: true }]; - gridOptionsMock.gridMenu.onCommand = onCommandMock; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', action: helpFnMock, disabled: true }]; + gridOptionsMock.gridMenu!.onCommand = onCommandMock; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); helpCommandElm.dispatchEvent(clickEvent); @@ -724,13 +724,13 @@ describe('GridMenuControl', () => { const helpFnMock = jest.fn(); const onCommandMock = jest.fn(); - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', action: helpFnMock, itemUsabilityOverride: () => false }]; - gridOptionsMock.gridMenu.onCommand = onCommandMock; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', action: helpFnMock, itemUsabilityOverride: () => false }]; + gridOptionsMock.gridMenu!.onCommand = onCommandMock; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); helpCommandElm.dispatchEvent(clickEvent); @@ -742,13 +742,13 @@ describe('GridMenuControl', () => { const helpFnMock = jest.fn(); const onCommandMock = jest.fn(); - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', action: helpFnMock, itemUsabilityOverride: () => true }]; - gridOptionsMock.gridMenu.onCommand = onCommandMock; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', action: helpFnMock, itemUsabilityOverride: () => true }]; + gridOptionsMock.gridMenu!.onCommand = onCommandMock; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); helpCommandElm.dispatchEvent(clickEvent); @@ -763,67 +763,67 @@ describe('GridMenuControl', () => { }); it('should add a custom Grid Menu item and expect item to be hidden from the DOM list when "hidden" is enabled', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', hidden: true }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', hidden: true }]; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; expect(helpCommandElm.classList.contains('slick-menu-item-hidden')).toBeTrue(); }); it('should add a custom Grid Menu item and expect item to NOT be created in the DOM list when "itemVisibilityOverride" callback returns False', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', itemVisibilityOverride: () => false }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', itemVisibilityOverride: () => false }]; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; expect(helpCommandElm).toBeFalsy(); }); it('should add a custom Grid Menu item and expect item to be disabled when "disabled" is set to True', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', disabled: true }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', disabled: true }]; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; expect(helpCommandElm.classList.contains('slick-menu-item-disabled')).toBeTrue(); }); it('should add a custom Grid Menu "divider" item object and expect a divider to be created', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'divider', divider: true }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'divider', divider: true }]; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=divider]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=divider]') as HTMLInputElement; expect(helpCommandElm.classList.contains('slick-menu-item-divider')).toBeTrue(); }); it('should add a custom Grid Menu "divider" string and expect a divider to be created', () => { - gridOptionsMock.gridMenu.commandItems = ['divider']; + gridOptionsMock.gridMenu!.commandItems = ['divider']; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item') as HTMLInputElement; expect(helpCommandElm.classList.contains('slick-menu-item-divider')).toBeTrue(); }); it('should add a custom Grid Menu item with "cssClass" and expect all classes to be added to the item in the DOM', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', cssClass: 'text-danger red' }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', cssClass: 'text-danger red' }]; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; expect(helpCommandElm.classList.contains('slick-menu-item')).toBeTrue(); expect(helpCommandElm.classList.contains('text-danger')).toBeTrue(); @@ -832,14 +832,14 @@ describe('GridMenuControl', () => { }); it('should add a custom Grid Menu item with "iconCssClass" and expect an icon to be included on the item DOM element', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', iconCssClass: 'mdi mdi-close' }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', iconCssClass: 'mdi mdi-close' }]; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); - const helpIconElm = helpCommandElm.querySelector('.slick-menu-icon'); - const helpTextElm = helpCommandElm.querySelector('.slick-menu-content'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; + const helpIconElm = helpCommandElm.querySelector('.slick-menu-icon') as HTMLInputElement; + const helpTextElm = helpCommandElm.querySelector('.slick-menu-content') as HTMLInputElement; expect(helpTextElm.textContent).toBe('Help'); expect(helpIconElm.classList.contains('slick-menu-icon')).toBeTrue(); @@ -849,24 +849,24 @@ describe('GridMenuControl', () => { }); it('should add a custom Grid Menu item with "tooltip" and expect the item title attribute to be part of the item DOM element', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', tooltip: 'some tooltip text' }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', tooltip: 'some tooltip text' }]; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; expect(helpCommandElm.title).toBe('some tooltip text'); }); it('should add a custom Grid Menu item with "textCssClass" and expect extra css classes added to the item text DOM element', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', textCssClass: 'red bold' }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', textCssClass: 'red bold' }]; control.columns = columnsMock; control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); - const helpTextElm = helpCommandElm.querySelector('.slick-menu-content'); + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; + const helpTextElm = helpCommandElm.querySelector('.slick-menu-content') as HTMLInputElement; expect(helpTextElm.textContent).toBe('Help'); expect(helpTextElm.classList.contains('red')).toBeTrue(); @@ -875,16 +875,16 @@ describe('GridMenuControl', () => { }); it('should add a custom Grid Menu item and provide a custom title for the command items list', () => { - gridOptionsMock.gridMenu.commandItems = [{ command: 'help', title: 'Help', textCssClass: 'red bold' }]; + gridOptionsMock.gridMenu!.commandItems = [{ command: 'help', title: 'Help', textCssClass: 'red bold' }]; control.columns = columnsMock; control.init(); - gridOptionsMock.gridMenu.commandTitle = 'Custom Title'; - control.updateAllTitles(gridOptionsMock.gridMenu); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + gridOptionsMock.gridMenu!.commandTitle = 'Custom Title'; + control.updateAllTitles(gridOptionsMock.gridMenu!); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - const commandTitleElm = control.menuElement.querySelector('.slick-menu-command-list .slick-menu-title'); - const helpCommandElm = control.menuElement.querySelector('.slick-menu-item[data-command=help]'); - const helpTextElm = helpCommandElm.querySelector('.slick-menu-content'); + const commandTitleElm = control.menuElement!.querySelector('.slick-menu-command-list .slick-menu-title') as HTMLInputElement; + const helpCommandElm = control.menuElement!.querySelector('.slick-menu-item[data-command=help]') as HTMLInputElement; + const helpTextElm = helpCommandElm.querySelector('.slick-menu-content') as HTMLInputElement; expect(commandTitleElm.textContent).toBe('Custom Title'); expect(helpTextElm.textContent).toBe('Help'); @@ -920,7 +920,7 @@ describe('GridMenuControl', () => { }); it('should expect menu related to "Unfreeze Columns/Rows"', () => { - const copyGridOptionsMock = { ...gridOptionsMock, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: false, } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: false, } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; control.init(); @@ -944,7 +944,7 @@ describe('GridMenuControl', () => { }); it('should have only 1 menu "clear-filter" when all other menus are defined as hidden & when "enableFilering" is set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideToggleFilterCommand: true, hideRefreshDatasetCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideToggleFilterCommand: true, hideRefreshDatasetCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -956,7 +956,7 @@ describe('GridMenuControl', () => { }); it('should have only 1 menu "toggle-filter" when all other menus are defined as hidden & when "enableFilering" is set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllFiltersCommand: true, hideRefreshDatasetCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllFiltersCommand: true, hideRefreshDatasetCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -968,7 +968,7 @@ describe('GridMenuControl', () => { }); it('should have only 1 menu "refresh-dataset" when all other menus are defined as hidden & when "enableFilering" is set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllFiltersCommand: true, hideToggleFilterCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllFiltersCommand: true, hideToggleFilterCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -992,7 +992,7 @@ describe('GridMenuControl', () => { }); it('should not have the "toggle-preheader" menu command when "showPreHeaderPanel" and "hideTogglePreHeaderCommand" are set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, showPreHeaderPanel: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideTogglePreHeaderCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, showPreHeaderPanel: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideTogglePreHeaderCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -1014,7 +1014,7 @@ describe('GridMenuControl', () => { }); it('should not have the "clear-sorting" menu command when "enableSorting" and "hideClearAllSortingCommand" are set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableSorting: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllSortingCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableSorting: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideClearAllSortingCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -1024,7 +1024,7 @@ describe('GridMenuControl', () => { }); it('should have the "export-csv" menu command when "enableTextExport" is set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableTextExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableTextExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -1036,7 +1036,7 @@ describe('GridMenuControl', () => { }); it('should not have the "export-csv" menu command when "enableTextExport" and "hideExportCsvCommand" are set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableTextExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportCsvCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableTextExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportCsvCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -1046,7 +1046,7 @@ describe('GridMenuControl', () => { }); it('should have the "export-excel" menu command when "enableTextExport" is set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableExcelExport: true, enableTextExport: false, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideExportCsvCommand: true, hideExportExcelCommand: false } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableExcelExport: true, enableTextExport: false, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportCsvCommand: true, hideExportExcelCommand: false } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -1058,7 +1058,7 @@ describe('GridMenuControl', () => { }); it('should have the "export-text-delimited" menu command when "enableTextExport" is set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableTextExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideExportCsvCommand: true, hideExportExcelCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableTextExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportCsvCommand: true, hideExportExcelCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -1070,7 +1070,7 @@ describe('GridMenuControl', () => { }); it('should not have the "export-text-delimited" menu command when "enableTextExport" and "hideExportCsvCommand" are set', () => { - const copyGridOptionsMock = { ...gridOptionsMock, enableTextExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportCsvCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, enableTextExport: true, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: true, hideExportExcelCommand: true, hideExportCsvCommand: true, hideExportTextDelimitedCommand: true } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); control.columns = columnsMock; @@ -1091,7 +1091,7 @@ describe('GridMenuControl', () => { const setOptionsSpy = jest.spyOn(gridStub, 'setOptions'); const setColumnsSpy = jest.spyOn(gridStub, 'setColumns'); const pubSubSpy = jest.spyOn(pubSubServiceStub, 'publish'); - const copyGridOptionsMock = { ...gridOptionsMock, gridMenu: { commandLabels: gridOptionsMock.gridMenu.commandLabels, hideClearFrozenColumnsCommand: false, } } as unknown as GridOption; + const copyGridOptionsMock = { ...gridOptionsMock, gridMenu: { commandLabels: gridOptionsMock.gridMenu!.commandLabels, hideClearFrozenColumnsCommand: false, } } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); @@ -1099,8 +1099,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=clear-pinning]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=clear-pinning]')!.dispatchEvent(clickEvent); expect(setColumnsSpy).toHaveBeenCalled(); expect(setOptionsSpy).toHaveBeenCalledWith({ frozenColumn: -1, frozenRow: -1, frozenBottom: false, enableMouseWheelScrollHandler: false }); @@ -1119,8 +1119,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=clear-filter]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=clear-filter]')!.dispatchEvent(clickEvent); expect(filterSpy).toHaveBeenCalled(); expect(refreshSpy).toHaveBeenCalled(); @@ -1139,8 +1139,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=clear-sorting]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=clear-sorting]')!.dispatchEvent(clickEvent); expect(sortSpy).toHaveBeenCalled(); expect(refreshSpy).toHaveBeenCalled(); @@ -1156,8 +1156,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=export-excel]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=export-excel]')!.dispatchEvent(clickEvent); expect(consoleErrorSpy).toHaveBeenCalledWith(expect.toInclude('[Slickgrid-Universal] You must register the ExcelExportService to properly use Export to Excel in the Grid Menu.')); }); @@ -1171,8 +1171,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=export-csv]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=export-csv]')!.dispatchEvent(clickEvent); expect(consoleErrorSpy).toHaveBeenCalledWith(expect.toInclude('[Slickgrid-Universal] You must register the TextExportService to properly use Export to File in the Grid Menu.')); }); @@ -1186,8 +1186,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=export-text-delimited]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=export-text-delimited]')!.dispatchEvent(clickEvent); expect(consoleErrorSpy).toHaveBeenCalledWith(expect.toInclude('[Slickgrid-Universal] You must register the TextExportService to properly use Export to File in the Grid Menu.')); }); @@ -1203,8 +1203,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=export-excel]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=export-excel]')!.dispatchEvent(clickEvent); expect(excelExportSpy).toHaveBeenCalled(); }); @@ -1220,8 +1220,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=export-csv]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=export-csv]')!.dispatchEvent(clickEvent); expect(exportSpy).toHaveBeenCalledWith({ delimiter: DelimiterType.comma, format: FileType.csv }); }); @@ -1237,8 +1237,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=export-text-delimited]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=export-text-delimited]')!.dispatchEvent(clickEvent); expect(exportSpy).toHaveBeenCalledWith({ delimiter: DelimiterType.tab, format: FileType.txt }); }); @@ -1254,8 +1254,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=toggle-filter]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=toggle-filter]')!.dispatchEvent(clickEvent); expect(setHeaderSpy).toHaveBeenCalledWith(true); expect(scrollSpy).toHaveBeenCalledWith(0); @@ -1264,7 +1264,7 @@ describe('GridMenuControl', () => { copyGridOptionsMock = { ...gridOptionsMock, enableFiltering: true, showHeaderRow: true, hideToggleFilterCommand: false } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); - control.menuElement.querySelector('.slick-menu-item[data-command=toggle-filter]').dispatchEvent(clickEvent); + control.menuElement!.querySelector('.slick-menu-item[data-command=toggle-filter]')!.dispatchEvent(clickEvent); expect(setHeaderSpy).toHaveBeenCalledWith(false); expect(setColumnSpy).toHaveBeenCalledTimes(1); // same as before, so count won't increase @@ -1279,15 +1279,15 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=toggle-preheader]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=toggle-preheader]')!.dispatchEvent(clickEvent); expect(gridSpy).toHaveBeenCalledWith(false); copyGridOptionsMock = { ...gridOptionsMock, showPreHeaderPanel: false, hideTogglePreHeaderCommand: false } as unknown as GridOption; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(copyGridOptionsMock); jest.spyOn(gridStub, 'getOptions').mockReturnValue(copyGridOptionsMock); - control.menuElement.querySelector('.slick-menu-item[data-command=toggle-preheader]').dispatchEvent(clickEvent); + control.menuElement!.querySelector('.slick-menu-item[data-command=toggle-preheader]')!.dispatchEvent(clickEvent); expect(gridSpy).toHaveBeenCalledWith(true); }); @@ -1301,8 +1301,8 @@ describe('GridMenuControl', () => { control.init(); control.columns = columnsMock; const clickEvent = new Event('click', { bubbles: true, cancelable: true, composed: false }); - document.querySelector('.slick-grid-menu-button').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('.slick-menu-item[data-command=refresh-dataset]').dispatchEvent(clickEvent); + document.querySelector('.slick-grid-menu-button')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + control.menuElement!.querySelector('.slick-menu-item[data-command=refresh-dataset]')!.dispatchEvent(clickEvent); expect(refreshSpy).toHaveBeenCalled(); }); @@ -1321,16 +1321,16 @@ describe('GridMenuControl', () => { { id: 'field2', field: 'field2', name: 'Field 2', width: 75 }, { id: 'field3', field: 'field3', name: 'Field 3', width: 75, columnGroup: 'Billing' }, ]; - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValueOnce(0).mockReturnValueOnce(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValueOnce(0).mockReturnValueOnce(1); const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); control.columns = columnsUnorderedMock; control.initEventHandlers(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); gridStub.onColumnsReordered.notify({ impactedColumns: columnsUnorderedMock, grid: gridStub }, eventData, gridStub); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); expect(handlerSpy).toHaveBeenCalledTimes(3); expect(control.getAllColumns()).toEqual(columnsMock); @@ -1354,11 +1354,11 @@ describe('GridMenuControl', () => { const handlerSpy = jest.spyOn(control.eventHandler, 'subscribe'); const utilitySpy = jest.spyOn(extensionUtility, 'getPickerTitleOutputString'); const translateSpy = jest.spyOn(extensionUtility, 'translateItems'); - jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined).mockReturnValue(1); + jest.spyOn(gridStub, 'getColumnIndex').mockReturnValue(undefined as any).mockReturnValue(1); translateService.use('fr'); - gridOptionsMock.gridMenu.hideForceFitButton = false; - gridOptionsMock.gridMenu.hideSyncResizeButton = false; + gridOptionsMock.gridMenu!.hideForceFitButton = false; + gridOptionsMock.gridMenu!.hideSyncResizeButton = false; gridOptionsMock.syncColumnCellResize = true; gridOptionsMock.forceFitColumns = true; jest.spyOn(SharedService.prototype, 'gridOptions', 'get').mockReturnValue(gridOptionsMock); @@ -1368,11 +1368,11 @@ describe('GridMenuControl', () => { control.initEventHandlers(); control.translateGridMenu(); control.init(); - const buttonElm = document.querySelector('.slick-grid-menu-button'); + const buttonElm = document.querySelector('.slick-grid-menu-button') as HTMLDivElement; buttonElm.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); - control.menuElement.querySelector('input[type="checkbox"]').dispatchEvent(new Event('click', { bubbles: true })); - const labelForcefitElm = control.menuElement.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-forcefit]'); - const labelSyncElm = control.menuElement.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-syncresize]'); + control.menuElement!.querySelector('input[type="checkbox"]')!.dispatchEvent(new Event('click', { bubbles: true })); + const labelForcefitElm = control.menuElement!.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-forcefit]') as HTMLLabelElement; + const labelSyncElm = control.menuElement!.querySelector('label[for=slickgrid_124343-gridmenu-colpicker-syncresize]') as HTMLLabelElement; expect(handlerSpy).toHaveBeenCalledTimes(3); expect(labelForcefitElm.textContent).toBe('Ajustement forcé des colonnes'); diff --git a/packages/common/src/extensions/__tests__/slickGroupItemMetadataProvider.spec.ts b/packages/common/src/extensions/__tests__/slickGroupItemMetadataProvider.spec.ts index c19846b53..b78b2e736 100644 --- a/packages/common/src/extensions/__tests__/slickGroupItemMetadataProvider.spec.ts +++ b/packages/common/src/extensions/__tests__/slickGroupItemMetadataProvider.spec.ts @@ -111,25 +111,25 @@ describe('GroupItemMetadataProvider Service', () => { describe('Group Formatter', () => { it('should return item title when calling "defaultGroupCellFormatter" with option "enableExpandCollapse" set to False', () => { service.setOptions({ enableExpandCollapse: false }); - const output = service.getOptions().groupFormatter(0, 0, 'test', mockColumns[0], { title: 'Some Title' }, gridStub); + const output = service.getOptions().groupFormatter!(0, 0, 'test', mockColumns[0], { title: 'Some Title' }, gridStub); expect(output).toBe('Some Title'); }); it('should return Grouping info formatted with a group level 0 without indentation when calling "defaultGroupCellFormatter" with option "enableExpandCollapse" set to True', () => { service.setOptions({ enableExpandCollapse: true }); - const output = service.getOptions().groupFormatter(0, 0, 'test', mockColumns[0], { title: 'Some Title' }, gridStub); + const output = service.getOptions().groupFormatter!(0, 0, 'test', mockColumns[0], { title: 'Some Title' }, gridStub); expect(output).toBe('Some Title'); }); it('should return Grouping info formatted with a group level 2 with indentation of 30px when calling "defaultGroupCellFormatter" with option "enableExpandCollapse" set to True and level 2', () => { service.setOptions({ enableExpandCollapse: true, toggleCssClass: 'groupy-toggle', toggleExpandedCssClass: 'groupy-expanded' }); - const output = service.getOptions().groupFormatter(0, 0, 'test', mockColumns[0], { level: 2, title: 'Some Title' }, gridStub); + const output = service.getOptions().groupFormatter!(0, 0, 'test', mockColumns[0], { level: 2, title: 'Some Title' }, gridStub); expect(output).toBe('Some Title'); }); it('should return Grouping info formatted with a group level 2 with indentation of 30px when calling "defaultGroupCellFormatter" with option "enableExpandCollapse" set to True and level 2', () => { service.setOptions({ enableExpandCollapse: true, toggleCssClass: 'groupy-toggle', toggleCollapsedCssClass: 'groupy-collapsed' }); - const output = service.getOptions().groupFormatter(0, 0, 'test', mockColumns[0], { collapsed: true, level: 3, title: 'Some Title' }, gridStub); + const output = service.getOptions().groupFormatter!(0, 0, 'test', mockColumns[0], { collapsed: true, level: 3, title: 'Some Title' }, gridStub); expect(output).toBe('Some Title'); }); }); @@ -137,13 +137,13 @@ describe('GroupItemMetadataProvider Service', () => { describe('Group Totals Formatter', () => { it('should return Grouping Totals formatted with column definition "groupTotalsFormatter" called when defined', () => { const mockDataContext = { sum: 152, avg: 33 }; - const output = service.getOptions().totalsFormatter(0, 0, 'some value', mockColumns[2], mockDataContext, gridStub); + const output = service.getOptions().totalsFormatter!(0, 0, 'some value', mockColumns[2], mockDataContext, gridStub); expect(output).toBe('Totals: 152'); }); it('should return empty string when column definition does not include grouping info formatter', () => { const mockDataContext = { sum: 152, avg: 33 }; - const output = service.getOptions().totalsFormatter(0, 0, 'some value', mockColumns[0], mockDataContext, gridStub); + const output = service.getOptions().totalsFormatter!(0, 0, 'some value', mockColumns[0], mockDataContext, gridStub); expect(output).toBe(''); }); }); @@ -153,7 +153,7 @@ describe('GroupItemMetadataProvider Service', () => { const mockOptions = { groupFocusable: true, groupCssClass: 'groupy-group', includeHeaderTotals: true } as GroupItemMetadataProviderOption; service.setOptions(mockOptions); - const output = service.getGroupRowMetadata({ count: 12, level: undefined, groupingKey: 'age', value: 33 }); + const output = service.getGroupRowMetadata({ count: 12, level: undefined as any, groupingKey: 'age', value: 33 }); expect(output).toEqual({ selectable: false, focusable: mockOptions.groupFocusable, @@ -195,7 +195,7 @@ describe('GroupItemMetadataProvider Service', () => { const mockOptions = { totalsFocusable: true, totalsCssClass: 'groupy-totals' } as GroupItemMetadataProviderOption; service.setOptions(mockOptions); - const output = service.getTotalsRowMetadata({ group: { count: 12, level: undefined, groupingKey: 'age', value: 33 } }); + const output = service.getTotalsRowMetadata({ group: { count: 12, level: undefined as any, groupingKey: 'age', value: 33 } }); expect(output).toEqual({ editor: null, selectable: false, diff --git a/packages/common/src/extensions/__tests__/slickHeaderButtons.spec.ts b/packages/common/src/extensions/__tests__/slickHeaderButtons.spec.ts index 66e71143b..9e46ffc3a 100644 --- a/packages/common/src/extensions/__tests__/slickHeaderButtons.spec.ts +++ b/packages/common/src/extensions/__tests__/slickHeaderButtons.spec.ts @@ -110,8 +110,8 @@ describe('HeaderButton Plugin', () => { describe('plugins - Header Button', () => { beforeEach(() => { jest.spyOn(SharedService.prototype, 'slickGrid', 'get').mockReturnValue(gridStub); - columnsMock[0].header.buttons[1] = undefined; - columnsMock[0].header.buttons[1] = { + columnsMock[0].header!.buttons![1] = undefined as any; + columnsMock[0].header!.buttons![1] = { cssClass: 'mdi mdi-lightbulb-on', command: 'show-negative-numbers', tooltip: 'Highlight negative numbers.', @@ -124,7 +124,7 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].itemVisibilityOverride = () => undefined; + columnsMock[0].header!.buttons![1].itemVisibilityOverride = () => undefined as any; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); @@ -143,7 +143,7 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].itemVisibilityOverride = () => false; + columnsMock[0].header!.buttons![1].itemVisibilityOverride = () => false; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); @@ -159,8 +159,8 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].itemVisibilityOverride = () => true; - columnsMock[0].header.buttons[1].itemUsabilityOverride = () => true; + columnsMock[0].header!.buttons![1].itemVisibilityOverride = () => true; + columnsMock[0].header!.buttons![1].itemUsabilityOverride = () => true; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); @@ -177,8 +177,8 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].itemVisibilityOverride = () => true; - columnsMock[0].header.buttons[1].itemUsabilityOverride = () => false; + columnsMock[0].header!.buttons![1].itemVisibilityOverride = () => true; + columnsMock[0].header!.buttons![1].itemUsabilityOverride = () => false; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); @@ -195,8 +195,8 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].itemVisibilityOverride = undefined; - columnsMock[0].header.buttons[1].disabled = true; + columnsMock[0].header!.buttons![1].itemVisibilityOverride = undefined as any; + columnsMock[0].header!.buttons![1].disabled = true; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); @@ -213,8 +213,8 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].itemVisibilityOverride = undefined; - columnsMock[0].header.buttons[1].showOnHover = true; + columnsMock[0].header!.buttons![1].itemVisibilityOverride = undefined as any; + columnsMock[0].header!.buttons![1].showOnHover = true; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); @@ -232,11 +232,11 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].handler = handlerMock; + columnsMock[0].header!.buttons![1].handler = handlerMock; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); - headerDiv.querySelector('.slick-header-button.mdi-lightbulb-on').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + headerDiv.querySelector('.slick-header-button.mdi-lightbulb-on')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); // add Header Buttons which are visible (2x buttons) expect(removeExtraSpaces(headerDiv.innerHTML)).toBe(removeExtraSpaces( @@ -252,11 +252,11 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].action = actionMock; + columnsMock[0].header!.buttons![1].action = actionMock; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); - headerDiv.querySelector('.slick-header-button.mdi-lightbulb-on').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + headerDiv.querySelector('.slick-header-button.mdi-lightbulb-on')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); // add Header Buttons which are visible (2x buttons) expect(removeExtraSpaces(headerDiv.innerHTML)).toBe(removeExtraSpaces( @@ -277,7 +277,7 @@ describe('HeaderButton Plugin', () => { const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); - headerDiv.querySelector('.slick-header-button.mdi-lightbulb-on').dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); + headerDiv.querySelector('.slick-header-button.mdi-lightbulb-on')!.dispatchEvent(new Event('click', { bubbles: true, cancelable: true, composed: false })); // add Header Buttons which are visible (2x buttons) expect(removeExtraSpaces(headerDiv.innerHTML)).toBe(removeExtraSpaces( @@ -293,10 +293,10 @@ describe('HeaderButton Plugin', () => { plugin.dispose(); plugin.init(); - columnsMock[0].header.buttons[1].itemVisibilityOverride = () => true; - columnsMock[0].header.buttons[1].itemUsabilityOverride = () => true; - delete columnsMock[0].header.buttons[1].showOnHover; - columnsMock[0].header.buttons[1].disabled = true; + columnsMock[0].header!.buttons![1].itemVisibilityOverride = () => true; + columnsMock[0].header!.buttons![1].itemUsabilityOverride = () => true; + delete columnsMock[0].header!.buttons![1].showOnHover; + columnsMock[0].header!.buttons![1].disabled = true; const eventData = { ...new Slick.EventData(), preventDefault: jest.fn() }; gridStub.onHeaderCellRendered.notify({ column: columnsMock[0], node: headerDiv, grid: gridStub }, eventData, gridStub); diff --git a/packages/common/src/extensions/__tests__/slickRowSelectionModel.spec.ts b/packages/common/src/extensions/__tests__/slickRowSelectionModel.spec.ts index 261abda9e..4e2c72cef 100644 --- a/packages/common/src/extensions/__tests__/slickRowSelectionModel.spec.ts +++ b/packages/common/src/extensions/__tests__/slickRowSelectionModel.spec.ts @@ -490,7 +490,7 @@ describe('SlickRowSelectionModel Plugin', () => { plugin.init(gridStub); const scrollEvent = addJQueryEventPropagation(new Event('scroll')); - plugin.getCellRangeSelector().onCellRangeSelected.notify({ range: { fromCell: 2, fromRow: 3, toCell: 4, toRow: 5 } }, scrollEvent, gridStub); + plugin.getCellRangeSelector()!.onCellRangeSelected.notify({ range: { fromCell: 2, fromRow: 3, toCell: 4, toRow: 5 } }, scrollEvent, gridStub); expect(setSelectedRangeSpy).toHaveBeenCalledWith([{ fromCell: 0, fromRow: 3, toCell: 2, toRow: 5, @@ -512,7 +512,7 @@ describe('SlickRowSelectionModel Plugin', () => { }); plugin.init(gridStub); const scrollEvent = addJQueryEventPropagation(new Event('scroll')); - plugin.getCellRangeSelector().onCellRangeSelected.notify({ range: { fromCell: 2, fromRow: 3, toCell: 4, toRow: 5 } }, scrollEvent, gridStub); + plugin.getCellRangeSelector()!.onCellRangeSelected.notify({ range: { fromCell: 2, fromRow: 3, toCell: 4, toRow: 5 } }, scrollEvent, gridStub); expect(setSelectedRangeSpy).toHaveBeenCalledWith([{ fromCell: 0, fromRow: 3, toCell: 2, toRow: 5, @@ -526,7 +526,7 @@ describe('SlickRowSelectionModel Plugin', () => { plugin.init(gridStub); const scrollEvent = addJQueryEventPropagation(new Event('scroll')); - plugin.getCellRangeSelector().onCellRangeSelected.notify({ range: { fromCell: 2, fromRow: 3, toCell: 4, toRow: 5 } }, scrollEvent, gridStub); + plugin.getCellRangeSelector()!.onCellRangeSelected.notify({ range: { fromCell: 2, fromRow: 3, toCell: 4, toRow: 5 } }, scrollEvent, gridStub); expect(setSelectedRangeSpy).not.toHaveBeenCalled(); }); @@ -537,7 +537,7 @@ describe('SlickRowSelectionModel Plugin', () => { plugin.init(gridStub); const scrollEvent = addJQueryEventPropagation(new Event('scroll')); - plugin.getCellRangeSelector().onBeforeCellRangeSelected.notify({ row: 2, cell: 4 }, scrollEvent, gridStub); + plugin.getCellRangeSelector()!.onBeforeCellRangeSelected.notify({ row: 2, cell: 4 }, scrollEvent, gridStub); expect(setActiveCellSpy).toHaveBeenCalledWith(2, 4); }); @@ -549,7 +549,7 @@ describe('SlickRowSelectionModel Plugin', () => { plugin.init(gridStub); const scrollEvent = addJQueryEventPropagation(new Event('scroll')); - plugin.getCellRangeSelector().onBeforeCellRangeSelected.notify({ row: 2, cell: 4 }, scrollEvent, gridStub); + plugin.getCellRangeSelector()!.onBeforeCellRangeSelected.notify({ row: 2, cell: 4 }, scrollEvent, gridStub); expect(setActiveCellSpy).not.toHaveBeenCalled(); }); @@ -562,7 +562,7 @@ describe('SlickRowSelectionModel Plugin', () => { plugin.init(gridStub); const scrollEvent = addJQueryEventPropagation(new Event('scroll')); - plugin.getCellRangeSelector().onBeforeCellRangeSelected.notify({ row: 2, cell: 1 }, scrollEvent, gridStub); + plugin.getCellRangeSelector()!.onBeforeCellRangeSelected.notify({ row: 2, cell: 1 }, scrollEvent, gridStub); expect(setActiveCellSpy).toHaveBeenCalledWith(2, 1); }); @@ -576,7 +576,7 @@ describe('SlickRowSelectionModel Plugin', () => { plugin.init(gridStub); const scrollEvent = addJQueryEventPropagation(new Event('scroll')); - plugin.getCellRangeSelector().onBeforeCellRangeSelected.notify({ row: 2, cell: 0 }, scrollEvent, gridStub); + plugin.getCellRangeSelector()!.onBeforeCellRangeSelected.notify({ row: 2, cell: 0 }, scrollEvent, gridStub); expect(setActiveCellSpy).not.toHaveBeenCalled(); }); diff --git a/packages/common/src/extensions/slickCellSelectionModel.ts b/packages/common/src/extensions/slickCellSelectionModel.ts index fc875c4c3..89e13456e 100644 --- a/packages/common/src/extensions/slickCellSelectionModel.ts +++ b/packages/common/src/extensions/slickCellSelectionModel.ts @@ -79,7 +79,7 @@ export class SlickCellSelectionModel { this._selector?.dispose(); } - getSelectedRanges() { + getSelectedRanges(): CellRange[] { return this._ranges; } diff --git a/packages/common/src/extensions/slickRowSelectionModel.ts b/packages/common/src/extensions/slickRowSelectionModel.ts index 1d24945c0..d3f0c14e2 100644 --- a/packages/common/src/extensions/slickRowSelectionModel.ts +++ b/packages/common/src/extensions/slickRowSelectionModel.ts @@ -102,7 +102,7 @@ export class SlickRowSelectionModel { return this._ranges; } - getSelectedRows() { + getSelectedRows(): number[] { return this.rangesToRows(this._ranges); } @@ -248,7 +248,7 @@ export class SlickRowSelectionModel { return /move|selectAndMove/.test(col); } - protected rangesToRows(ranges: CellRange[]) { + protected rangesToRows(ranges: CellRange[]): number[] { const rows = []; for (let i = 0; i < ranges.length; i++) { for (let j = ranges[i].fromRow; j <= ranges[i].toRow; j++) {