From 7c63f022277fb40805e25f7737fc1fc47ac65a9b Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Mon, 10 Nov 2025 10:00:09 +0000 Subject: [PATCH 1/7] Initial plan From be0a2f16542cfb250a7cd1e3fc832bc6b35059df Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Mon, 10 Nov 2025 10:20:11 +0000 Subject: [PATCH 2/7] Fix toggle directive tests for async behavior Co-authored-by: wnvko <5990334+wnvko@users.noreply.github.com> --- .../toggle/toggle.directive.spec.ts | 31 ++++++++++++------- 1 file changed, 19 insertions(+), 12 deletions(-) diff --git a/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts index 8180148ca75..69f516cb10e 100644 --- a/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.spec.ts @@ -69,8 +69,8 @@ describe('IgxToggle', () => { spyOn(toggle.opening, 'emit'); spyOn(toggle.opened, 'emit'); toggle.open(); - tick(); fixture.detectChanges(); + tick(); expect(toggle.opening.emit).toHaveBeenCalled(); expect(toggle.opened.emit).toHaveBeenCalled(); @@ -127,24 +127,29 @@ describe('IgxToggle', () => { spyOn(toggle.closed, 'emit'); toggle.open(); + fixture.detectChanges(); tick(); expect(toggle.opened.emit).toHaveBeenCalledTimes(1); expect(toggle.collapsed).toBe(false); toggle.close(); + fixture.detectChanges(); tick(); expect(toggle.closed.emit).toHaveBeenCalledTimes(1); expect(toggle.collapsed).toBe(true); toggle.open(); + fixture.detectChanges(); tick(); expect(toggle.opened.emit).toHaveBeenCalledTimes(2); const otherId = overlay.attach(fixture.componentInstance.other); overlay.show(otherId); overlay.hide(otherId); + fixture.detectChanges(); tick(); expect(toggle.closed.emit).toHaveBeenCalledTimes(1); expect(toggle.collapsed).toBe(false); overlay.hideAll(); // as if outside click + fixture.detectChanges(); tick(); expect(toggle.closed.emit).toHaveBeenCalledTimes(2); expect(toggle.collapsed).toBe(true); @@ -170,6 +175,7 @@ describe('IgxToggle', () => { const fixture = TestBed.createComponent(IgxToggleActionTestComponent); fixture.detectChanges(); fixture.componentInstance.toggle.open(); + fixture.detectChanges(); tick(); const divEl = fixture.debugElement.query(By.directive(IgxToggleDirective)).nativeElement; @@ -179,8 +185,8 @@ describe('IgxToggle', () => { button.triggerEventHandler('click', null); - tick(); fixture.detectChanges(); + tick(); expect(divEl.classList.contains(HIDDEN_TOGGLER_CLASS)).toBeTruthy(); })); @@ -195,6 +201,7 @@ describe('IgxToggle', () => { spyOn(toggle.opened, 'emit'); fixture.componentInstance.toggleAction.onClick(); + fixture.detectChanges(); tick(); expect(toggle.opening.emit).toHaveBeenCalled(); expect(toggle.opened.emit).toHaveBeenCalled(); @@ -205,8 +212,8 @@ describe('IgxToggle', () => { spyOn(toggle.closed, 'emit'); p.nativeElement.click(); - tick(); fixture.detectChanges(); + tick(); expect(toggle.closing.emit).toHaveBeenCalled(); expect(toggle.closed.emit).toHaveBeenCalled(); @@ -263,15 +270,15 @@ describe('IgxToggle', () => { spyOn(toggle.closed, 'emit'); button.triggerEventHandler('click', null); - tick(); fix.detectChanges(); + tick(); expect(toggle.opened.emit).toHaveBeenCalled(); expect(toggleElm.classList.contains(TOGGLER_CLASS)).toBe(true); button.triggerEventHandler('click', null); - tick(); fix.detectChanges(); + tick(); expect(toggle.closed.emit).toHaveBeenCalled(); expect(toggleElm.classList.contains(HIDDEN_TOGGLER_CLASS)).toBe(true); @@ -429,15 +436,15 @@ describe('IgxToggle', () => { spyOn(toggle.opening, 'emit'); spyOn(toggle.opened, 'emit'); toggle.open(); - tick(); fixture.detectChanges(); + tick(); expect(toggle.opening.emit).toHaveBeenCalledTimes(1); expect(toggle.opened.emit).toHaveBeenCalledTimes(1); toggle.open(); - tick(); fixture.detectChanges(); + tick(); expect(toggle.opening.emit).toHaveBeenCalledTimes(1); expect(toggle.opened.emit).toHaveBeenCalledTimes(1); @@ -451,8 +458,8 @@ describe('IgxToggle', () => { spyOn(toggle.opening, 'emit'); spyOn(toggle.opened, 'emit'); toggle.open(); - tick(); fixture.detectChanges(); + tick(); expect(toggle.opening.emit).toHaveBeenCalledTimes(1); expect(toggle.opened.emit).toHaveBeenCalledTimes(1); @@ -460,15 +467,15 @@ describe('IgxToggle', () => { spyOn(toggle.closing, 'emit'); spyOn(toggle.closed, 'emit'); toggle.close(); - tick(); fixture.detectChanges(); + tick(); expect(toggle.closing.emit).toHaveBeenCalledTimes(1); expect(toggle.closed.emit).toHaveBeenCalledTimes(1); toggle.close(); - tick(); fixture.detectChanges(); + tick(); expect(toggle.closing.emit).toHaveBeenCalledTimes(1); expect(toggle.closed.emit).toHaveBeenCalledTimes(1); @@ -601,15 +608,15 @@ describe('IgxToggle', () => { const button = fixture.debugElement.query(By.css('button')).nativeElement; button.click(); - tick(); fixture.detectChanges(); + tick(); expect(toggle.opening.emit).toHaveBeenCalledTimes(1); expect(toggle.opened.emit).toHaveBeenCalledTimes(1); document.documentElement.dispatchEvent(new Event('click')); - tick(); fixture.detectChanges(); + tick(); expect(toggle.closing.emit).toHaveBeenCalledTimes(1); expect(toggle.closing.emit).toHaveBeenCalledWith({ id: '0', owner: toggle, cancel: false, event: new Event('click') }); From 44d7ab4c006f32a8cff0d69357fe6cb2b32ad71d Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Mon, 10 Nov 2025 10:39:41 +0000 Subject: [PATCH 3/7] Fix toggle async patterns in test files - add detectChanges before tick/flush Co-authored-by: wnvko <5990334+wnvko@users.noreply.github.com> --- .../src/lib/combo/combo.component.spec.ts | 40 ++++++ .../src/lib/dialog/dialog.component.spec.ts | 15 +++ .../autocomplete.directive.spec.ts | 5 + .../tooltip/tooltip.directive.spec.ts | 61 +++++++++ .../lib/drop-down/drop-down.component.spec.ts | 70 ++++++++++ .../lib/grids/grid/grid-filtering-ui.spec.ts | 36 +++++ .../lib/grids/grid/grid-validation.spec.ts | 1 + .../hierarchical-grid.integration.spec.ts | 1 + .../query-builder.component.spec.ts | 9 ++ .../src/lib/select/select.component.spec.ts | 127 ++++++++++++++++++ .../src/lib/services/overlay/overlay.spec.ts | 14 ++ .../simple-combo.component.spec.ts | 21 +++ .../time-picker/time-picker.component.spec.ts | 42 ++++++ 13 files changed, 442 insertions(+) diff --git a/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts b/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts index 5345bc34424..cab4ccb9c8f 100644 --- a/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts +++ b/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts @@ -1064,6 +1064,7 @@ describe('igxCombo', () => { expect(dropdown.nativeElement.getAttribute('aria-labelledby')).toEqual(combo.placeholder); combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1077,6 +1078,7 @@ describe('igxCombo', () => { expect(list.nativeElement.getAttribute('aria-activedescendant')).toEqual(null); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', list); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(list.nativeElement.getAttribute('aria-activedescendant')).toEqual(combo.dropdown.focusedItem.id); @@ -1088,10 +1090,12 @@ describe('igxCombo', () => { it('should render aria-expanded attribute properly', fakeAsync(() => { expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('false'); combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('true'); combo.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('false'); @@ -1126,6 +1130,7 @@ describe('igxCombo', () => { fixture.componentInstance.size = "large"; fixture.detectChanges(); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DROPDOWNLISTITEM}`)); @@ -1242,6 +1247,7 @@ describe('igxCombo', () => { }); it('should focus search input', fakeAsync(() => { combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(document.activeElement).toEqual(combo.searchInput.nativeElement); @@ -1249,6 +1255,7 @@ describe('igxCombo', () => { it('should not focus search input, when autoFocusSearch=false', fakeAsync(() => { combo.autoFocusSearch = false; combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(document.activeElement).not.toEqual(combo.searchInput.nativeElement); @@ -1345,6 +1352,7 @@ describe('igxCombo', () => { expect(containerElementWidth).toEqual(wrapperWidth); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const inputElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_INPUTGROUP_WRAPPER}`)).nativeElement; @@ -1370,6 +1378,7 @@ describe('igxCombo', () => { expect(wrapperWidth).toEqual(comboWidth); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1385,6 +1394,7 @@ describe('igxCombo', () => { expect(inputWidth).toEqual(comboWidth); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1393,6 +1403,7 @@ describe('igxCombo', () => { fixture.detectChanges(); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1668,6 +1679,7 @@ describe('igxCombo', () => { expect(dropdown.focusedItem).toEqual(null); expect(combo.collapsed).toBeTruthy(); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(document.activeElement).toEqual(combo.searchInput.nativeElement); @@ -1784,6 +1796,7 @@ describe('igxCombo', () => { }); it('should properly handle dropdown.focusItem', fakeAsync(() => { combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const virtualSpyUP = spyOn(dropdown, 'navigatePrev'); @@ -1802,6 +1815,7 @@ describe('igxCombo', () => { })); it('should handle keyboard events', fakeAsync(() => { combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); spyOn(combo, 'selectAllItems'); @@ -1825,6 +1839,7 @@ describe('igxCombo', () => { it('should toggle combo dropdown on toggle button click', fakeAsync(() => { spyOn(combo, 'toggle').and.callThrough(); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toEqual(false); @@ -1832,6 +1847,7 @@ describe('igxCombo', () => { expect(document.activeElement).toEqual(combo.searchInput.nativeElement); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toEqual(true); @@ -1950,6 +1966,7 @@ describe('igxCombo', () => { const dropdownContent = fixture.debugElement.query(By.css(`.${CSS_CLASS_CONTENT}`)); UIInteractions.triggerEventHandlerKeyDown('Tab', dropdownContent); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toBeTruthy(); @@ -2288,12 +2305,14 @@ describe('igxCombo', () => { const toggleBtn = fixture.debugElement.query(By.css(`.${CSS_CLASS_TOGGLEBUTTON}`)); UIInteractions.triggerEventHandlerKeyDown('Enter', toggleBtn); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.toggle).toHaveBeenCalledTimes(1); expect(combo.collapsed).toEqual(false); UIInteractions.triggerEventHandlerKeyDown('Enter', toggleBtn); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.toggle).toHaveBeenCalledTimes(2); @@ -2454,6 +2473,7 @@ describe('igxCombo', () => { const dropdown = combo.dropdown; dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const dropdownContent = fixture.debugElement.query(By.css(`.${CSS_CLASS_CONTENT}`)); @@ -2468,9 +2488,11 @@ describe('igxCombo', () => { tick(); fixture.detectChanges(); UIInteractions.triggerEventHandlerKeyDown('Space', dropdownContent); + fixture.detectChanges(); tick(); fixture.detectChanges(); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); combo.onBlur(); @@ -2603,6 +2625,7 @@ describe('igxCombo', () => { }); it('should group items correctly', fakeAsync(() => { combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.groupKey).toEqual('region'); @@ -2621,6 +2644,7 @@ describe('igxCombo', () => { it('should properly handle click events on disabled/header items', fakeAsync(() => { spyOn(combo.dropdown, 'selectItem').and.callThrough(); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toBeFalsy(); @@ -2976,6 +3000,7 @@ describe('igxCombo', () => { expect(dropdownItems.length).toEqual(3); UIInteractions.triggerEventHandlerKeyUp('Escape', searchInput); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toBeTruthy(); @@ -3105,6 +3130,7 @@ describe('igxCombo', () => { }); it('should enable/disable filtering at runtime', fakeAsync(() => { combo.open(); // Open combo - all data items are in filteredData + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); @@ -3112,16 +3138,19 @@ describe('igxCombo', () => { const searchInput = fixture.debugElement.query(By.css(CSS_CLASS_SEARCHINPUT)); searchInput.nativeElement.value = 'Not-available item'; searchInput.triggerEventHandler('input', { target: searchInput.nativeElement }); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toEqual(0); // No items are available because of filtering combo.close(); // Filter is cleared on close + fixture.detectChanges(); tick(); fixture.detectChanges(); combo.disableFiltering = true; // Filtering is disabled fixture.detectChanges(); combo.open(); // All items are visible since filtering is disabled + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); // All items are visible since filtering is disabled @@ -3132,11 +3161,13 @@ describe('igxCombo', () => { expect(combo.dropdown.items.length).toBeGreaterThan(0); // All items are visible since filtering is disabled combo.close(); // Filter is cleared on close + fixture.detectChanges(); tick(); fixture.detectChanges(); combo.disableFiltering = false; // Filtering is re-enabled fixture.detectChanges(); combo.open(); // Filter is cleared on open + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); @@ -3188,6 +3219,7 @@ describe('igxCombo', () => { }); it('Should filter the data when custom filterFunction is provided', fakeAsync(() => { combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); @@ -3198,6 +3230,7 @@ describe('igxCombo', () => { expect(combo.dropdown.items.length).toEqual(0); combo.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); combo.filteringOptions = { caseSensitive: false, filteringKey: combo.groupKey }; @@ -3210,6 +3243,7 @@ describe('igxCombo', () => { i[filteringOptions.filteringKey]?.toString().toLowerCase().includes(searchTerm)) } combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); @@ -3226,6 +3260,7 @@ describe('igxCombo', () => { })); it('Should update filtering when custom filterFunction is provided and filteringOptions.caseSensitive is changed', fakeAsync(() => { combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); @@ -3236,6 +3271,7 @@ describe('igxCombo', () => { expect(combo.dropdown.items.length).toEqual(0); combo.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); combo.filteringOptions = { caseSensitive: false, filteringKey: combo.groupKey }; @@ -3248,6 +3284,7 @@ describe('igxCombo', () => { i[filteringOptions.filteringKey]?.toString().toLowerCase().includes(searchTerm)) } combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); @@ -3263,6 +3300,7 @@ describe('igxCombo', () => { })); it('Should update filtering when custom filteringOptions are provided', fakeAsync(() => { combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); @@ -3273,10 +3311,12 @@ describe('igxCombo', () => { expect(combo.dropdown.items.length).toEqual(0); combo.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); combo.filteringOptions = { caseSensitive: false, filteringKey: combo.groupKey }; combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.dropdown.items.length).toBeGreaterThan(0); diff --git a/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts b/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts index 8b32c55e33c..e183d893cb2 100644 --- a/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts +++ b/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts @@ -153,6 +153,7 @@ describe('Dialog', () => { expect(dialog.isOpen).toEqual(true); dialog.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dialog.isOpen).toEqual(false); @@ -219,6 +220,7 @@ describe('Dialog', () => { expect(dialog.isOpen).toEqual(true); dialog.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dialog.isOpen).toEqual(false); @@ -229,11 +231,13 @@ describe('Dialog', () => { fixture.detectChanges(); const dialog = fixture.componentInstance.dialog; dialog.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const dialogElem = fixture.debugElement.query(By.css('.igx-dialog')).nativeElement; dialogElem.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -241,10 +245,12 @@ describe('Dialog', () => { dialog.closeOnOutsideSelect = false; dialog.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); dialogElem.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dialog.isOpen).toEqual(true); @@ -270,6 +276,7 @@ describe('Dialog', () => { spyOn(dialog.closed, 'emit'); dialog.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -278,6 +285,7 @@ describe('Dialog', () => { // expect(dialog.onOpened.emit).toHaveBeenCalled(); dialog.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -287,6 +295,7 @@ describe('Dialog', () => { expect(dialog.isOpenChange.emit).toHaveBeenCalledWith(false); dialog.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const buttons = document.querySelectorAll('button'); @@ -330,9 +339,11 @@ describe('Dialog', () => { const childDialog = fixture.componentInstance.child; mainDialog.open(); + fixture.detectChanges(); tick(); childDialog.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -341,6 +352,7 @@ describe('Dialog', () => { const childDialogElem = dialogs[1].nativeElement; childDialogElem.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -348,6 +360,7 @@ describe('Dialog', () => { expect(childDialog.isOpen).toEqual(false); maindDialogElem.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -387,6 +400,7 @@ describe('Dialog', () => { const dialog = fix.componentInstance.dialog; dialog.open(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -396,6 +410,7 @@ describe('Dialog', () => { expect(overlayWrapper.classList.contains(OVERLAY_MODAL_WRAPPER_CLASS)).toBe(false); dialog.close(); + fix.detectChanges(); tick(); fix.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts index 882f7c6ac61..aba89e2fbcf 100644 --- a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts @@ -65,11 +65,13 @@ describe('IgxAutocomplete', () => { expect(dropDown.collapsed).toBeTruthy(); autocomplete.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropDown.collapsed).toBeFalsy(); autocomplete.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropDown.collapsed).toBeTruthy(); @@ -180,11 +182,13 @@ describe('IgxAutocomplete', () => { expect(dropDown.collapsed).toBeFalsy(); input.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropDown.collapsed).toBeFalsy(); group.element.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropDown.collapsed).toBeFalsy(); @@ -766,6 +770,7 @@ describe('IgxAutocomplete', () => { expect(input.nativeElement.attributes['aria-expanded'].value).toEqual('true'); expect(input.nativeElement.attributes['aria-activedescendant'].value).toEqual(dropDown.focusedItem.id); autocomplete.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(input.nativeElement.attributes['aria-expanded'].value).toEqual('false'); diff --git a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts index 1cd84369e48..3e34abd8ecf 100644 --- a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts @@ -75,11 +75,13 @@ describe('IgxTooltip', () => { it('IgxTooltip is shown/hidden when hovering/unhovering its target', fakeAsync(() => { hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); unhoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -89,6 +91,7 @@ describe('IgxTooltip', () => { expect(tooltipTarget.hasArrow).toBeFalse(); hoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -105,6 +108,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -120,6 +124,7 @@ describe('IgxTooltip', () => { it('show target tooltip when hovering its target and ignore [tooltip] input', fakeAsync(() => { hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -128,6 +133,7 @@ describe('IgxTooltip', () => { it('verify tooltip default position', fakeAsync(() => { hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipPosition(tooltipNativeElement, button); })); @@ -137,6 +143,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -144,6 +151,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); })); @@ -169,6 +177,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(button); + fix.detectChanges(); flush(); unhoverElement(button); @@ -219,10 +228,12 @@ describe('IgxTooltip', () => { it('IgxTooltip respects the passed overlaySettings', fakeAsync(() => { // Hover the button. hoverElement(button); + fixture.detectChanges(); flush(); // Verify default position of the tooltip. verifyTooltipPosition(tooltipNativeElement, button); unhoverElement(button); + fixture.detectChanges(); flush(); // Use custom overlaySettings. @@ -239,6 +250,7 @@ describe('IgxTooltip', () => { // Hover the button again. hoverElement(button); + fix.detectChanges(); flush(); // Verify that the position of the tooltip is changed. verifyTooltipPosition(tooltipNativeElement, button, false); @@ -247,11 +259,13 @@ describe('IgxTooltip', () => { expect(Math.abs(tooltipRect.top - targetRect.bottom) <= 0.5).toBe(true); expect(Math.abs(tooltipRect.left - targetRect.right) <= 0.5).toBe(true); unhoverElement(button); + fixture.detectChanges(); flush(); })); it('IgxTooltip closes when the target is clicked', fakeAsync(() => { hoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -290,6 +304,7 @@ describe('IgxTooltip', () => { it('IgxTooltip is hidden when its target is destroyed', fakeAsync(() => { hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -368,6 +383,7 @@ describe('IgxTooltip', () => { fix.componentInstance.cancelShowing = true; hoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -377,9 +393,11 @@ describe('IgxTooltip', () => { fix.componentInstance.cancelHiding = true; hoverElement(button); + fixture.detectChanges(); flush(); unhoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -410,12 +428,14 @@ describe('IgxTooltip', () => { describe('Tooltip touch', () => { it('IgxTooltip is shown/hidden when touching/untouching its target', fakeAsync(() => { touchElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -426,6 +446,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); touchElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -433,6 +454,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); touchElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); })); @@ -458,6 +480,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); touchElement(button); + fix.detectChanges(); flush(); const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); @@ -486,17 +509,20 @@ describe('IgxTooltip', () => { it('IgxTooltip is initially hidden', fakeAsync(() => { unhoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); it('IgxTooltip is shown/hidden when hovering/unhovering its target', fakeAsync(() => { hoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); unhoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -504,6 +530,7 @@ describe('IgxTooltip', () => { it('Should respect default max-width constraint for plain string tooltip', fakeAsync(() => { hoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -524,6 +551,7 @@ describe('IgxTooltip', () => { it('Should not have max-width constraint for custom content tooltip', fakeAsync(() => { hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -551,6 +579,7 @@ describe('IgxTooltip', () => { it('Same tooltip shows on different targets depending on which target is hovered', fakeAsync(() => { hoverElement(buttonOne); + fix.detectChanges(); flush(); // Tooltip is positioned relative to buttonOne and NOT relative to buttonTwo @@ -559,8 +588,10 @@ describe('IgxTooltip', () => { verifyTooltipPosition(tooltipNativeElement, buttonTwo, false); unhoverElement(buttonOne); + fixture.detectChanges(); flush(); hoverElement(buttonTwo); + fixture.detectChanges(); flush(); // Tooltip is positioned relative to buttonTwo and NOT relative to buttonOne @@ -574,6 +605,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(buttonOne); + fix.detectChanges(); flush(); unhoverElement(buttonOne); @@ -628,6 +660,7 @@ describe('IgxTooltip', () => { tick(100); hoverElement(buttonTwo); + fixture.detectChanges(); flush(); // Tooltip is visible and positioned relative to buttonTwo @@ -646,6 +679,7 @@ describe('IgxTooltip', () => { const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); + fixture.detectChanges(); flush(); expect(targetOne['_hideOnInteraction']).toHaveBeenCalledTimes(1); @@ -657,6 +691,7 @@ describe('IgxTooltip', () => { spyOn(targetTwo.tooltipHide, 'emit'); hoverElement(buttonOne); + fixture.detectChanges(); flush(); const tooltipHideArgsTargetOne = { target: targetOne, tooltip: fix.componentInstance.tooltip, cancel: false }; @@ -669,6 +704,7 @@ describe('IgxTooltip', () => { flush(); hoverElement(buttonTwo); + fixture.detectChanges(); flush(); unhoverElement(buttonTwo); @@ -681,16 +717,19 @@ describe('IgxTooltip', () => { it('IgxTooltip hides when touch one target, then another, then outside', fakeAsync(() => { touchElement(targetOne); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, targetOne, true); verifyTooltipPosition(tooltipNativeElement, targetOne, true); touchElement(targetTwo); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, targetTwo, true); verifyTooltipPosition(tooltipNativeElement, targetTwo, true); touchElement(fix.debugElement); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, targetTwo, false); })); @@ -699,6 +738,7 @@ describe('IgxTooltip', () => { targetOne.sticky = true; fix.detectChanges(); hoverElement(buttonOne); + fix.detectChanges(); flush(); let closeBtn = tooltipNativeElement.querySelector('igx-tooltip-close-button'); @@ -708,6 +748,7 @@ describe('IgxTooltip', () => { targetTwo.sticky = false; fix.detectChanges(); hoverElement(buttonTwo); + fix.detectChanges(); flush(); // It should still show tooltip for targetOne @@ -720,6 +761,7 @@ describe('IgxTooltip', () => { flush(); hoverElement(buttonTwo); + fix.detectChanges(); flush(); expect(tooltipNativeElement.querySelector('igx-tooltip-close-button')).toBeNull(); @@ -735,6 +777,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(buttonOne); + fix.detectChanges(); flush(); const customClose = tooltipNativeElement.querySelector('.my-close-btn'); @@ -747,6 +790,7 @@ describe('IgxTooltip', () => { flush(); hoverElement(buttonTwo); + fix.detectChanges(); flush(); expect(tooltipNativeElement.querySelector('.my-close-btn')).toBeNull(); @@ -761,6 +805,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(buttonOne); + fix.detectChanges(); flush(); // Tooltip should be shown for targetOne with custom close button and correct role @@ -795,6 +840,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(buttonOne); + fix.detectChanges(); flush(); fix.detectChanges(); @@ -855,6 +901,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(buttonOne); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, targetOne, true); @@ -862,9 +909,11 @@ describe('IgxTooltip', () => { expect(arrow.style.display).toEqual(''); unhoverElement(buttonOne); + fix.detectChanges(); flush(); hoverElement(buttonTwo); + fixture.detectChanges(); flush(); arrow = tooltipNativeElement.querySelector(TOOLTIP_ARROW_SELECTOR) as HTMLElement; @@ -896,6 +945,7 @@ describe('IgxTooltip', () => { const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); + fixture.detectChanges(); flush(); expect(tooltipOne['onDocumentTouchStart']).toHaveBeenCalledTimes(1); @@ -917,6 +967,7 @@ describe('IgxTooltip', () => { expect(fix.componentInstance.toggleDir.collapsed).toBe(true); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -945,6 +996,7 @@ describe('IgxTooltip', () => { it('should render custom close button when sticky is true', fakeAsync(() => { hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, button, true); @@ -958,6 +1010,7 @@ describe('IgxTooltip', () => { tick(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -968,6 +1021,7 @@ describe('IgxTooltip', () => { it('should hide the tooltip custom close button is clicked', fakeAsync(() => { hoverElement(button); + fixture.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -986,6 +1040,7 @@ describe('IgxTooltip', () => { tick(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -996,6 +1051,7 @@ describe('IgxTooltip', () => { it('should update the DOM role attribute correctly when sticky changes', fakeAsync(() => { hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -1012,6 +1068,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -1031,6 +1088,7 @@ describe('IgxTooltip', () => { tooltipTarget.sticky = true; fix.detectChanges(); touchElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -1062,6 +1120,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -1077,6 +1136,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -1090,6 +1150,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(button); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); diff --git a/projects/igniteui-angular/src/lib/drop-down/drop-down.component.spec.ts b/projects/igniteui-angular/src/lib/drop-down/drop-down.component.spec.ts index 929857abe5d..6fba38a3e12 100644 --- a/projects/igniteui-angular/src/lib/drop-down/drop-down.component.spec.ts +++ b/projects/igniteui-angular/src/lib/drop-down/drop-down.component.spec.ts @@ -202,6 +202,7 @@ describe('IgxDropDown ', () => { expect(dropdown.collapsed).toBeTruthy(); dropdown.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.collapsed).toBeFalsy(); @@ -209,6 +210,7 @@ describe('IgxDropDown ', () => { expect(dropdown.onToggleOpened).toHaveBeenCalledTimes(1); dropdown.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.collapsed).toBeTruthy(); @@ -220,6 +222,7 @@ describe('IgxDropDown ', () => { spyOn(dropdown.opened, 'emit').and.callThrough(); dropdown.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -227,6 +230,7 @@ describe('IgxDropDown ', () => { expect(dropdown.opened.emit).toHaveBeenCalledTimes(1); dropdown.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -293,6 +297,7 @@ describe('IgxDropDown ', () => { dropdown.closing.pipe(take(1)).subscribe((e: CancelableEventArgs) => e.cancel = true); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -300,6 +305,7 @@ describe('IgxDropDown ', () => { expect(dropdown.opened.emit).toHaveBeenCalledTimes(1); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -313,6 +319,7 @@ describe('IgxDropDown ', () => { dropdown.opening.pipe(take(1)).subscribe((e: CancelableEventArgs) => e.cancel = true); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(1); @@ -320,6 +327,7 @@ describe('IgxDropDown ', () => { })); it('should select item by SPACE/ENTER keys', fakeAsync(() => { dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); @@ -328,6 +336,7 @@ describe('IgxDropDown ', () => { let dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); @@ -336,27 +345,32 @@ describe('IgxDropDown ', () => { expect(dropdown.selectedItem).toBeFalsy(); UIInteractions.triggerEventHandlerKeyDown('Space', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.selectedItem).toEqual(dropdown.items[1]); expect(dropdown.collapsed).toEqual(true); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); UIInteractions.triggerEventHandlerKeyDown('Enter', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.collapsed).toEqual(true); expect(dropdown.selectedItem).toEqual(dropdown.items[2]); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.collapsed).toEqual(false); @@ -369,6 +383,7 @@ describe('IgxDropDown ', () => { spyOn(dropdown.closed, 'emit').and.callThrough(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); @@ -382,6 +397,7 @@ describe('IgxDropDown ', () => { expect(focusedItem.componentInstance.itemIndex).toEqual(1); UIInteractions.triggerEventHandlerKeyDown('Escape', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.collapsed).toEqual(true); @@ -393,28 +409,33 @@ describe('IgxDropDown ', () => { })); it('should navigate through items using Up/Down/Home/End keys', fakeAsync(() => { dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); dropdownElement.triggerEventHandler('keydown', UIInteractions.getKeyboardEvent('keydown', 'ArrowDown')); + fixture.detectChanges(); tick(); fixture.detectChanges(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(1); UIInteractions.triggerEventHandlerKeyDown('End', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(14); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(13); UIInteractions.triggerEventHandlerKeyDown('Home', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); @@ -422,6 +443,7 @@ describe('IgxDropDown ', () => { })); it('should not change selection when setting it to non-existing item', fakeAsync(() => { dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); dropdown.setSelectedItem(0); @@ -463,6 +485,7 @@ describe('IgxDropDown ', () => { dropdown.items[10].selected = true; fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -470,6 +493,7 @@ describe('IgxDropDown ', () => { expect(selectedItem.componentInstance.itemIndex).toEqual(10); const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); UIInteractions.triggerEventHandlerKeyDown('Home', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[1].focused).toBeTruthy(); @@ -478,6 +502,7 @@ describe('IgxDropDown ', () => { })); it('should set isSelected via igxDropDownIteComponent', fakeAsync(() => { dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.selectedItem).toBeNull(); @@ -497,6 +522,7 @@ describe('IgxDropDown ', () => { expect(dropdown.selectedItem.itemIndex).toEqual(1); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.selectedItem.itemIndex).toEqual(1); @@ -510,6 +536,7 @@ describe('IgxDropDown ', () => { dropdown.items[10].isHeader = true; fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -537,6 +564,7 @@ describe('IgxDropDown ', () => { expect(dropdown.selectedItem.itemIndex).toEqual(2); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.selectedItem.itemIndex).toEqual(2); @@ -545,6 +573,7 @@ describe('IgxDropDown ', () => { spyOn(dropdown.selectionChanging, 'emit').and.callThrough(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -576,6 +605,7 @@ describe('IgxDropDown ', () => { const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); @@ -587,6 +617,7 @@ describe('IgxDropDown ', () => { }); UIInteractions.triggerEventHandlerKeyDown('escape', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(1); @@ -595,6 +626,7 @@ describe('IgxDropDown ', () => { expect((eventArgs.event as KeyboardEvent).key).toEqual('escape'); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); @@ -605,6 +637,7 @@ describe('IgxDropDown ', () => { }); UIInteractions.triggerEventHandlerKeyDown('enter', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(2); @@ -615,6 +648,7 @@ describe('IgxDropDown ', () => { it('should be able to change selection when manipulating ISelectionEventArgs', fakeAsync(() => { expect(dropdown.selectedItem).toEqual(null); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -637,6 +671,7 @@ describe('IgxDropDown ', () => { // Set header - error dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -658,12 +693,14 @@ describe('IgxDropDown ', () => { })); it('should not take focus when allowItemsFocus is set to false', fakeAsync(() => { dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const focusedItem = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`))[0].nativeElement; expect(document.activeElement).toEqual(focusedItem); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -674,6 +711,7 @@ describe('IgxDropDown ', () => { const button = fixture.debugElement.query(By.css('button')).nativeElement; button.focus(); button.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(document.activeElement).toEqual(button); @@ -684,6 +722,7 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const currentItem = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DISABLED}`))[0]; @@ -709,6 +748,7 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); let disabledItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DISABLED}`)); @@ -731,6 +771,7 @@ describe('IgxDropDown ', () => { dropdown.items[12].disabled = true; fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -739,6 +780,7 @@ describe('IgxDropDown ', () => { const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); UIInteractions.triggerEventHandlerKeyDown('End', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[11].focused).toBeTruthy(); @@ -746,6 +788,7 @@ describe('IgxDropDown ', () => { expect(focusedItem.componentInstance.itemIndex).toEqual(11); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[11].focused).toBeTruthy(); @@ -762,11 +805,13 @@ describe('IgxDropDown ', () => { dropdown.items[12].disabled = true; fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[11].focused).toBeTruthy(); @@ -774,6 +819,7 @@ describe('IgxDropDown ', () => { expect(focusedItem.componentInstance.itemIndex).toEqual(11); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[10].focused).toBeTruthy(); @@ -781,6 +827,7 @@ describe('IgxDropDown ', () => { expect(focusedItem.componentInstance.itemIndex).toEqual(10); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[8].focused).toBeTruthy(); @@ -788,6 +835,7 @@ describe('IgxDropDown ', () => { expect(focusedItem.componentInstance.itemIndex).toEqual(8); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', dropdownElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[7].focused).toBeTruthy(); @@ -801,6 +849,7 @@ describe('IgxDropDown ', () => { dropdown.setSelectedItem(0); fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[0].selected).toBeTruthy(); @@ -814,6 +863,7 @@ describe('IgxDropDown ', () => { dropdown.items[10].selected = true; fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items[10].focused).toEqual(true); @@ -877,6 +927,7 @@ describe('IgxDropDown ', () => { expect(dropdown.collapsed).toEqual(true); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.collapsed).toEqual(true); @@ -884,6 +935,7 @@ describe('IgxDropDown ', () => { expect(dropdown.focusedItem).toEqual(null); UIInteractions.triggerEventHandlerKeyDown('Enter', input); + fixture.detectChanges(); tick(); fixture.detectChanges(); // does not attempt to select item on keydown if DD is closed; @@ -892,6 +944,7 @@ describe('IgxDropDown ', () => { expect(dropdown.collapsed).toEqual(true); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.collapsed).toEqual(false); @@ -899,6 +952,7 @@ describe('IgxDropDown ', () => { const dropdownItem = dropdown.items[0]; input.triggerEventHandler('keydown', UIInteractions.getKeyboardEvent('keydown', 'Enter')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.selectItem).toHaveBeenCalledTimes(1); @@ -1081,6 +1135,7 @@ describe('IgxDropDown ', () => { }); it('should update aria-activedescendant to the id of the focused item', fakeAsync(() => { dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1093,13 +1148,16 @@ describe('IgxDropDown ', () => { expect(dropdownElement.getAttribute('aria-activedescendant')).toBe(focusedItemId); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`))); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1187,6 +1245,7 @@ describe('IgxDropDown ', () => { }); it('should apply selected item class', fakeAsync(() => { dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const selectedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_ITEM}`)); @@ -1220,12 +1279,14 @@ describe('IgxDropDown ', () => { }); it('should return items/headers property correctly', fakeAsync(() => { dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items.length).toEqual(15); expect(dropdown.headers).toEqual([]); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); dropdown.items[0].disabled = true; @@ -1236,6 +1297,7 @@ describe('IgxDropDown ', () => { dropdown.items[10].isHeader = true; fixture.detectChanges(); dropdown.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.items.length).toEqual(12); @@ -1304,36 +1366,42 @@ describe('IgxDropDown ', () => { spyOn(dropdown.closing, 'emit').and.callThrough(); spyOn(dropdown.closed, 'emit').and.callThrough(); tabs.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(1); expect(dropdown.opened.emit).toHaveBeenCalledTimes(1); let dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`)); dropdownItems[2].triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(1); expect(dropdown.closed.emit).toHaveBeenCalledTimes(1); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(2); expect(dropdown.opened.emit).toHaveBeenCalledTimes(2); dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`)); dropdownItems[1].triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(2); expect(dropdown.closed.emit).toHaveBeenCalledTimes(2); img.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(3); expect(dropdown.opened.emit).toHaveBeenCalledTimes(3); dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`)); dropdownItems[0].triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(3); @@ -1354,9 +1422,11 @@ describe('IgxDropDown ', () => { expect(dropdownRect.top).toBe(inputRect.bottom); dropdown.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); dropdown.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts index 1841cfe1279..be341a61500 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts @@ -358,6 +358,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { GridFunctions.openFilterDDAndSelectCondition(fix, 0); input.triggerEventHandler('click', null); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -371,6 +372,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { flush(); fix.detectChanges(); input.triggerEventHandler('change', null); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -381,6 +383,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { pending('This should be tested in the e2e test'); const filteringCells = fix.debugElement.queryAll(By.css(FILTER_UI_CELL)); filteringCells[4].query(By.css('igx-chip')).nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); const filterUIRow = fix.debugElement.query(By.css(FILTER_UI_ROW)); @@ -388,10 +391,12 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { const input = filterUIRow.query(By.directive(IgxInputDirective)); filterIcon.nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); input.nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -421,6 +426,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { pending('This should be tested in the e2e test'); const filteringCells = fix.debugElement.queryAll(By.css(FILTER_UI_CELL)); filteringCells[4].query(By.css('igx-chip')).nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); const filterUIRow = fix.debugElement.query(By.css(FILTER_UI_ROW)); @@ -428,10 +434,12 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { const input = filterUIRow.query(By.directive(IgxInputDirective)); filterIcon.nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); input.nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -1275,6 +1283,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { const filteringRow = fix.debugElement.query(By.directive(IgxGridFilteringRowComponent)); const datePicker = filteringRow.query(By.directive(IgxDatePickerComponent)); datePicker.componentInstance.getEditElement().click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -2230,6 +2239,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { // Equals condition datePicker.triggerEventHandler('click', null); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -2684,6 +2694,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { fix.detectChanges(); tBodyContent.triggerEventHandler('focus', null); + fix.detectChanges(); tick(); expect(console.error).not.toHaveBeenCalled(); })); @@ -2955,6 +2966,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { GridFunctions.openFilterDDAndSelectCondition(fix, 0); datePicker.triggerEventHandler('click', null); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -2968,6 +2980,7 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { flush(); fix.detectChanges(); input.triggerEventHandler('change', null); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -3324,6 +3337,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const moveRight = GridFunctions.getExcelStyleFilteringMoveButtons(fix)[1]; moveLeft.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -3331,6 +3345,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { expect(grid.columns[1].field).toBe('Downloads'); moveLeft.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -3339,6 +3354,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { ControlsFunction.verifyButtonIsDisabled(moveLeft); moveRight.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -3784,10 +3800,12 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const checkbox = GridFunctions.getExcelStyleFilteringCheckboxes(fix); checkbox[0].click(); + fix.detectChanges(); tick(); fix.detectChanges(); checkbox[2].click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -4499,11 +4517,13 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const checkbox = GridFunctions.getExcelStyleFilteringCheckboxes(fix, excelMenu); checkbox[0].click(); // Select All + fix.detectChanges(); tick(); fix.detectChanges(); checkbox[2].click(); // Ignite UI for Angular checkbox[3].click(); // Ignite UI for JavaScript + fix.detectChanges(); tick(); fix.detectChanges(); @@ -4527,12 +4547,14 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const checkbox = GridFunctions.getExcelStyleFilteringCheckboxes(fix, excelMenu); checkbox[0].click(); // Select All + fix.detectChanges(); tick(); fix.detectChanges(); checkbox[2].click(); // Ignite UI for Angular checkbox[3].click(); // Ignite UI for JavaScript checkbox[4].click(); // NetAdvantage + fix.detectChanges(); tick(); fix.detectChanges(); @@ -4556,6 +4578,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const checkbox = GridFunctions.getExcelStyleFilteringCheckboxes(fix, excelMenu); checkbox[0].click(); // Select All + fix.detectChanges(); tick(); fix.detectChanges(); @@ -4563,6 +4586,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkbox[3].click(); checkbox[4].click(); checkbox[6].click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -4578,12 +4602,14 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const checkbox = GridFunctions.getExcelStyleFilteringCheckboxes(fix, excelMenu); checkbox[0].click(); // Select All + fix.detectChanges(); tick(); fix.detectChanges(); checkbox[1].click(); // (Blanks) checkbox[2].click(); // Ignite UI for Angular checkbox[3].click(); // Ignite UI for JavaScript + fix.detectChanges(); tick(); fix.detectChanges(); @@ -5587,6 +5613,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const checkbox = GridFunctions.getExcelStyleFilteringCheckboxes(fix, excelMenu)[1]; checkbox.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -6092,10 +6119,12 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { fix.detectChanges(); checkboxes[0].click(); + fix.detectChanges(); tick(); fix.detectChanges(); checkboxes[2].click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -6288,12 +6317,14 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const expressions = GridFunctions.getExcelCustomFilteringDateExpressions(fix); const lastExpression = expressions[expressions.length - 1]; (lastExpression.querySelector('igx-select').querySelector('igx-input-group') as HTMLElement).click(); + fix.detectChanges(); tick(); fix.detectChanges(); const dropdownList = fix.debugElement.query(By.css('div.igx-drop-down__list.igx-toggle')); const todayItem = dropdownList.children[0].children.find(item => item.nativeElement?.innerText === 'Today'); todayItem.nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -6439,6 +6470,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const moveRight = GridFunctions.getExcelStyleFilteringMoveButtons(fix)[1]; moveLeft.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -6446,6 +6478,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { expect(grid.columns[1].field).toBe('Downloads'); moveLeft.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -6454,6 +6487,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { ControlsFunction.verifyButtonIsDisabled(moveLeft); moveRight.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -6848,6 +6882,7 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { const checkboxElements = GridFunctions.getExcelStyleFilteringCheckboxes(fix); checkboxElements[2].click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -7548,6 +7583,7 @@ const closeChipFromFilteringUIRow = (fix, grid, columnName, index) => { GridFunctions.openFilterDDAndSelectCondition(fix, index); close.triggerEventHandler('click', null); + fix.detectChanges(); tick(); fix.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts index 9b660e56674..c79470814cf 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts @@ -220,6 +220,7 @@ describe('IgxGrid - Validation #grid', () => { expect(positionSettings.closeAnimation.options.params).toEqual({ duration: '75ms' }); cell.errorTooltip.first.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(cell.errorTooltip.first.collapsed).toBeTrue(); diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.integration.spec.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.integration.spec.ts index 9b0937c4fcc..ffa5822baa7 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.integration.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.integration.spec.ts @@ -759,6 +759,7 @@ describe('IgxHierarchicalGrid Integration #hGrid', () => { expect(hidingUI).toBeDefined(); hidingUI.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.spec.ts b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.spec.ts index bca74571c50..248b0108b4b 100644 --- a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.spec.ts +++ b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.spec.ts @@ -200,6 +200,7 @@ describe('IgxQueryBuilder', () => { const buttonsContainer = Array.from(group.querySelectorAll('.igx-filter-tree__buttons'))[1]; const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[0] as HTMLElement).click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -237,6 +238,7 @@ describe('IgxQueryBuilder', () => { const buttonsContainer = Array.from(group.querySelectorAll('.igx-filter-tree__buttons'))[1]; const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[1] as HTMLElement).click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -296,6 +298,7 @@ describe('IgxQueryBuilder', () => { const buttonsContainer = Array.from(group.querySelectorAll('.igx-filter-tree__buttons'))[1]; const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[1] as HTMLElement).click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -1662,6 +1665,7 @@ describe('IgxQueryBuilder', () => { //cancel edit closeBtn.click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -1742,6 +1746,7 @@ describe('IgxQueryBuilder', () => { const buttonsContainer = Array.from(group.querySelectorAll('.igx-filter-tree__buttons'))[1]; const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[0] as HTMLElement).click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -1773,6 +1778,7 @@ describe('IgxQueryBuilder', () => { const buttonsContainer = Array.from(group.querySelectorAll('.igx-filter-tree__buttons'))[1]; const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[0] as HTMLElement).click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -1799,6 +1805,7 @@ describe('IgxQueryBuilder', () => { const buttonsContainer = Array.from(group.querySelectorAll('.igx-filter-tree__buttons'))[1]; const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[0] as HTMLElement).click(); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -2403,6 +2410,7 @@ describe('IgxQueryBuilder', () => { // Open the combo (combo.querySelector('igx-input-group') as HTMLElement).click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); // Select item @@ -2411,6 +2419,7 @@ describe('IgxQueryBuilder', () => { const comboItem = outlet.querySelectorAll(`.igx-drop-down__item`)[0] as HTMLElement; comboItem.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/select/select.component.spec.ts b/projects/igniteui-angular/src/lib/select/select.component.spec.ts index 76a525181e9..ddef5b8fe59 100644 --- a/projects/igniteui-angular/src/lib/select/select.component.spec.ts +++ b/projects/igniteui-angular/src/lib/select/select.component.spec.ts @@ -210,6 +210,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); selectedItemEl.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -223,6 +224,7 @@ describe('igxSelect', () => { const selectedItemEl = selectList.children[1]; expect(select.collapsed).toBeFalsy(); selectedItemEl.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -231,6 +233,7 @@ describe('igxSelect', () => { fixture.detectChanges(); expect(select.collapsed).toBeFalsy(); selectedItemEl.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -246,6 +249,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); toggleBtn.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -260,6 +264,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); select.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -269,6 +274,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -280,6 +286,7 @@ describe('igxSelect', () => { const inputGroup = fixture.debugElement.query(By.css('.' + CSS_CLASS_INPUT_GROUP)); inputGroup.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -299,11 +306,13 @@ describe('igxSelect', () => { spyOn(select, 'close').and.callThrough(); inputGroup.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 1); inputGroup.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 2); @@ -311,6 +320,7 @@ describe('igxSelect', () => { select.disabled = true; fixture.detectChanges(); inputGroup.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -325,6 +335,7 @@ describe('igxSelect', () => { const selectedItemEl = selectList.children[2]; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeFalsy(); @@ -333,6 +344,7 @@ describe('igxSelect', () => { spyOn(select.closed, 'emit'); selectedItemEl.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.closing.emit).toHaveBeenCalledTimes(1); @@ -352,11 +364,13 @@ describe('igxSelect', () => { spyOn(select, 'close').and.callThrough(); toggleBtn.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 1); toggleBtn.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 2); @@ -369,12 +383,14 @@ describe('igxSelect', () => { expect(select).toBeDefined(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeFalsy(); dummyInput.focus(); dummyInput.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -399,6 +415,7 @@ describe('igxSelect', () => { expect(select).toBeDefined(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeFalsy(); @@ -406,6 +423,7 @@ describe('igxSelect', () => { dummyInput.focus(); dummyInput.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -432,12 +450,14 @@ describe('igxSelect', () => { expect(dropdownWrapper.nativeElement.getAttribute('aria-hidden')).toEqual('true'); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(inputElement.nativeElement.getAttribute('aria-expanded')).toEqual('true'); expect(dropdownWrapper.nativeElement.getAttribute('aria-hidden')).toEqual('false'); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(inputElement.nativeElement.getAttribute('aria-expanded')).toEqual('false'); @@ -488,6 +508,7 @@ describe('igxSelect', () => { dummyInput.focus(); dummyInput.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dummyInput).toEqual(document.activeElement); @@ -509,6 +530,7 @@ describe('igxSelect', () => { dummyInput.focus(); dummyInput.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(dummyInput).toEqual(document.activeElement); @@ -596,6 +618,7 @@ describe('igxSelect', () => { inputGroup.nativeElement.click(); const toggleBtn = fix.debugElement.query(By.css('.' + CSS_CLASS_TOGGLE_BUTTON)); toggleBtn.nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); expect(selectComp.collapsed).toEqual(true); @@ -796,6 +819,7 @@ describe('igxSelect', () => { const inputGroup = fix.debugElement.query(By.css('.' + CSS_CLASS_INPUT_GROUP)); inputGroup.nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); expect(selectComp.collapsed).toBeFalsy(); @@ -808,6 +832,7 @@ describe('igxSelect', () => { fix.detectChanges(); inputGroup.nativeElement.click(); + fix.detectChanges(); tick(); fix.detectChanges(); expect(selectComp.collapsed).toBeTruthy(); @@ -842,18 +867,22 @@ describe('igxSelect', () => { let selectedItemIndex = 5; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectList.children[selectedItemIndex].nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(selectedItemIndex); selectedItemIndex = 15; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectList.children[selectedItemIndex].nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(selectedItemIndex); @@ -902,22 +931,26 @@ describe('igxSelect', () => { it('should select item with ENTER/SPACE keys', fakeAsync(() => { let selectedItemIndex = 2; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); inputElement.triggerEventHandler('keydown', spaceKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(selectedItemIndex); selectedItemIndex = 4; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); inputElement.triggerEventHandler('keydown', enterKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(selectedItemIndex); @@ -926,9 +959,11 @@ describe('igxSelect', () => { it('should allow single selection only', fakeAsync(() => { let selectedItemIndex = 5; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectList.children[selectedItemIndex].nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(selectedItemIndex); @@ -966,11 +1001,13 @@ describe('igxSelect', () => { const focusedItemIndex = 0; const selectedItemIndex = 8; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(focusedItemIndex); selectList.children[selectedItemIndex].nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(selectedItemIndex); @@ -981,6 +1018,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(focusedItemIndex); @@ -1005,9 +1043,11 @@ describe('igxSelect', () => { // Select item - mouse click select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectList.children[selectedItemIndex].nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); checkInputValue(); @@ -1019,6 +1059,7 @@ describe('igxSelect', () => { tick(); fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); checkInputValue(); @@ -1059,9 +1100,11 @@ describe('igxSelect', () => { // Select item - mouse click select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectList.children[selectedItemIndex].nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); checkInputValue(); @@ -1072,6 +1115,7 @@ describe('igxSelect', () => { tick(); fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); checkInputValue(); @@ -1097,6 +1141,7 @@ describe('igxSelect', () => { tick(); fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.selectedItem).toBeUndefined(); @@ -1133,6 +1178,7 @@ describe('igxSelect', () => { // Focus item when there is not a selected item select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); navigateDropdownItems(arrowDownKeyEvent); @@ -1143,9 +1189,11 @@ describe('igxSelect', () => { // Focus item when there is a selected item selectedItem = select.items[13] as IgxSelectItemComponent; selectedItem.element.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); navigateDropdownItems(arrowUpKeyEvent); @@ -1192,10 +1240,12 @@ describe('igxSelect', () => { let selectedItemIndex = 4; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].element.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(selectedItemIndex); @@ -1203,6 +1253,7 @@ describe('igxSelect', () => { const previousItem = select.items[selectedItemIndex]; selectedItemIndex = 1; select.items[selectedItemIndex].element.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(selectedItemIndex); @@ -1214,9 +1265,11 @@ describe('igxSelect', () => { const selectedItem = select.items[2] as IgxSelectItemComponent; inputElement.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItemEl.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(selectedItem.selected).toBeTruthy(); @@ -1250,9 +1303,11 @@ describe('igxSelect', () => { }; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItemEl.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.selectionChanging.emit).toHaveBeenCalledTimes(1); @@ -1264,9 +1319,11 @@ describe('igxSelect', () => { selectedItemEl = selectList.children[10]; args.newSelection = selectedItem; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItemEl.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.selectionChanging.emit).toHaveBeenCalledTimes(2); @@ -1319,12 +1376,14 @@ describe('igxSelect', () => { const navigateDropdownItems = (selectEvent: KeyboardEvent) => { inputElement.triggerEventHandler('keydown', altArrowDownKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); for (let itemIndex = 0; itemIndex < selectedItem.index; itemIndex++) { inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); } inputElement.triggerEventHandler('keydown', selectEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); }; @@ -1460,6 +1519,7 @@ describe('igxSelect', () => { // Select item - mouse click select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); itemElementToSelect.click(); @@ -1472,6 +1532,7 @@ describe('igxSelect', () => { tick(); fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); checkInputValue(); @@ -1523,9 +1584,11 @@ describe('igxSelect', () => { const selectedItemElement = groupElement.children[selectedItemIndex].nativeElement; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItemElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.input.value).toEqual(select.items[selectedItemIndex - 1].value); @@ -1577,6 +1640,7 @@ describe('igxSelect', () => { const focusedItemElement = groupElement.children[focusedItemIndex].nativeElement; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const focusedItems = fixture.debugElement.queryAll(By.css('.' + CSS_CLASS_FOCUSED_ITEM)); @@ -1605,6 +1669,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); inputElement.triggerEventHandler('keydown', altArrowUpKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -1618,6 +1683,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); inputElement.triggerEventHandler('keydown', enterKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -1631,6 +1697,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); inputElement.triggerEventHandler('keydown', spaceKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -1644,6 +1711,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); inputElement.triggerEventHandler('keydown', escapeKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -1677,11 +1745,13 @@ describe('igxSelect', () => { spyOn(select, 'close').and.callThrough(); inputElement.triggerEventHandler('keydown', altArrowDownKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 1); inputElement.triggerEventHandler('keydown', altArrowUpKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 2); @@ -1697,11 +1767,13 @@ describe('igxSelect', () => { spyOn(select, 'toggle').and.callThrough(); inputElement.triggerEventHandler('keydown', enterKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 0); inputElement.triggerEventHandler('keydown', escapeKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 0); @@ -1717,11 +1789,13 @@ describe('igxSelect', () => { spyOn(select, 'toggle').and.callThrough(); inputElement.triggerEventHandler('keydown', spaceKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 0); inputElement.triggerEventHandler('keydown', escapeKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 0); @@ -1842,10 +1916,12 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(selectedItem.selected).toBeTruthy(); @@ -1857,10 +1933,12 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); inputElement.triggerEventHandler('keydown', arrowUpKeyEvent); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItem = select.items[7]; @@ -1960,9 +2038,11 @@ describe('igxSelect', () => { const filteredItemsInxs = fixture.componentInstance.filterCities('pa'); for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'p' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); inputElement.triggerEventHandler('keydown', { key: 'a' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(item); @@ -1978,6 +2058,7 @@ describe('igxSelect', () => { const filteredItemsInxs = fixture.componentInstance.filterCities('l'); inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); @@ -1985,6 +2066,7 @@ describe('igxSelect', () => { fixture.detectChanges(); inputElement.triggerEventHandler('keydown', { key: 'L' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[1]); @@ -1998,6 +2080,7 @@ describe('igxSelect', () => { const filteredItemsInxs = fixture.componentInstance.filterCities('l'); for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(item); @@ -2006,6 +2089,7 @@ describe('igxSelect', () => { } // Navigate back to the first filtered item to verify that selection is wrapped inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); @@ -2034,6 +2118,7 @@ describe('igxSelect', () => { let filteredItemsInxs = fixture.componentInstance.filterCities('ü'); for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'ü' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(item); @@ -2045,6 +2130,7 @@ describe('igxSelect', () => { filteredItemsInxs = fixture.componentInstance.filterCities('с'); for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'с' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(item); @@ -2056,11 +2142,13 @@ describe('igxSelect', () => { it('should not change focus when pressing non-matching character and dropdown is opened', fakeAsync(() => { select.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const filteredItemsInxs = fixture.componentInstance.filterCities('l'); inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); @@ -2069,6 +2157,7 @@ describe('igxSelect', () => { // Verify that focus is unchanged inputElement.triggerEventHandler('keydown', { key: 'w' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); @@ -2080,9 +2169,11 @@ describe('igxSelect', () => { const filteredItemsInxs = fixture.componentInstance.filterCities('pa'); for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'p' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); inputElement.triggerEventHandler('keydown', { key: 'a' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(item); @@ -2095,6 +2186,7 @@ describe('igxSelect', () => { it('character key navigation when dropdown is closed should be case insensitive', fakeAsync(() => { const filteredItemsInxs = fixture.componentInstance.filterCities('l'); inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(filteredItemsInxs[0]); @@ -2102,6 +2194,7 @@ describe('igxSelect', () => { fixture.detectChanges(); inputElement.triggerEventHandler('keydown', { key: 'L' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(filteredItemsInxs[1]); @@ -2113,6 +2206,7 @@ describe('igxSelect', () => { const filteredItemsInxs = fixture.componentInstance.filterCities('l'); for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(item); @@ -2121,6 +2215,7 @@ describe('igxSelect', () => { } // Navigate back to the first filtered item to verify that selection is wrapped inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(filteredItemsInxs[0]); @@ -2147,6 +2242,7 @@ describe('igxSelect', () => { let filteredItemsInxs = fixture.componentInstance.filterCities('ü'); for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'ü' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(item); @@ -2158,6 +2254,7 @@ describe('igxSelect', () => { filteredItemsInxs = fixture.componentInstance.filterCities('с'); for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'с' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifySelectedItem(item); @@ -2170,6 +2267,7 @@ describe('igxSelect', () => { it('should not change selection when pressing non-matching character and dropdown is closed', fakeAsync(() => { const filteredItemsInxs = fixture.componentInstance.filterCities('l'); inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); @@ -2178,6 +2276,7 @@ describe('igxSelect', () => { // Verify that selection is unchanged inputElement.triggerEventHandler('keydown', { key: 'q' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); @@ -2185,6 +2284,7 @@ describe('igxSelect', () => { fixture.detectChanges(); inputElement.triggerEventHandler('keydown', { key: 'l' }); + fixture.detectChanges(); tick(); fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[1]); @@ -2254,6 +2354,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2263,11 +2364,13 @@ describe('igxSelect', () => { selectedItemIndex = 2; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2277,11 +2380,13 @@ describe('igxSelect', () => { selectedItemIndex = 0; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2308,6 +2413,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2315,11 +2421,13 @@ describe('igxSelect', () => { selectedItemIndex = 5; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2327,11 +2435,13 @@ describe('igxSelect', () => { selectedItemIndex = 9; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2353,6 +2463,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2367,6 +2478,7 @@ describe('igxSelect', () => { (select.element as HTMLElement).style.marginTop = '10px'; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2382,6 +2494,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2403,6 +2516,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2414,6 +2528,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2427,6 +2542,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); getBoundingRectangles(); @@ -2448,6 +2564,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); document.documentElement.scrollLeft += 50; @@ -2460,11 +2577,13 @@ describe('igxSelect', () => { selectedItemIndex = 2; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); document.documentElement.scrollLeft += 50; @@ -2477,11 +2596,13 @@ describe('igxSelect', () => { selectedItemIndex = 0; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); document.documentElement.scrollLeft += 50; @@ -2498,6 +2619,7 @@ describe('igxSelect', () => { select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); document.documentElement.scrollTop += 20; @@ -2510,11 +2632,13 @@ describe('igxSelect', () => { selectedItemIndex = 2; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); document.documentElement.scrollTop += 20; @@ -2527,11 +2651,13 @@ describe('igxSelect', () => { selectedItemIndex = 0; select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); document.documentElement.scrollTop += 20; @@ -2633,6 +2759,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeTruthy(); hintContainer.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); diff --git a/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts b/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts index 65fbdebe537..7190d83c471 100644 --- a/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts +++ b/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts @@ -377,6 +377,7 @@ describe('igxOverlay', () => { fixture.detectChanges(); fixture.componentInstance.buttonElement.nativeElement.click(); + fixture.detectChanges(); tick(); const overlayDiv = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_MAIN)[0] as HTMLElement; @@ -873,6 +874,7 @@ describe('igxOverlay', () => { const button2 = fixture.nativeElement.getElementsByClassName('buttonTwo')[0]; button1.click(); + fixture.detectChanges(); tick(); const overlayDiv = (fixture.nativeElement as HTMLElement) @@ -881,6 +883,7 @@ describe('igxOverlay', () => { expect(wrapperElement1.style.visibility).toEqual(''); button2.click(); + fixture.detectChanges(); tick(); const wrapperElement2 = overlayDiv.children[1] as HTMLElement; expect(wrapperElement1.style.visibility).toEqual(''); @@ -1304,6 +1307,7 @@ describe('igxOverlay', () => { expect(wrapperElement.style.visibility).toEqual(''); document.body.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1341,6 +1345,7 @@ describe('igxOverlay', () => { const toggledDiv = componentElement.children[0] as HTMLElement; toggledDiv.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1348,6 +1353,7 @@ describe('igxOverlay', () => { expect(wrapperElement.style.visibility).toEqual(''); document.body.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -2817,6 +2823,7 @@ describe('igxOverlay', () => { fixture.componentInstance.target = buttonElement; component.ButtonPositioningSettings.minSize = { width: 80, height: 80 }; buttonElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -3559,6 +3566,7 @@ describe('igxOverlay', () => { expect(fixture.componentInstance.customComponent.nativeElement.style.height).toEqual('100%'); expect(fixture.componentInstance.customComponent.nativeElement.getBoundingClientRect().height).toEqual(280); fixture.componentInstance.buttonElement.nativeElement.click(); + fixture.detectChanges(); tick(); const componentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName('customList')[0] as HTMLElement; @@ -3868,6 +3876,7 @@ describe('igxOverlay', () => { componentElement.ButtonPositioningSettings.horizontalStartPoint = HorizontalAlignment.Left; fixture.componentInstance.target = buttonElement; buttonElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -3922,6 +3931,7 @@ describe('igxOverlay', () => { fixture.componentInstance.target = buttonElement; componentElement.ButtonPositioningSettings.minSize = { width: 80, height: 80 }; buttonElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -4016,6 +4026,7 @@ describe('igxOverlay', () => { fixture.componentInstance.target = buttonElement; componentElement.ButtonPositioningSettings.minSize = { width: 80, height: 80 }; buttonElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -4359,6 +4370,7 @@ describe('igxOverlay', () => { expect(overlay.closing.emit).toHaveBeenCalledTimes(0); document.documentElement.click(); + fixture.detectChanges(); tick(); expect(overlay.closing.emit).toHaveBeenCalledTimes(1); expect(overlay.closing.emit).toHaveBeenCalledWith({ @@ -4394,6 +4406,7 @@ describe('igxOverlay', () => { expect(overlay.show).toHaveBeenCalledTimes(1); divElement.click(); + fixture.detectChanges(); tick(); expect(overlay.closing.emit).toHaveBeenCalledTimes(0); @@ -4420,6 +4433,7 @@ describe('igxOverlay', () => { expect(overlay.show).toHaveBeenCalledTimes(2); divElement.click(); + fixture.detectChanges(); tick(); expect(overlay.closing.emit).toHaveBeenCalledTimes(2); diff --git a/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts b/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts index e64423138d3..1e912287b91 100644 --- a/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts +++ b/projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts @@ -625,6 +625,7 @@ describe('IgxSimpleCombo', () => { expect(dropdownListBox.nativeElement.getAttribute('aria-labelledby')).toEqual(combo.placeholder); combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -632,6 +633,7 @@ describe('IgxSimpleCombo', () => { expect(list.nativeElement.getAttribute('aria-activedescendant')).toEqual(combo.dropdown.focusedItem.id); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', list); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(list.nativeElement.getAttribute('aria-activedescendant')).toEqual(combo.dropdown.focusedItem.id); @@ -643,10 +645,12 @@ describe('IgxSimpleCombo', () => { it('should render aria-expanded attribute properly', fakeAsync(() => { expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('false'); combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('true'); combo.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('false'); @@ -670,6 +674,7 @@ describe('IgxSimpleCombo', () => { fixture.componentInstance.size = "large"; fixture.detectChanges(); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DROPDOWNLISTITEM}`)); @@ -1163,17 +1168,20 @@ describe('IgxSimpleCombo', () => { it('should not close the dropdown on ArrowUp key if the active item is the first one in the list', fakeAsync(() => { combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); const list = fixture.debugElement.query(By.css(`.${CSS_CLASS_CONTENT}`)); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', list); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toEqual(false); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', list); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toEqual(false); @@ -1204,6 +1212,7 @@ describe('IgxSimpleCombo', () => { const dropdownContent = fixture.debugElement.query(By.css(`.${CSS_CLASS_CONTENT}`)); UIInteractions.triggerEventHandlerKeyDown('Tab', dropdownContent); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toBeTruthy(); @@ -1253,12 +1262,14 @@ describe('IgxSimpleCombo', () => { const toggleBtn = fixture.debugElement.query(By.css(`.${CSS_CLASS_TOGGLEBUTTON}`)); UIInteractions.triggerEventHandlerKeyDown('Enter', toggleBtn); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.toggle).toHaveBeenCalledTimes(1); expect(combo.collapsed).toEqual(false); UIInteractions.triggerEventHandlerKeyDown('Enter', toggleBtn); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.toggle).toHaveBeenCalledTimes(2); @@ -1395,6 +1406,7 @@ describe('IgxSimpleCombo', () => { spyOn(combo, 'close').and.callThrough(); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', input); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(document.activeElement).toHaveClass('igx-combo__content'); @@ -1785,12 +1797,14 @@ describe('IgxSimpleCombo', () => { expect(combo.collapsed).toBeTruthy(); toggleIcon.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toBeFalsy(); toggleIcon.nativeElement.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1842,6 +1856,7 @@ describe('IgxSimpleCombo', () => { fixture.detectChanges(); combo.dropdown.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toEqual(true); @@ -1852,6 +1867,7 @@ describe('IgxSimpleCombo', () => { expect(combo.overlaySettings.positionStrategy.settings.verticalDirection).toBe(-1); combo.dropdown.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(combo.collapsed).toEqual(true); @@ -1883,6 +1899,7 @@ describe('IgxSimpleCombo', () => { fixture.detectChanges(); combo.toggle(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -2086,6 +2103,7 @@ describe('IgxSimpleCombo', () => { expect(combo.filteredData[0].field).toEqual('Arizona'); combo.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -2108,6 +2126,7 @@ describe('IgxSimpleCombo', () => { expect(combo.selection.field).toEqual('Connecticut'); combo.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -2122,6 +2141,7 @@ describe('IgxSimpleCombo', () => { it('should not select the first item when combo is focused there is no focus item and Enter is pressed', fakeAsync(() => { combo.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -2174,6 +2194,7 @@ describe('IgxSimpleCombo', () => { fixture.detectChanges(); UIInteractions.triggerEventHandlerKeyDown('Tab', input); + fixture.detectChanges(); tick(); fixture.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts b/projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts index 8eafb66af26..73e39305f64 100644 --- a/projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts +++ b/projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts @@ -513,6 +513,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); toggleIcon.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeTruthy(); @@ -523,6 +524,7 @@ describe('IgxTimePicker', () => { it('should open the dropdown with `ArrowDown` + `Alt` key press and close it on outside click', fakeAsync(() => { UIInteractions.triggerEventHandlerKeyDown('ArrowDown', timePickerDebElement, true); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeFalsy(); @@ -547,6 +549,7 @@ describe('IgxTimePicker', () => { const input = fixture.debugElement.query(By.css(CSS_CLASS_INPUT)); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeFalsy(); @@ -605,6 +608,7 @@ describe('IgxTimePicker', () => { it('should open/close the dropdown and keep the current selection on Space/Enter key press', fakeAsync(() => { UIInteractions.triggerEventHandlerKeyDown(' ', timePickerDebElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeFalsy(); @@ -644,6 +648,7 @@ describe('IgxTimePicker', () => { expect((dateTimeEditor.nativeElement.value).normalize('NFKC')).toEqual(`0${selectedHour}:${selectedMinutes} ${selectedAmpm}`); UIInteractions.triggerEventHandlerKeyDown('Escape', timePickerDebElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeTruthy(); @@ -652,6 +657,7 @@ describe('IgxTimePicker', () => { it('should not change the current selection and close the dropdown on OK button click', fakeAsync(() => { timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -661,6 +667,7 @@ describe('IgxTimePicker', () => { const okButton = fixture.debugElement.queryAll(By.css('button'))[1]; okButton.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -672,6 +679,7 @@ describe('IgxTimePicker', () => { it('should close the dropdown and discard the current selection on Cancel button click', fakeAsync(() => { timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -681,6 +689,7 @@ describe('IgxTimePicker', () => { const cancelButton = fixture.debugElement.queryAll(By.css('button'))[0]; cancelButton.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -695,6 +704,7 @@ describe('IgxTimePicker', () => { spyOn(timePicker.closed, 'emit').and.callThrough(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeFalsy(); @@ -702,6 +712,7 @@ describe('IgxTimePicker', () => { expect(timePicker.opened.emit).toHaveBeenCalled(); timePicker.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeTruthy(); @@ -718,6 +729,7 @@ describe('IgxTimePicker', () => { const openingSub = timePicker.opening.subscribe((event) => event.cancel = true); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeTruthy(); @@ -729,10 +741,12 @@ describe('IgxTimePicker', () => { const closingSub = timePicker.closing.subscribe((event) => event.cancel = true); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); timePicker.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeFalsy(); @@ -841,6 +855,7 @@ describe('IgxTimePicker', () => { // apply selected value on toggle btn click const toggleIcon = fixture.debugElement.query(By.css('igx-prefix')); toggleIcon.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeTrue(); @@ -892,6 +907,7 @@ describe('IgxTimePicker', () => { // apply selected value on toggle btn click const toggleIcon = fixture.debugElement.query(By.css('igx-prefix')); toggleIcon.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeTrue(); @@ -1197,6 +1213,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1204,6 +1221,7 @@ describe('IgxTimePicker', () => { expect(dropdown).toBeDefined(); timePicker.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1211,6 +1229,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1235,6 +1254,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1259,6 +1279,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1331,6 +1352,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1353,6 +1375,7 @@ describe('IgxTimePicker', () => { expect(inputEl.getAttribute('aria-expanded')).toEqual('false'); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(inputEl.getAttribute('aria-expanded')).toEqual('true'); @@ -1381,6 +1404,7 @@ describe('IgxTimePicker', () => { expect(selectedAMPM.attributes['aria-valuemax']).toEqual('PM'); timePicker.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(inputEl.getAttribute('aria-expanded')).toEqual('false'); @@ -1392,6 +1416,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1410,6 +1435,7 @@ describe('IgxTimePicker', () => { const item = ampmColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1427,6 +1453,7 @@ describe('IgxTimePicker', () => { expect(selectedMinute.attributes['aria-valuemax']).toEqual('28'); timePicker.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); })); @@ -1438,6 +1465,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1458,6 +1486,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1479,6 +1508,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1497,6 +1527,7 @@ describe('IgxTimePicker', () => { secondsColumn = fixture.debugElement.query(By.css(CSS_CLASS_SECONDSLIST)); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeFalsy(); @@ -1509,6 +1540,7 @@ describe('IgxTimePicker', () => { let item; let selectedItems; item = ampmColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); @@ -1517,6 +1549,7 @@ describe('IgxTimePicker', () => { item = hourColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); @@ -1525,6 +1558,7 @@ describe('IgxTimePicker', () => { item = minutesColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); @@ -1533,6 +1567,7 @@ describe('IgxTimePicker', () => { item = secondsColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); @@ -1544,6 +1579,7 @@ describe('IgxTimePicker', () => { item = ampmColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); + fixture.detectChanges(); tick(); fixture.detectChanges(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); @@ -1577,6 +1613,7 @@ describe('IgxTimePicker', () => { it('should set headerOrientation prop in dialog mode', fakeAsync(() => { timePicker.mode = PickerInteractionMode.Dialog; timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.headerOrientation).toEqual('horizontal'); @@ -1584,6 +1621,7 @@ describe('IgxTimePicker', () => { expect(dialogDivVertical).toBeNull(); timePicker.close(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1592,6 +1630,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1605,6 +1644,7 @@ describe('IgxTimePicker', () => { fixture.detectChanges(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1671,6 +1711,7 @@ describe('IgxTimePicker', () => { expect(timePicker.collapsed).toBeTruthy(); UIInteractions.triggerEventHandlerKeyDown(' ', timePickerDebElement); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1685,6 +1726,7 @@ describe('IgxTimePicker', () => { expect(timePicker.collapsed).toBeTruthy(); timePicker.open(); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(timePicker.collapsed).toBeFalsy(); From 836ec668d798d2e273279f1affd2f1dc136f4aeb Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Mon, 10 Nov 2025 10:50:36 +0000 Subject: [PATCH 4/7] Comprehensive fix for toggle async patterns - replace flush with tick and add detectChanges Co-authored-by: wnvko <5990334+wnvko@users.noreply.github.com> --- .../src/lib/dialog/dialog.component.spec.ts | 1 + .../tooltip/tooltip.directive.spec.ts | 51 ++++++++++--------- .../grid/grid-filtering-advanced.spec.ts | 4 ++ .../lib/grids/grid/grid-filtering-ui.spec.ts | 7 ++- .../lib/grids/grid/grid-validation.spec.ts | 3 +- .../src/lib/services/overlay/overlay.spec.ts | 24 +++++++++ 6 files changed, 63 insertions(+), 27 deletions(-) diff --git a/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts b/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts index e183d893cb2..d3a8e55a7bb 100644 --- a/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts +++ b/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts @@ -308,6 +308,7 @@ describe('Dialog', () => { spyOn(dialog.rightButtonSelect, 'emit'); dispatchEvent(rightButton, 'click'); + fixture.detectChanges(); tick(); expect(dialog.rightButtonSelect.emit).toHaveBeenCalled(); })); diff --git a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts index 3e34abd8ecf..ce16a052c52 100644 --- a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts @@ -81,7 +81,7 @@ describe('IgxTooltip', () => { verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); unhoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -91,7 +91,7 @@ describe('IgxTooltip', () => { expect(tooltipTarget.hasArrow).toBeFalse(); hoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -228,12 +228,12 @@ describe('IgxTooltip', () => { it('IgxTooltip respects the passed overlaySettings', fakeAsync(() => { // Hover the button. hoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); // Verify default position of the tooltip. verifyTooltipPosition(tooltipNativeElement, button); unhoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); // Use custom overlaySettings. @@ -259,13 +259,13 @@ describe('IgxTooltip', () => { expect(Math.abs(tooltipRect.top - targetRect.bottom) <= 0.5).toBe(true); expect(Math.abs(tooltipRect.left - targetRect.right) <= 0.5).toBe(true); unhoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); })); it('IgxTooltip closes when the target is clicked', fakeAsync(() => { hoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -383,7 +383,7 @@ describe('IgxTooltip', () => { fix.componentInstance.cancelShowing = true; hoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -393,11 +393,11 @@ describe('IgxTooltip', () => { fix.componentInstance.cancelHiding = true; hoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); unhoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -428,7 +428,7 @@ describe('IgxTooltip', () => { describe('Tooltip touch', () => { it('IgxTooltip is shown/hidden when touching/untouching its target', fakeAsync(() => { touchElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -516,13 +516,13 @@ describe('IgxTooltip', () => { it('IgxTooltip is shown/hidden when hovering/unhovering its target', fakeAsync(() => { hoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); unhoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); @@ -530,7 +530,7 @@ describe('IgxTooltip', () => { it('Should respect default max-width constraint for plain string tooltip', fakeAsync(() => { hoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -588,10 +588,10 @@ describe('IgxTooltip', () => { verifyTooltipPosition(tooltipNativeElement, buttonTwo, false); unhoverElement(buttonOne); - fixture.detectChanges(); + fix.detectChanges(); flush(); hoverElement(buttonTwo); - fixture.detectChanges(); + fix.detectChanges(); flush(); // Tooltip is positioned relative to buttonTwo and NOT relative to buttonOne @@ -660,7 +660,7 @@ describe('IgxTooltip', () => { tick(100); hoverElement(buttonTwo); - fixture.detectChanges(); + fix.detectChanges(); flush(); // Tooltip is visible and positioned relative to buttonTwo @@ -679,7 +679,7 @@ describe('IgxTooltip', () => { const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); - fixture.detectChanges(); + fix.detectChanges(); flush(); expect(targetOne['_hideOnInteraction']).toHaveBeenCalledTimes(1); @@ -691,7 +691,7 @@ describe('IgxTooltip', () => { spyOn(targetTwo.tooltipHide, 'emit'); hoverElement(buttonOne); - fixture.detectChanges(); + fix.detectChanges(); flush(); const tooltipHideArgsTargetOne = { target: targetOne, tooltip: fix.componentInstance.tooltip, cancel: false }; @@ -704,7 +704,7 @@ describe('IgxTooltip', () => { flush(); hoverElement(buttonTwo); - fixture.detectChanges(); + fix.detectChanges(); flush(); unhoverElement(buttonTwo); @@ -717,13 +717,13 @@ describe('IgxTooltip', () => { it('IgxTooltip hides when touch one target, then another, then outside', fakeAsync(() => { touchElement(targetOne); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, targetOne, true); verifyTooltipPosition(tooltipNativeElement, targetOne, true); touchElement(targetTwo); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, targetTwo, true); verifyTooltipPosition(tooltipNativeElement, targetTwo, true); @@ -913,7 +913,7 @@ describe('IgxTooltip', () => { flush(); hoverElement(buttonTwo); - fixture.detectChanges(); + fix.detectChanges(); flush(); arrow = tooltipNativeElement.querySelector(TOOLTIP_ARROW_SELECTOR) as HTMLElement; @@ -945,7 +945,7 @@ describe('IgxTooltip', () => { const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); - fixture.detectChanges(); + fix.detectChanges(); flush(); expect(tooltipOne['onDocumentTouchStart']).toHaveBeenCalledTimes(1); @@ -1021,7 +1021,7 @@ describe('IgxTooltip', () => { it('should hide the tooltip custom close button is clicked', fakeAsync(() => { hoverElement(button); - fixture.detectChanges(); + fix.detectChanges(); flush(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -1079,7 +1079,8 @@ describe('IgxTooltip', () => { cancelable: true }); document.dispatchEvent(escapeEvent); - flush() + fix.detectChanges(); + tick() verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false) })); diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts index 285ae6e7bd1..8bd497e47b4 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts @@ -670,6 +670,7 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { // Hover the last visible expression chip const expressionItem = fix.nativeElement.querySelectorAll(`.${QueryBuilderSelectors.FILTER_TREE_EXPRESSION_ITEM}`)[9]; expressionItem.dispatchEvent(new MouseEvent('mouseenter')); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -708,6 +709,7 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { // Hover the previous to last visible expression chip. const expressionItem = fix.nativeElement.querySelectorAll(`.${QueryBuilderSelectors.FILTER_TREE_EXPRESSION_ITEM}`)[9]; expressionItem.dispatchEvent(new MouseEvent('mouseenter')); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -748,6 +750,7 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { // Hover the last visible expression chip const expressionItem = fix.nativeElement.querySelectorAll(`.${QueryBuilderSelectors.FILTER_TREE_EXPRESSION_ITEM}`)[9]; expressionItem.dispatchEvent(new MouseEvent('mouseenter')); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -1322,6 +1325,7 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { // Hover the condition chip to show the add button const expressionItem = fix.nativeElement.querySelectorAll(`.${QueryBuilderSelectors.FILTER_TREE_EXPRESSION_ITEM}`)[0]; expressionItem.dispatchEvent(new MouseEvent('mouseenter')); + fix.detectChanges(); tick(); fix.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts index be341a61500..1bb8e4046f8 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts @@ -369,7 +369,8 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { currentDay.dispatchEvent(new Event('click')); - flush(); + fix.detectChanges(); + tick(); fix.detectChanges(); input.triggerEventHandler('change', null); fix.detectChanges(); @@ -407,12 +408,14 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { const monthView = calendar.querySelector('.igx-calendar-picker__date'); monthView.dispatchEvent(new Event('click')); + fix.detectChanges(); tick(); fix.detectChanges(); const firstMonth = calendar.querySelector('.igx-calendar__month'); const firstMonthText = (firstMonth as HTMLElement).innerText; firstMonth.dispatchEvent(new Event('click')); + fix.detectChanges(); tick(); fix.detectChanges(); @@ -448,11 +451,13 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { const monthView = calendar.querySelectorAll('.igx-calendar-picker__date')[1]; monthView.dispatchEvent(new Event('click')); + fix.detectChanges(); tick(); fix.detectChanges(); const firstMonth = calendar.querySelectorAll('.igx-calendar__year')[0]; firstMonth.dispatchEvent(new Event('click')); + fix.detectChanges(); tick(); fix.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts index c79470814cf..32fef0974c5 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts @@ -227,7 +227,8 @@ describe('IgxGrid - Validation #grid', () => { const element = fixture.debugElement.query(By.directive(IgxTooltipTargetDirective)).nativeElement; element.dispatchEvent(new MouseEvent('mouseenter')); - flush(); + fixture.detectChanges(); + tick(); fixture.detectChanges(); expect(cell.errorTooltip.first.collapsed).toBeFalse(); })); diff --git a/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts b/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts index 7190d83c471..4293e7ddc6c 100644 --- a/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts +++ b/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts @@ -906,6 +906,7 @@ describe('igxOverlay', () => { .parentElement.getElementsByClassName(CLASS_SCROLLABLE_DIV)[0] as HTMLElement; scrollableDiv.scrollTop += 5; scrollableDiv.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); overlayElement = (fixture.nativeElement as HTMLElement) @@ -914,6 +915,7 @@ describe('igxOverlay', () => { scrollableDiv.scrollTop += 100; scrollableDiv.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); overlayElement = (fixture.nativeElement as HTMLElement) @@ -2020,6 +2022,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += 9; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(document.documentElement.scrollTop).toEqual(9); @@ -2029,6 +2032,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += 25; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(document.documentElement.scrollTop).toEqual(34); @@ -2065,11 +2069,13 @@ describe('igxOverlay', () => { expect(buttonElement.getBoundingClientRect().y).toEqual(0); document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(document.documentElement.scrollTop).toEqual(0); document.documentElement.scrollTop += 25; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(document.documentElement.scrollTop).toEqual(25); contentElement = (fixture.nativeElement as HTMLElement) @@ -2080,6 +2086,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += 500; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; @@ -2668,6 +2675,7 @@ describe('igxOverlay', () => { expect(overlay.hide).toHaveBeenCalledTimes(0); document.documentElement.scrollTop += scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(scrollSpy).toHaveBeenCalledTimes(1); expect(overlay.hide).toHaveBeenCalledTimes(0); @@ -2703,6 +2711,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(scrollSpy).toHaveBeenCalledTimes(1); expect(scrollStrategy.detach).toHaveBeenCalledTimes(0); @@ -3170,6 +3179,7 @@ describe('igxOverlay', () => { expect(overlay.hide).toHaveBeenCalledTimes(0); document.documentElement.scrollTop += scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(scrollSpy).toHaveBeenCalledTimes(1); expect(overlay.hide).toHaveBeenCalledTimes(0); @@ -3205,6 +3215,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(scrollSpy).toHaveBeenCalledTimes(1); expect(scrollStrategy.detach).toHaveBeenCalledTimes(0); @@ -3629,6 +3640,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop = 100; document.documentElement.scrollLeft = 50; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(componentRect).toEqual(componentElement.getBoundingClientRect()); @@ -3663,16 +3675,19 @@ describe('igxOverlay', () => { tick(); expect(document.documentElement.scrollTop).toEqual(0); document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(document.documentElement.scrollTop).toEqual(0); document.documentElement.scrollTop += 25; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(document.documentElement.scrollTop).toEqual(0); document.documentElement.scrollTop += 1000; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); const wrapperElement = (fixture.nativeElement as HTMLElement) @@ -4070,6 +4085,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop = 100; document.documentElement.scrollLeft = 50; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(componentRect).toEqual(componentElement.getBoundingClientRect()); @@ -4110,6 +4126,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop = 40; document.documentElement.scrollLeft = 30; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(componentRect).toEqual(componentElement.getBoundingClientRect()); @@ -4149,6 +4166,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop = scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); let wrapperElement = (fixture.nativeElement as HTMLElement) @@ -4159,6 +4177,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += scrollTolerance * 2; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); wrapperElement = (fixture.nativeElement as HTMLElement) @@ -4199,6 +4218,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(document.documentElement.scrollTop).toEqual(scrollTolerance); const wrapperElement = (fixture.nativeElement as HTMLElement) @@ -4238,6 +4258,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); let wrapperElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_WRAPPER)[0] as HTMLElement; @@ -4247,6 +4268,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += scrollTolerance * 2; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); wrapperElement = (fixture.nativeElement as HTMLElement) @@ -4290,6 +4312,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); expect(document.documentElement.scrollTop).toEqual(scrollTolerance); expect(document.getElementsByClassName(CLASS_OVERLAY_WRAPPER).length).toEqual(1); @@ -4333,6 +4356,7 @@ describe('igxOverlay', () => { document.documentElement.scrollTop += scrollTolerance; document.documentElement.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); const newElementRect = componentElement.getBoundingClientRect(); expect(document.documentElement.scrollTop).toEqual(scrollTolerance); From 6446bada62422935e63518c281e3022a55f29b41 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 11 Nov 2025 07:39:25 +0000 Subject: [PATCH 5/7] Replace flush() with tick() in tooltip tests and fix select test patterns Co-authored-by: wnvko <5990334+wnvko@users.noreply.github.com> --- .../tooltip/tooltip.directive.spec.ts | 184 +++++++++--------- .../src/lib/select/select.component.spec.ts | 14 ++ 2 files changed, 106 insertions(+), 92 deletions(-) diff --git a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts index ce16a052c52..f30273a06a7 100644 --- a/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts @@ -76,13 +76,13 @@ describe('IgxTooltip', () => { it('IgxTooltip is shown/hidden when hovering/unhovering its target', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); unhoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -92,7 +92,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -109,7 +109,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -125,7 +125,7 @@ describe('IgxTooltip', () => { it('show target tooltip when hovering its target and ignore [tooltip] input', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); expect(tooltipNativeElement.textContent.trim()).toEqual('Hello, I am a tooltip!'); @@ -134,7 +134,7 @@ describe('IgxTooltip', () => { it('verify tooltip default position', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipPosition(tooltipNativeElement, button); })); @@ -144,7 +144,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); tooltipTarget.tooltipDisabled = false; @@ -152,7 +152,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); })); @@ -178,7 +178,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); unhoverElement(button); tick(HIDE_DELAY); @@ -194,11 +194,11 @@ describe('IgxTooltip', () => { it('IgxTooltip is shown/hidden when invoking respective API methods', fakeAsync(() => { tooltipTarget.showTooltip(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); tooltipTarget.hideTooltip(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -217,7 +217,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); tooltipTarget.showTooltip(); - flush(); + tick(); tooltipTarget.hideTooltip(); @@ -229,12 +229,12 @@ describe('IgxTooltip', () => { // Hover the button. hoverElement(button); fix.detectChanges(); - flush(); + tick(); // Verify default position of the tooltip. verifyTooltipPosition(tooltipNativeElement, button); unhoverElement(button); fix.detectChanges(); - flush(); + tick(); // Use custom overlaySettings. tooltipTarget.overlaySettings = /**/ { @@ -251,7 +251,7 @@ describe('IgxTooltip', () => { // Hover the button again. hoverElement(button); fix.detectChanges(); - flush(); + tick(); // Verify that the position of the tooltip is changed. verifyTooltipPosition(tooltipNativeElement, button, false); const targetRect = tooltipTarget.nativeElement.getBoundingClientRect(); @@ -260,18 +260,18 @@ describe('IgxTooltip', () => { expect(Math.abs(tooltipRect.left - targetRect.right) <= 0.5).toBe(true); unhoverElement(button); fix.detectChanges(); - flush(); + tick(); })); it('IgxTooltip closes when the target is clicked', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); UIInteractions.simulateClickAndSelectEvent(button); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -293,25 +293,25 @@ describe('IgxTooltip', () => { it('IgxTooltip hides on pressing \'escape\' key', fakeAsync(() => { tooltipTarget.showTooltip(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); UIInteractions.triggerKeyDownEvtUponElem('Escape', document.documentElement); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); it('IgxTooltip is hidden when its target is destroyed', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); fix.componentInstance.showButton = false; fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -323,12 +323,12 @@ describe('IgxTooltip', () => { hoverElement(button); expect(tooltipTarget.tooltipShow.emit).toHaveBeenCalled(); - flush(); + tick(); unhoverElement(button); tick(500); expect(tooltipTarget.tooltipHide.emit).toHaveBeenCalled(); - flush(); + tick(); })); it('should emit the proper events when showing/hiding tooltip through API', fakeAsync(() => { @@ -337,12 +337,12 @@ describe('IgxTooltip', () => { tooltipTarget.showTooltip(); expect(tooltipTarget.tooltipShow.emit).toHaveBeenCalled(); - flush(); + tick(); tooltipTarget.hideTooltip(); tick(500); expect(tooltipTarget.tooltipHide.emit).toHaveBeenCalled(); - flush(); + tick(); })); it('should emit the proper events with correct eventArgs when hover/unhover', fakeAsync(() => { @@ -354,12 +354,12 @@ describe('IgxTooltip', () => { hoverElement(button); expect(tooltipTarget.tooltipShow.emit).toHaveBeenCalledWith(tooltipShowArgs); - flush(); + tick(); unhoverElement(button); tick(500); expect(tooltipTarget.tooltipHide.emit).toHaveBeenCalledWith(tooltipHideArgs); - flush(); + tick(); })); it('should emit the proper events with correct eventArgs when show/hide through API', fakeAsync(() => { @@ -371,12 +371,12 @@ describe('IgxTooltip', () => { tooltipTarget.showTooltip(); expect(tooltipTarget.tooltipShow.emit).toHaveBeenCalledWith(tooltipShowArgs); - flush(); + tick(); tooltipTarget.hideTooltip(); tick(500); expect(tooltipTarget.tooltipHide.emit).toHaveBeenCalledWith(tooltipHideArgs); - flush(); + tick(); })); it('should cancel the showing event when hover', fakeAsync(() => { @@ -384,7 +384,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -394,11 +394,11 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); unhoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); })); @@ -407,7 +407,7 @@ describe('IgxTooltip', () => { fix.componentInstance.cancelShowing = true; tooltipTarget.showTooltip(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -416,10 +416,10 @@ describe('IgxTooltip', () => { fix.componentInstance.cancelHiding = true; tooltipTarget.showTooltip(); - flush(); + tick(); tooltipTarget.hideTooltip(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); })); @@ -429,14 +429,14 @@ describe('IgxTooltip', () => { it('IgxTooltip is shown/hidden when touching/untouching its target', fakeAsync(() => { touchElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -447,7 +447,7 @@ describe('IgxTooltip', () => { touchElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); tooltipTarget.tooltipDisabled = false; @@ -455,7 +455,7 @@ describe('IgxTooltip', () => { touchElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); })); @@ -481,7 +481,7 @@ describe('IgxTooltip', () => { touchElement(button); fix.detectChanges(); - flush(); + tick(); const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); @@ -510,20 +510,20 @@ describe('IgxTooltip', () => { it('IgxTooltip is initially hidden', fakeAsync(() => { unhoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); it('IgxTooltip is shown/hidden when hovering/unhovering its target', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); unhoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -531,7 +531,7 @@ describe('IgxTooltip', () => { it('Should respect default max-width constraint for plain string tooltip', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -552,7 +552,7 @@ describe('IgxTooltip', () => { it('Should not have max-width constraint for custom content tooltip', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -580,7 +580,7 @@ describe('IgxTooltip', () => { it('Same tooltip shows on different targets depending on which target is hovered', fakeAsync(() => { hoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); // Tooltip is positioned relative to buttonOne and NOT relative to buttonTwo verifyTooltipVisibility(tooltipNativeElement, targetOne, true); @@ -589,10 +589,10 @@ describe('IgxTooltip', () => { unhoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); hoverElement(buttonTwo); fix.detectChanges(); - flush(); + tick(); // Tooltip is positioned relative to buttonTwo and NOT relative to buttonOne verifyTooltipVisibility(tooltipNativeElement, targetTwo, true); @@ -606,7 +606,7 @@ describe('IgxTooltip', () => { hoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); unhoverElement(buttonOne); tick(300); @@ -618,7 +618,7 @@ describe('IgxTooltip', () => { verifyTooltipVisibility(tooltipNativeElement, targetTwo, true); verifyTooltipPosition(tooltipNativeElement, buttonTwo); verifyTooltipPosition(tooltipNativeElement, buttonOne, false); - flush(); + tick(); })); it('Should position relative to its target when having no close animation - #16288', fakeAsync(() => { @@ -661,7 +661,7 @@ describe('IgxTooltip', () => { hoverElement(buttonTwo); fix.detectChanges(); - flush(); + tick(); // Tooltip is visible and positioned relative to buttonTwo verifyTooltipVisibility(tooltipNativeElement, targetTwo, true); @@ -680,7 +680,7 @@ describe('IgxTooltip', () => { const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); fix.detectChanges(); - flush(); + tick(); expect(targetOne['_hideOnInteraction']).toHaveBeenCalledTimes(1); expect(targetTwo['_hideOnInteraction']).not.toHaveBeenCalled(); @@ -692,7 +692,7 @@ describe('IgxTooltip', () => { hoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); const tooltipHideArgsTargetOne = { target: targetOne, tooltip: fix.componentInstance.tooltip, cancel: false }; const tooltipHideArgsTargetTwo = { target: targetTwo, tooltip: fix.componentInstance.tooltip, cancel: false }; @@ -701,36 +701,36 @@ describe('IgxTooltip', () => { tick(500); expect(targetOne.tooltipHide.emit).toHaveBeenCalledOnceWith(tooltipHideArgsTargetOne); expect(targetTwo.tooltipHide.emit).not.toHaveBeenCalled(); - flush(); + tick(); hoverElement(buttonTwo); fix.detectChanges(); - flush(); + tick(); unhoverElement(buttonTwo); tick(500); expect(targetOne.tooltipHide.emit).toHaveBeenCalledOnceWith(tooltipHideArgsTargetOne); expect(targetTwo.tooltipHide.emit).toHaveBeenCalledOnceWith(tooltipHideArgsTargetTwo); - flush(); + tick(); })); it('IgxTooltip hides when touch one target, then another, then outside', fakeAsync(() => { touchElement(targetOne); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, targetOne, true); verifyTooltipPosition(tooltipNativeElement, targetOne, true); touchElement(targetTwo); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, targetTwo, true); verifyTooltipPosition(tooltipNativeElement, targetTwo, true); touchElement(fix.debugElement); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, targetTwo, false); })); @@ -739,7 +739,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); let closeBtn = tooltipNativeElement.querySelector('igx-tooltip-close-button'); expect(closeBtn).not.toBeNull(); @@ -749,7 +749,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); hoverElement(buttonTwo); fix.detectChanges(); - flush(); + tick(); // It should still show tooltip for targetOne expect(fix.componentInstance.tooltip.role).toBe('status'); @@ -758,11 +758,11 @@ describe('IgxTooltip', () => { closeBtn = tooltipNativeElement.querySelector('igx-tooltip-close-button') as HTMLElement; closeBtn.dispatchEvent(new Event('click')); fix.detectChanges(); - flush(); + tick(); hoverElement(buttonTwo); fix.detectChanges(); - flush(); + tick(); expect(tooltipNativeElement.querySelector('igx-tooltip-close-button')).toBeNull(); expect(fix.componentInstance.tooltip.role).toBe('tooltip'); @@ -778,7 +778,7 @@ describe('IgxTooltip', () => { hoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); const customClose = tooltipNativeElement.querySelector('.my-close-btn'); expect(customClose).not.toBeNull(); @@ -787,11 +787,11 @@ describe('IgxTooltip', () => { const closeBtn = tooltipNativeElement.querySelector('igx-tooltip-close-button') as HTMLElement; closeBtn.dispatchEvent(new Event('click')); fix.detectChanges(); - flush(); + tick(); hoverElement(buttonTwo); fix.detectChanges(); - flush(); + tick(); expect(tooltipNativeElement.querySelector('.my-close-btn')).toBeNull(); })); @@ -806,7 +806,7 @@ describe('IgxTooltip', () => { hoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); // Tooltip should be shown for targetOne with custom close button and correct role const tooltip = tooltipNativeElement; @@ -824,7 +824,7 @@ describe('IgxTooltip', () => { targetTwo.closeTemplate = instance.secondCustomCloseTemplate; fix.detectChanges(); - flush(); + tick(); expect(tooltip.querySelector('igx-tooltip-close-button')).toBe(closeButton); // same reference expect(tooltip.querySelector('.my-close-btn')).not.toBeNull(); // still the custom one @@ -841,7 +841,7 @@ describe('IgxTooltip', () => { hoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); fix.detectChanges(); const tooltip = tooltipNativeElement; @@ -855,7 +855,7 @@ describe('IgxTooltip', () => { // Change closeTemplate of active targetOne targetOne.closeTemplate = instance.secondCustomCloseTemplate; fix.detectChanges(); - flush(); + tick(); const updatedCustomClose = tooltip.querySelector('.my-second-close-btn'); expect(updatedCustomClose).not.toBeNull(); @@ -863,7 +863,7 @@ describe('IgxTooltip', () => { targetOne.sticky = false; fix.detectChanges(); - flush(); + tick(); expect(tooltip.getAttribute('role')).toBe('tooltip'); expect(tooltip.querySelector('igx-tooltip-close-button')).toBeNull(); @@ -875,7 +875,7 @@ describe('IgxTooltip', () => { targetOne.sticky = true; fix.detectChanges(); targetOne.showTooltip(); - flush(); + tick(); verifyTooltipVisibility(tooltip, targetOne, true); expect(tooltip.role).toBe('status'); @@ -883,15 +883,15 @@ describe('IgxTooltip', () => { // Programmatically show tooltip for targetTwo (non-sticky) without closing sticky tooltip targetTwo.sticky = false; targetTwo.showTooltip(); - flush(); + tick(); verifyTooltipPosition(tooltip, targetTwo, false); expect(tooltip.role).toBe('status'); targetOne.hideTooltip(); - flush(); + tick(); targetTwo.showTooltip(); - flush(); + tick(); verifyTooltipPosition(tooltip, targetTwo, true); expect(tooltip.role).toBe('tooltip'); })); @@ -902,7 +902,7 @@ describe('IgxTooltip', () => { hoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, targetOne, true); let arrow = tooltipNativeElement.querySelector(TOOLTIP_ARROW_SELECTOR) as HTMLElement; @@ -910,11 +910,11 @@ describe('IgxTooltip', () => { unhoverElement(buttonOne); fix.detectChanges(); - flush(); + tick(); hoverElement(buttonTwo); fix.detectChanges(); - flush(); + tick(); arrow = tooltipNativeElement.querySelector(TOOLTIP_ARROW_SELECTOR) as HTMLElement; verifyTooltipVisibility(tooltipNativeElement, targetTwo, true); @@ -946,7 +946,7 @@ describe('IgxTooltip', () => { const dummyDiv = fix.debugElement.query(By.css('.dummyDiv')); touchElement(dummyDiv); fix.detectChanges(); - flush(); + tick(); expect(tooltipOne['onDocumentTouchStart']).toHaveBeenCalledTimes(1); expect(tooltipTwo['onDocumentTouchStart']).not.toHaveBeenCalled(); @@ -968,7 +968,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); @@ -997,7 +997,7 @@ describe('IgxTooltip', () => { it('should render custom close button when sticky is true', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, button, true); const closeBtn = document.querySelector('.my-close-btn'); @@ -1011,7 +1011,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); const closeBtn = document.querySelector('.my-close-btn'); @@ -1022,13 +1022,13 @@ describe('IgxTooltip', () => { it('should hide the tooltip custom close button is clicked', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); const closeBtn = tooltipNativeElement.querySelector('.my-close-btn') as HTMLElement; UIInteractions.simulateClickAndSelectEvent(closeBtn); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, false); })); @@ -1041,7 +1041,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); const icon = document.querySelector('igx-icon'); @@ -1052,7 +1052,7 @@ describe('IgxTooltip', () => { it('should update the DOM role attribute correctly when sticky changes', fakeAsync(() => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); expect(tooltipNativeElement.getAttribute('role')).toBe('status'); @@ -1069,7 +1069,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); // Dispatch Escape key @@ -1090,7 +1090,7 @@ describe('IgxTooltip', () => { fix.detectChanges(); touchElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); const closeBtn = document.querySelector('.my-close-btn'); @@ -1122,7 +1122,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); verifyTooltipPosition(tooltipNativeElement, button, true, Placement.Bottom, customOffset); @@ -1138,7 +1138,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); verifyTooltipPosition(tooltipNativeElement, button, true, Placement.Right, customOffset); @@ -1152,7 +1152,7 @@ describe('IgxTooltip', () => { hoverElement(button); fix.detectChanges(); - flush(); + tick(); verifyTooltipVisibility(tooltipNativeElement, tooltipTarget, true); verifyTooltipPosition(tooltipNativeElement, button, true, Placement.BottomStart); diff --git a/projects/igniteui-angular/src/lib/select/select.component.spec.ts b/projects/igniteui-angular/src/lib/select/select.component.spec.ts index ddef5b8fe59..bdc71665afe 100644 --- a/projects/igniteui-angular/src/lib/select/select.component.spec.ts +++ b/projects/igniteui-angular/src/lib/select/select.component.spec.ts @@ -423,6 +423,7 @@ describe('igxSelect', () => { dummyInput.focus(); dummyInput.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -508,6 +509,7 @@ describe('igxSelect', () => { dummyInput.focus(); dummyInput.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -530,6 +532,7 @@ describe('igxSelect', () => { dummyInput.focus(); dummyInput.click(); + fixture.detectChanges(); tick(); fixture.detectChanges(); @@ -1721,6 +1724,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); inputElement.triggerEventHandler('keydown', tabKeyEvent); inputElement.nativeElement.dispatchEvent(new Event('blur')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -1730,6 +1734,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeFalsy(); inputElement.triggerEventHandler('keydown', shiftTabKeysEvent); inputElement.nativeElement.dispatchEvent(new Event('blur')); + fixture.detectChanges(); tick(); fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); @@ -1963,10 +1968,12 @@ describe('igxSelect', () => { fixture.detectChanges(); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); + fixture.detectChanges(); verifySelectedItem(selectedItemIndex); inputElement.triggerEventHandler('keydown', arrowUpKeyEvent); + fixture.detectChanges(); verifySelectedItem(--selectedItemIndex); // Does not wrap selection - arrow up stays on the first item if selected @@ -1976,6 +1983,7 @@ describe('igxSelect', () => { fixture.detectChanges(); inputElement.triggerEventHandler('keydown', arrowUpKeyEvent); + fixture.detectChanges(); verifySelectedItem(selectedItemIndex); }); @@ -2569,6 +2577,7 @@ describe('igxSelect', () => { fixture.detectChanges(); document.documentElement.scrollLeft += 50; document.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); getBoundingRectangles(); verifySelectedItemPositioning(); @@ -2588,6 +2597,7 @@ describe('igxSelect', () => { fixture.detectChanges(); document.documentElement.scrollLeft += 50; document.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); getBoundingRectangles(); verifySelectedItemPositioning(); @@ -2607,6 +2617,7 @@ describe('igxSelect', () => { fixture.detectChanges(); document.documentElement.scrollLeft += 50; document.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); getBoundingRectangles(); verifySelectedItemPositioning(); @@ -2624,6 +2635,7 @@ describe('igxSelect', () => { fixture.detectChanges(); document.documentElement.scrollTop += 20; document.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); getBoundingRectangles(); verifySelectedItemPositioning(); @@ -2643,6 +2655,7 @@ describe('igxSelect', () => { fixture.detectChanges(); document.documentElement.scrollTop += 20; document.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); getBoundingRectangles(); verifySelectedItemPositioning(); @@ -2662,6 +2675,7 @@ describe('igxSelect', () => { fixture.detectChanges(); document.documentElement.scrollTop += 20; document.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); tick(); getBoundingRectangles(); verifySelectedItemPositioning(); From 97415a816e320dc95262599b1b0aa4334aa7ccd1 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 11 Nov 2025 07:40:48 +0000 Subject: [PATCH 6/7] Fix double detectChanges pattern in select tests Co-authored-by: wnvko <5990334+wnvko@users.noreply.github.com> --- .../src/lib/select/select.component.spec.ts | 285 +++++------------- 1 file changed, 76 insertions(+), 209 deletions(-) diff --git a/projects/igniteui-angular/src/lib/select/select.component.spec.ts b/projects/igniteui-angular/src/lib/select/select.component.spec.ts index bdc71665afe..8fcb47cf07c 100644 --- a/projects/igniteui-angular/src/lib/select/select.component.spec.ts +++ b/projects/igniteui-angular/src/lib/select/select.component.spec.ts @@ -212,7 +212,6 @@ describe('igxSelect', () => { selectedItemEl.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); })); @@ -226,7 +225,6 @@ describe('igxSelect', () => { selectedItemEl.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); select.open(); @@ -235,7 +233,6 @@ describe('igxSelect', () => { selectedItemEl.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); expect(select.selectionChanging.emit).toHaveBeenCalledTimes(1); })); @@ -251,7 +248,6 @@ describe('igxSelect', () => { toggleBtn.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); })); @@ -266,7 +262,6 @@ describe('igxSelect', () => { select.close(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); select.toggle(); @@ -276,7 +271,6 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); })); @@ -288,7 +282,6 @@ describe('igxSelect', () => { inputGroup.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); expect(selectListWrapper.nativeElement.classList.contains('igx-toggle--hidden')).toBeTruthy(); })); @@ -308,13 +301,11 @@ describe('igxSelect', () => { inputGroup.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 1); inputGroup.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 2); select.disabled = true; @@ -322,7 +313,6 @@ describe('igxSelect', () => { inputGroup.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); // No additional calls, because select is disabled expect(select.closing.emit).toHaveBeenCalledTimes(1); @@ -337,7 +327,6 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeFalsy(); spyOn(select.closing, 'emit'); @@ -346,7 +335,6 @@ describe('igxSelect', () => { selectedItemEl.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.closing.emit).toHaveBeenCalledTimes(1); expect(select.closed.emit).toHaveBeenCalledTimes(1); })); @@ -366,13 +354,11 @@ describe('igxSelect', () => { toggleBtn.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 1); toggleBtn.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 2); })); @@ -385,14 +371,12 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeFalsy(); dummyInput.focus(); dummyInput.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(dummyInput).toEqual(document.activeElement); expect(select.collapsed).toBeTruthy(); @@ -417,7 +401,6 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeFalsy(); dummyInput.focus(); @@ -426,7 +409,6 @@ describe('igxSelect', () => { fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(dummyInput).toEqual(document.activeElement); expect(select.collapsed).toBeFalsy(); @@ -453,14 +435,12 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(inputElement.nativeElement.getAttribute('aria-expanded')).toEqual('true'); expect(dropdownWrapper.nativeElement.getAttribute('aria-hidden')).toEqual('false'); select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(inputElement.nativeElement.getAttribute('aria-expanded')).toEqual('false'); expect(dropdownWrapper.nativeElement.getAttribute('aria-hidden')).toEqual('true'); })); @@ -490,7 +470,6 @@ describe('igxSelect', () => { select.type = 'box'; fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(inputGroup.nativeElement.classList.contains(CSS_CLASS_INPUT_GROUP_BOX)).toBeTruthy(); select.type = 'border'; @@ -512,7 +491,6 @@ describe('igxSelect', () => { fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(dummyInput).toEqual(document.activeElement); expect(select.collapsed).toBeTruthy(); })); @@ -535,7 +513,6 @@ describe('igxSelect', () => { fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(dummyInput).toEqual(document.activeElement); expect(select.collapsed).toBeFalsy(); })); @@ -623,7 +600,6 @@ describe('igxSelect', () => { toggleBtn.nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(selectComp.collapsed).toEqual(true); inputGroupInvalidClass = dom.query(By.css('.' + CSS_CLASS_INPUT_GROUP_INVALID)); @@ -824,7 +800,6 @@ describe('igxSelect', () => { inputGroup.nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(selectComp.collapsed).toBeFalsy(); selectComp.close(); @@ -837,7 +812,6 @@ describe('igxSelect', () => { inputGroup.nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(selectComp.collapsed).toBeTruthy(); })); @@ -871,23 +845,19 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectList.children[selectedItemIndex].nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(selectedItemIndex); selectedItemIndex = 15; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectList.children[selectedItemIndex].nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(selectedItemIndex); })); @@ -935,27 +905,23 @@ describe('igxSelect', () => { let selectedItemIndex = 2; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); inputElement.triggerEventHandler('keydown', spaceKeyEvent); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(selectedItemIndex); selectedItemIndex = 4; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); inputElement.triggerEventHandler('keydown', enterKeyEvent); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(selectedItemIndex); })); @@ -963,12 +929,10 @@ describe('igxSelect', () => { let selectedItemIndex = 5; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectList.children[selectedItemIndex].nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(selectedItemIndex); selectedItemIndex = 15; @@ -1005,14 +969,12 @@ describe('igxSelect', () => { const selectedItemIndex = 8; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifyFocusedItem(focusedItemIndex); selectList.children[selectedItemIndex].nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(selectedItemIndex); expect(select.items[focusedItemIndex].focused).toBeFalsy(); @@ -1022,8 +984,7 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifyFocusedItem(focusedItemIndex); })); @@ -1047,12 +1008,10 @@ describe('igxSelect', () => { // Select item - mouse click select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectList.children[selectedItemIndex].nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); checkInputValue(); // Select item - selectItem method @@ -1063,8 +1022,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); checkInputValue(); // Select item - item selected property @@ -1072,8 +1030,7 @@ describe('igxSelect', () => { selectedItemValue = select.items[selectedItemIndex].value; select.items[selectedItemIndex].selected = true; fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); checkInputValue(); // Select item - value property @@ -1081,8 +1038,7 @@ describe('igxSelect', () => { selectedItemValue = select.items[selectedItemIndex].value; select.value = select.items[selectedItemIndex].value.toString(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); checkInputValue(); })); @@ -1104,12 +1060,10 @@ describe('igxSelect', () => { // Select item - mouse click select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectList.children[selectedItemIndex].nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); checkInputValue(); // Select item - selectItem method @@ -1119,16 +1073,14 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); checkInputValue(); // Select item - item selected property selectedItemIndex = 2; select.items[selectedItemIndex].selected = true; fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); checkInputValue(); })); @@ -1145,8 +1097,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(select.selectedItem).toBeUndefined(); expect(select.input.value).toEqual(''); expect(inputElement.nativeElement.value).toEqual(''); @@ -1182,8 +1133,7 @@ describe('igxSelect', () => { // Focus item when there is not a selected item select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); navigateDropdownItems(arrowDownKeyEvent); expect(select.value).toBeNull(); expect(select.input.value).toEqual(''); @@ -1193,12 +1143,10 @@ describe('igxSelect', () => { selectedItem = select.items[13] as IgxSelectItemComponent; selectedItem.element.nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); navigateDropdownItems(arrowUpKeyEvent); focusedItem = select.items[selectedItem.index - navigationStep]; verifyFocusedItemIsNotSelected(); @@ -1244,21 +1192,18 @@ describe('igxSelect', () => { let selectedItemIndex = 4; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].element.nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(selectedItemIndex); const previousItem = select.items[selectedItemIndex]; selectedItemIndex = 1; select.items[selectedItemIndex].element.nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(selectedItemIndex); expect(previousItem.focused).toBeFalsy(); })); @@ -1269,12 +1214,10 @@ describe('igxSelect', () => { inputElement.nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItemEl.nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(selectedItem.selected).toBeTruthy(); expect(select.value).toEqual(selectedItem.value); expect(select.input.value.toString().trim()).toEqual(selectedItem.value); @@ -1307,12 +1250,10 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItemEl.nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(select.selectionChanging.emit).toHaveBeenCalledTimes(1); expect(select.selectItem).toHaveBeenCalledTimes(1); expect(select.selectionChanging.emit).toHaveBeenCalledWith(args); @@ -1323,12 +1264,10 @@ describe('igxSelect', () => { args.newSelection = selectedItem; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItemEl.nativeElement.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(select.selectionChanging.emit).toHaveBeenCalledTimes(2); expect(select.selectItem).toHaveBeenCalledTimes(2); expect(select.selectionChanging.emit).toHaveBeenCalledWith(args); @@ -1380,15 +1319,13 @@ describe('igxSelect', () => { const navigateDropdownItems = (selectEvent: KeyboardEvent) => { inputElement.triggerEventHandler('keydown', altArrowDownKeyEvent); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); for (let itemIndex = 0; itemIndex < selectedItem.index; itemIndex++) { inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); } inputElement.triggerEventHandler('keydown', selectEvent); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); }; navigateDropdownItems(enterKeyEvent); @@ -1523,8 +1460,7 @@ describe('igxSelect', () => { // Select item - mouse click select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); itemElementToSelect.click(); fixture.detectChanges(); checkInputValue(); @@ -1536,8 +1472,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); checkInputValue(); // Select item - item selected property @@ -1589,11 +1524,9 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); selectedItemElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.input.value).toEqual(select.items[selectedItemIndex - 1].value); expect(select.value).toEqual(select.items[selectedItemIndex - 1].value); const selectedItems = fixture.debugElement.queryAll(By.css('.' + CSS_CLASS_SELECTED_ITEM)); @@ -1645,7 +1578,6 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); const focusedItems = fixture.debugElement.queryAll(By.css('.' + CSS_CLASS_FOCUSED_ITEM)); expect(focusedItems.length).toEqual(1); expect(focusedItemElement.classList.contains(CSS_CLASS_FOCUSED_ITEM)).toBeTruthy(); @@ -1674,7 +1606,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', altArrowUpKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); })); @@ -1688,7 +1619,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', enterKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); })); @@ -1702,7 +1632,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', spaceKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); })); @@ -1716,7 +1645,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', escapeKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); select.toggle(); @@ -1726,7 +1654,6 @@ describe('igxSelect', () => { inputElement.nativeElement.dispatchEvent(new Event('blur')); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); select.toggle(); @@ -1736,7 +1663,6 @@ describe('igxSelect', () => { inputElement.nativeElement.dispatchEvent(new Event('blur')); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(select.collapsed).toBeTruthy(); })); @@ -1752,13 +1678,11 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', altArrowDownKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 1); inputElement.triggerEventHandler('keydown', altArrowUpKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 2); })); @@ -1774,13 +1698,11 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', enterKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 0); inputElement.triggerEventHandler('keydown', escapeKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 0); })); @@ -1796,13 +1718,11 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', spaceKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 0, 0); inputElement.triggerEventHandler('keydown', escapeKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyOpenCloseEvents(1, 1, 0); })); @@ -1923,12 +1843,10 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); inputElement.triggerEventHandler('keydown', arrowDownKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(selectedItem.selected).toBeTruthy(); verifyFocusedItem(focusedItemIndex); @@ -1940,12 +1858,10 @@ describe('igxSelect', () => { select.toggle(); fixture.detectChanges(); tick(); - fixture.detectChanges(); inputElement.triggerEventHandler('keydown', arrowUpKeyEvent); fixture.detectChanges(); tick(); - fixture.detectChanges(); selectedItem = select.items[7]; focusedItemIndex = selectedItem.index - 1; verifyFocusedItem(focusedItemIndex); @@ -2047,12 +1963,10 @@ describe('igxSelect', () => { for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'p' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); inputElement.triggerEventHandler('keydown', { key: 'a' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifyFocusedItem(item); tick(500); fixture.detectChanges(); @@ -2068,7 +1982,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); tick(500); fixture.detectChanges(); @@ -2076,7 +1989,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'L' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[1]); discardPeriodicTasks(); })); @@ -2089,8 +2001,7 @@ describe('igxSelect', () => { for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifyFocusedItem(item); tick(500); fixture.detectChanges(); @@ -2099,7 +2010,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); discardPeriodicTasks(); @@ -2127,8 +2037,7 @@ describe('igxSelect', () => { for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'ü' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifyFocusedItem(item); tick(500); fixture.detectChanges(); @@ -2139,8 +2048,7 @@ describe('igxSelect', () => { for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'с' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifyFocusedItem(item); tick(500); fixture.detectChanges(); @@ -2152,13 +2060,11 @@ describe('igxSelect', () => { select.open(); fixture.detectChanges(); tick(); - fixture.detectChanges(); const filteredItemsInxs = fixture.componentInstance.filterCities('l'); inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); tick(500); fixture.detectChanges(); @@ -2167,7 +2073,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'w' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); discardPeriodicTasks(); @@ -2178,12 +2083,10 @@ describe('igxSelect', () => { for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'p' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); inputElement.triggerEventHandler('keydown', { key: 'a' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(item); tick(500); fixture.detectChanges(); @@ -2196,7 +2099,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifySelectedItem(filteredItemsInxs[0]); tick(500); fixture.detectChanges(); @@ -2204,7 +2106,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'L' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifySelectedItem(filteredItemsInxs[1]); discardPeriodicTasks(); @@ -2215,8 +2116,7 @@ describe('igxSelect', () => { for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(item); tick(500); fixture.detectChanges(); @@ -2225,7 +2125,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifySelectedItem(filteredItemsInxs[0]); discardPeriodicTasks(); @@ -2251,8 +2150,7 @@ describe('igxSelect', () => { for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'ü' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(item); tick(500); fixture.detectChanges(); @@ -2263,8 +2161,7 @@ describe('igxSelect', () => { for (const item of filteredItemsInxs) { inputElement.triggerEventHandler('keydown', { key: 'с' }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); verifySelectedItem(item); tick(500); fixture.detectChanges(); @@ -2277,7 +2174,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); tick(500); fixture.detectChanges(); @@ -2286,7 +2182,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'q' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[0]); tick(500); fixture.detectChanges(); @@ -2294,7 +2189,6 @@ describe('igxSelect', () => { inputElement.triggerEventHandler('keydown', { key: 'l' }); fixture.detectChanges(); tick(); - fixture.detectChanges(); verifyFocusedItem(filteredItemsInxs[1]); discardPeriodicTasks(); @@ -2363,8 +2257,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); verifySelectedItemPositioning(); listTop = selectedItemRect.top - selectedItemRect.height; @@ -2373,14 +2266,12 @@ describe('igxSelect', () => { selectedItemIndex = 2; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); verifySelectedItemPositioning(); listTop = selectedItemRect.top - selectedItemRect.height * 2; @@ -2389,14 +2280,12 @@ describe('igxSelect', () => { selectedItemIndex = 0; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); verifySelectedItemPositioning(); listTop = selectedItemRect.top; @@ -2422,36 +2311,31 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); verifySelectedItemPositioning(); selectedItemIndex = 5; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); verifySelectedItemPositioning(); selectedItemIndex = 9; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); verifySelectedItemPositioning(); })); @@ -2472,8 +2356,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); verifySelectedItemPositioning(); })); @@ -2487,8 +2370,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); verifySelectedItemPositioning(); (select.element as HTMLElement).parentElement.style.marginTop = '10px'; @@ -2503,8 +2385,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); })); }); @@ -2525,8 +2406,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); })); it('should display selected item and all possible items above and below when item in the middle of the list is selected', @@ -2537,8 +2417,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); })); @@ -2551,8 +2430,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); getBoundingRectangles(); })); }); @@ -2573,8 +2451,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); document.documentElement.scrollLeft += 50; document.dispatchEvent(new Event('scroll')); fixture.detectChanges(); @@ -2587,14 +2464,12 @@ describe('igxSelect', () => { selectedItemIndex = 2; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); document.documentElement.scrollLeft += 50; document.dispatchEvent(new Event('scroll')); fixture.detectChanges(); @@ -2607,14 +2482,12 @@ describe('igxSelect', () => { selectedItemIndex = 0; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); document.documentElement.scrollLeft += 50; document.dispatchEvent(new Event('scroll')); fixture.detectChanges(); @@ -2631,8 +2504,7 @@ describe('igxSelect', () => { fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); document.documentElement.scrollTop += 20; document.dispatchEvent(new Event('scroll')); fixture.detectChanges(); @@ -2645,14 +2517,12 @@ describe('igxSelect', () => { selectedItemIndex = 2; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); document.documentElement.scrollTop += 20; document.dispatchEvent(new Event('scroll')); fixture.detectChanges(); @@ -2665,14 +2535,12 @@ describe('igxSelect', () => { selectedItemIndex = 0; select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); select.items[selectedItemIndex].selected = true; fixture.detectChanges(); select.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); document.documentElement.scrollTop += 20; document.dispatchEvent(new Event('scroll')); fixture.detectChanges(); @@ -2774,8 +2642,7 @@ describe('igxSelect', () => { expect(select.collapsed).toBeTruthy(); hintContainer.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(select.collapsed).toBeTruthy(); })); From 12579a2f0623b2db612e2480a9bf10327fe4bcac Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 11 Nov 2025 07:41:54 +0000 Subject: [PATCH 7/7] Remove double detectChanges pattern from all remaining test files Co-authored-by: wnvko <5990334+wnvko@users.noreply.github.com> --- .../src/lib/combo/combo.component.spec.ts | 123 ++++------ .../src/lib/dialog/dialog.component.spec.ts | 42 ++-- .../autocomplete.directive.spec.ts | 5 - .../lib/drop-down/drop-down.component.spec.ts | 210 ++++++------------ .../grid/grid-filtering-advanced.spec.ts | 4 - .../lib/grids/grid/grid-filtering-ui.spec.ts | 42 +--- .../lib/grids/grid/grid-validation.spec.ts | 2 - .../hierarchical-grid.spec.ts | 3 - .../query-builder.component.spec.ts | 27 +-- .../src/lib/services/overlay/overlay.spec.ts | 16 -- .../time-picker/time-picker.component.spec.ts | 126 ++++------- 11 files changed, 177 insertions(+), 423 deletions(-) diff --git a/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts b/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts index cab4ccb9c8f..60c11c2380c 100644 --- a/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts +++ b/projects/igniteui-angular/src/lib/combo/combo.component.spec.ts @@ -1065,8 +1065,7 @@ describe('igxCombo', () => { combo.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const searchInput = fixture.debugElement.query(By.css(CSS_CLASS_SEARCHINPUT)); expect(searchInput.nativeElement.getAttribute('role')).toEqual('searchbox'); @@ -1079,8 +1078,7 @@ describe('igxCombo', () => { UIInteractions.triggerEventHandlerKeyDown('ArrowDown', list); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(list.nativeElement.getAttribute('aria-activedescendant')).toEqual(combo.dropdown.focusedItem.id); combo.select(['Illinois', 'Mississippi', 'Ohio']); @@ -1091,13 +1089,11 @@ describe('igxCombo', () => { expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('false'); combo.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('true'); combo.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(input.nativeElement.getAttribute('aria-expanded')).toMatch('false'); })); it('should render placeholder values for inputs properly', () => { @@ -1131,8 +1127,7 @@ describe('igxCombo', () => { fixture.detectChanges(); combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DROPDOWNLISTITEM}`)); const dropdownList = fixture.debugElement.query(By.css(`.${CSS_CLASS_CONTENT}`)); @@ -1248,16 +1243,14 @@ describe('igxCombo', () => { it('should focus search input', fakeAsync(() => { combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(document.activeElement).toEqual(combo.searchInput.nativeElement); })); it('should not focus search input, when autoFocusSearch=false', fakeAsync(() => { combo.autoFocusSearch = false; combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(document.activeElement).not.toEqual(combo.searchInput.nativeElement); })); it('should properly initialize templates', () => { @@ -1353,8 +1346,7 @@ describe('igxCombo', () => { combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const inputElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_INPUTGROUP_WRAPPER}`)).nativeElement; const dropDownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROPDOWNLIST_SCROLL}`)).nativeElement; containerElementWidth = containerElement.getBoundingClientRect().width; @@ -1379,8 +1371,7 @@ describe('igxCombo', () => { combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); let inputElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_INPUTGROUP_WRAPPER}`)).nativeElement; let dropDownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROPDOWNLIST_SCROLL}`)).nativeElement; @@ -1395,8 +1386,7 @@ describe('igxCombo', () => { combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); comboWidth = '700px'; combo.width = comboWidth; @@ -1404,8 +1394,7 @@ describe('igxCombo', () => { combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); comboWrapper = fixture.debugElement.query(By.css(CSS_CLASS_COMBO)).nativeElement; inputElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_INPUTGROUP_WRAPPER}`)).nativeElement; @@ -1680,8 +1669,7 @@ describe('igxCombo', () => { expect(combo.collapsed).toBeTruthy(); combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(document.activeElement).toEqual(combo.searchInput.nativeElement); expect(combo.collapsed).toBeFalsy(); combo.handleKeyUp(UIInteractions.getKeyboardEvent('keyup', 'ArrowDown')); @@ -1797,8 +1785,7 @@ describe('igxCombo', () => { it('should properly handle dropdown.focusItem', fakeAsync(() => { combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const virtualSpyUP = spyOn(dropdown, 'navigatePrev'); const virtualSpyDOWN = spyOn(dropdown, 'navigateNext'); spyOn(IgxComboDropDownComponent.prototype, 'navigateItem').and.callThrough(); @@ -1816,8 +1803,7 @@ describe('igxCombo', () => { it('should handle keyboard events', fakeAsync(() => { combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); spyOn(combo, 'selectAllItems'); spyOn(combo, 'toggle'); spyOn(combo.dropdown, 'onFocus').and.callThrough(); @@ -1840,16 +1826,14 @@ describe('igxCombo', () => { spyOn(combo, 'toggle').and.callThrough(); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.collapsed).toEqual(false); expect(combo.toggle).toHaveBeenCalledTimes(1); expect(document.activeElement).toEqual(combo.searchInput.nativeElement); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.collapsed).toEqual(true); expect(combo.toggle).toHaveBeenCalledTimes(2); })); @@ -1967,8 +1951,7 @@ describe('igxCombo', () => { const dropdownContent = fixture.debugElement.query(By.css(`.${CSS_CLASS_CONTENT}`)); UIInteractions.triggerEventHandlerKeyDown('Tab', dropdownContent); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.collapsed).toBeTruthy(); })); }); @@ -2306,15 +2289,13 @@ describe('igxCombo', () => { UIInteractions.triggerEventHandlerKeyDown('Enter', toggleBtn); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.toggle).toHaveBeenCalledTimes(1); expect(combo.collapsed).toEqual(false); UIInteractions.triggerEventHandlerKeyDown('Enter', toggleBtn); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.toggle).toHaveBeenCalledTimes(2); expect(combo.collapsed).toEqual(true); })); @@ -2474,8 +2455,7 @@ describe('igxCombo', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const dropdownContent = fixture.debugElement.query(By.css(`.${CSS_CLASS_CONTENT}`)); UIInteractions.simulateTyping('Mississippi ', input); @@ -2485,16 +2465,13 @@ describe('igxCombo', () => { combo.handleKeyUp(UIInteractions.getKeyboardEvent('keyup', 'ArrowDown')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); UIInteractions.triggerEventHandlerKeyDown('Space', dropdownContent); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); combo.onBlur(); tick(); fixture.detectChanges(); @@ -2626,8 +2603,7 @@ describe('igxCombo', () => { it('should group items correctly', fakeAsync(() => { combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.groupKey).toEqual('region'); expect(combo.dropdown.items[0].value.field === combo.data[0].field).toBeFalsy(); const listItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DROPDOWNLISTITEM}`)); @@ -2645,8 +2621,7 @@ describe('igxCombo', () => { spyOn(combo.dropdown, 'selectItem').and.callThrough(); combo.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.collapsed).toBeFalsy(); expect(combo.dropdown.headers).toBeDefined(); expect(combo.dropdown.headers.length).toEqual(2); @@ -3001,8 +2976,7 @@ describe('igxCombo', () => { UIInteractions.triggerEventHandlerKeyUp('Escape', searchInput); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.collapsed).toBeTruthy(); expect(searchInput.nativeElement.textContent).toEqual(''); })); @@ -3131,28 +3105,24 @@ describe('igxCombo', () => { it('should enable/disable filtering at runtime', fakeAsync(() => { combo.open(); // Open combo - all data items are in filteredData fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); const searchInput = fixture.debugElement.query(By.css(CSS_CLASS_SEARCHINPUT)); searchInput.nativeElement.value = 'Not-available item'; searchInput.triggerEventHandler('input', { target: searchInput.nativeElement }); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toEqual(0); // No items are available because of filtering combo.close(); // Filter is cleared on close fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); combo.disableFiltering = true; // Filtering is disabled fixture.detectChanges(); combo.open(); // All items are visible since filtering is disabled fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); // All items are visible since filtering is disabled combo.searchValue = 'Not-available item'; @@ -3162,14 +3132,12 @@ describe('igxCombo', () => { combo.close(); // Filter is cleared on close fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); combo.disableFiltering = false; // Filtering is re-enabled fixture.detectChanges(); combo.open(); // Filter is cleared on open fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); })); it(`should properly display "Add Item" button when filtering is off`, () => { @@ -3220,8 +3188,7 @@ describe('igxCombo', () => { it('Should filter the data when custom filterFunction is provided', fakeAsync(() => { combo.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); combo.searchValue = 'new england'; @@ -3231,8 +3198,7 @@ describe('igxCombo', () => { combo.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); combo.filteringOptions = { caseSensitive: false, filteringKey: combo.groupKey }; combo.filterFunction = (collection: any[], searchValue: any, filteringOptions: IComboFilteringOptions): any[] => { if (!collection) return []; @@ -3244,8 +3210,7 @@ describe('igxCombo', () => { } combo.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); combo.searchValue = 'new england'; @@ -3261,8 +3226,7 @@ describe('igxCombo', () => { it('Should update filtering when custom filterFunction is provided and filteringOptions.caseSensitive is changed', fakeAsync(() => { combo.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); combo.searchValue = 'new england'; @@ -3272,8 +3236,7 @@ describe('igxCombo', () => { combo.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); combo.filteringOptions = { caseSensitive: false, filteringKey: combo.groupKey }; combo.filterFunction = (collection: any[], searchValue: any, filteringOptions: IComboFilteringOptions): any[] => { if (!collection) return []; @@ -3285,8 +3248,7 @@ describe('igxCombo', () => { } combo.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); combo.searchValue = 'new england'; @@ -3301,8 +3263,7 @@ describe('igxCombo', () => { it('Should update filtering when custom filteringOptions are provided', fakeAsync(() => { combo.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); combo.searchValue = 'new england'; @@ -3312,13 +3273,11 @@ describe('igxCombo', () => { combo.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); combo.filteringOptions = { caseSensitive: false, filteringKey: combo.groupKey }; combo.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(combo.dropdown.items.length).toBeGreaterThan(0); combo.searchValue = 'new england'; diff --git a/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts b/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts index d3a8e55a7bb..de6849e715c 100644 --- a/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts +++ b/projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts @@ -154,8 +154,7 @@ describe('Dialog', () => { dialog.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dialog.isOpen).toEqual(false); })); @@ -221,8 +220,7 @@ describe('Dialog', () => { dialog.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dialog.isOpen).toEqual(false); })); @@ -232,27 +230,23 @@ describe('Dialog', () => { const dialog = fixture.componentInstance.dialog; dialog.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const dialogElem = fixture.debugElement.query(By.css('.igx-dialog')).nativeElement; dialogElem.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dialog.isOpen).toEqual(false); dialog.closeOnOutsideSelect = false; dialog.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dialogElem.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dialog.isOpen).toEqual(true); })); @@ -277,8 +271,7 @@ describe('Dialog', () => { dialog.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dialog.opening.emit).toHaveBeenCalledWith(cancellableArgs); expect(dialog.isOpenChange.emit).toHaveBeenCalledWith(true); @@ -286,8 +279,7 @@ describe('Dialog', () => { dialog.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); cancellableArgs = { dialog, event: undefined, cancel: false }; expect(dialog.closing.emit).toHaveBeenCalledWith(cancellableArgs); @@ -296,8 +288,7 @@ describe('Dialog', () => { dialog.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const buttons = document.querySelectorAll('button'); const leftButton = buttons[0]; const rightButton = buttons[1]; @@ -345,8 +336,7 @@ describe('Dialog', () => { childDialog.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const dialogs = fixture.debugElement.queryAll(By.css('.igx-dialog')); const maindDialogElem = dialogs[0].nativeElement; @@ -354,16 +344,14 @@ describe('Dialog', () => { childDialogElem.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(mainDialog.isOpen).toEqual(true); expect(childDialog.isOpen).toEqual(false); maindDialogElem.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(mainDialog.isOpen).toEqual(false); expect(childDialog.isOpen).toEqual(false); @@ -402,8 +390,7 @@ describe('Dialog', () => { dialog.open(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); let overlaydiv = document.getElementsByClassName(OVERLAY_MAIN_CLASS)[0]; let overlayWrapper = overlaydiv.children[0]; @@ -412,8 +399,7 @@ describe('Dialog', () => { dialog.close(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); fix.componentInstance.isModal = true; fix.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts index aba89e2fbcf..da0c63949cb 100644 --- a/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts +++ b/projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts @@ -67,13 +67,11 @@ describe('IgxAutocomplete', () => { autocomplete.open(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(dropDown.collapsed).toBeFalsy(); autocomplete.close(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(dropDown.collapsed).toBeTruthy(); })); it('Should open drop down on (Alt+)ArrowUp/ArrowDown', fakeAsync(() => { @@ -184,13 +182,11 @@ describe('IgxAutocomplete', () => { input.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(dropDown.collapsed).toBeFalsy(); group.element.nativeElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(dropDown.collapsed).toBeFalsy(); // Click in center of the body. @@ -772,7 +768,6 @@ describe('IgxAutocomplete', () => { autocomplete.close(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(input.nativeElement.attributes['aria-expanded'].value).toEqual('false'); })); it('Should accept Japanese input', fakeAsync(() => { diff --git a/projects/igniteui-angular/src/lib/drop-down/drop-down.component.spec.ts b/projects/igniteui-angular/src/lib/drop-down/drop-down.component.spec.ts index 6fba38a3e12..de5b7ff5888 100644 --- a/projects/igniteui-angular/src/lib/drop-down/drop-down.component.spec.ts +++ b/projects/igniteui-angular/src/lib/drop-down/drop-down.component.spec.ts @@ -203,16 +203,14 @@ describe('IgxDropDown ', () => { expect(dropdown.collapsed).toBeTruthy(); dropdown.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.collapsed).toBeFalsy(); expect(dropdown.onToggleOpening).toHaveBeenCalledTimes(1); expect(dropdown.onToggleOpened).toHaveBeenCalledTimes(1); dropdown.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.collapsed).toBeTruthy(); expect(dropdown.onToggleClosing).toHaveBeenCalledTimes(1); expect(dropdown.onToggleClosed).toHaveBeenCalledTimes(1); @@ -223,16 +221,14 @@ describe('IgxDropDown ', () => { dropdown.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(1); expect(dropdown.opened.emit).toHaveBeenCalledTimes(1); dropdown.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(1); expect(dropdown.opened.emit).toHaveBeenCalledTimes(1); @@ -298,16 +294,14 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(1); expect(dropdown.opened.emit).toHaveBeenCalledTimes(1); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(1); expect(dropdown.closed.emit).toHaveBeenCalledTimes(0); @@ -320,16 +314,14 @@ describe('IgxDropDown ', () => { dropdown.opening.pipe(take(1)).subscribe((e: CancelableEventArgs) => e.cancel = true); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(1); expect(dropdown.opened.emit).toHaveBeenCalledTimes(0); })); it('should select item by SPACE/ENTER keys', fakeAsync(() => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(0); expect(dropdown.collapsed).toEqual(false); @@ -337,8 +329,7 @@ describe('IgxDropDown ', () => { let dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem).toBeDefined(); expect(focusedItem.componentInstance.itemIndex).toEqual(1); @@ -346,33 +337,28 @@ describe('IgxDropDown ', () => { UIInteractions.triggerEventHandlerKeyDown('Space', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.selectedItem).toEqual(dropdown.items[1]); expect(dropdown.collapsed).toEqual(true); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); UIInteractions.triggerEventHandlerKeyDown('Enter', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.collapsed).toEqual(true); expect(dropdown.selectedItem).toEqual(dropdown.items[2]); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.collapsed).toEqual(false); })); it('should close the dropdown and not change selection by pressing ESC key', fakeAsync(() => { @@ -384,8 +370,7 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem).toBeDefined(); @@ -398,8 +383,7 @@ describe('IgxDropDown ', () => { UIInteractions.triggerEventHandlerKeyDown('Escape', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.collapsed).toEqual(true); expect(dropdown.opening.emit).toHaveBeenCalledTimes(1); expect(dropdown.opened.emit).toHaveBeenCalledTimes(1); @@ -410,42 +394,36 @@ describe('IgxDropDown ', () => { it('should navigate through items using Up/Down/Home/End keys', fakeAsync(() => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); dropdownElement.triggerEventHandler('keydown', UIInteractions.getKeyboardEvent('keydown', 'ArrowDown')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(1); UIInteractions.triggerEventHandlerKeyDown('End', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(14); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(13); UIInteractions.triggerEventHandlerKeyDown('Home', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(0); })); it('should not change selection when setting it to non-existing item', fakeAsync(() => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dropdown.setSelectedItem(0); fixture.detectChanges(); let selectedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_SELECTED}`)); @@ -486,16 +464,14 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const selectedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_SELECTED}`)); expect(selectedItem.componentInstance.itemIndex).toEqual(10); const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); UIInteractions.triggerEventHandlerKeyDown('Home', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[1].focused).toBeTruthy(); const focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(1); @@ -503,8 +479,7 @@ describe('IgxDropDown ', () => { it('should set isSelected via igxDropDownIteComponent', fakeAsync(() => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.selectedItem).toBeNull(); const items = dropdown.items as IgxDropDownItemComponent[]; @@ -523,8 +498,7 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.selectedItem.itemIndex).toEqual(1); })); it('should not set isSelected via igxDropDownItemBase on header items', fakeAsync(() => { @@ -537,8 +511,7 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.selectedItem).toBeNull(); const items = dropdown.items as IgxDropDownItemComponent[]; @@ -565,8 +538,7 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.selectedItem.itemIndex).toEqual(2); })); it('should return the proper eventArgs if selection has been cancelled', fakeAsync(() => { @@ -574,8 +546,7 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); let selectedItem = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`))[3]; selectedItem.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); @@ -606,8 +577,7 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem).toBeDefined(); @@ -618,8 +588,7 @@ describe('IgxDropDown ', () => { UIInteractions.triggerEventHandlerKeyDown('escape', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(1); expect(eventArgs.event).toBeDefined(); expect((eventArgs.event as KeyboardEvent).type).toEqual('keydown'); @@ -627,8 +596,7 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem).toBeDefined(); @@ -638,8 +606,7 @@ describe('IgxDropDown ', () => { UIInteractions.triggerEventHandlerKeyDown('enter', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(2); expect(eventArgs.event).toBeDefined(); expect((eventArgs.event as KeyboardEvent).type).toEqual('keydown'); @@ -649,8 +616,7 @@ describe('IgxDropDown ', () => { expect(dropdown.selectedItem).toEqual(null); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); // Overwrite selection args let expectedSelected = dropdown.items[4]; @@ -672,8 +638,7 @@ describe('IgxDropDown ', () => { // Set header - error dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expectedSelected = dropdown.items[4]; dropdown.items[4].isHeader = true; @@ -694,15 +659,13 @@ describe('IgxDropDown ', () => { it('should not take focus when allowItemsFocus is set to false', fakeAsync(() => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const focusedItem = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`))[0].nativeElement; expect(document.activeElement).toEqual(focusedItem); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dropdown.allowItemsFocus = false; tick(); @@ -712,8 +675,7 @@ describe('IgxDropDown ', () => { button.focus(); button.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(document.activeElement).toEqual(button); })); it('should not be able to select disabled and header items', fakeAsync(() => { @@ -723,8 +685,7 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const currentItem = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DISABLED}`))[0]; const headerItem = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_HEADER}`))[0]; expect(currentItem.componentInstance.itemIndex).toEqual(4); @@ -749,8 +710,7 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); let disabledItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DISABLED}`)); expect(disabledItems.length).toEqual(3); expect(dropdown.items[4].disabled).toBeFalsy(); @@ -772,8 +732,7 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const selectedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_SELECTED}`)); expect(selectedItem.componentInstance.itemIndex).toEqual(10); @@ -781,16 +740,14 @@ describe('IgxDropDown ', () => { const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); UIInteractions.triggerEventHandlerKeyDown('End', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[11].focused).toBeTruthy(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(11); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[11].focused).toBeTruthy(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(11); @@ -806,38 +763,33 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[11].focused).toBeTruthy(); let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(11); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[10].focused).toBeTruthy(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(10); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[8].focused).toBeTruthy(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(8); UIInteractions.triggerEventHandlerKeyDown('ArrowUp', dropdownElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[7].focused).toBeTruthy(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)); expect(focusedItem.componentInstance.itemIndex).toEqual(7); @@ -850,8 +802,7 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[0].selected).toBeTruthy(); })); it('should not move the focus when clicking a disabled item', fakeAsync(() => { @@ -864,8 +815,7 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items[10].focused).toEqual(true); const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)); @@ -928,16 +878,14 @@ describe('IgxDropDown ', () => { input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.collapsed).toEqual(true); expect(dropdown.selectItem).toHaveBeenCalledTimes(0); expect(dropdown.focusedItem).toEqual(null); UIInteractions.triggerEventHandlerKeyDown('Enter', input); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); // does not attempt to select item on keydown if DD is closed; expect(dropdown.selectItem).toHaveBeenCalledTimes(0); expect(dropdown.selectedItem).toEqual(null); @@ -945,16 +893,14 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.collapsed).toEqual(false); expect(dropdown.focusedItem).toEqual(dropdown.items[0]); const dropdownItem = dropdown.items[0]; input.triggerEventHandler('keydown', UIInteractions.getKeyboardEvent('keydown', 'Enter')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.selectItem).toHaveBeenCalledTimes(1); expect(dropdown.selectItem).toHaveBeenCalledWith(dropdownItem, UIInteractions.getKeyboardEvent('keydown', 'Enter')); expect(dropdown.selectedItem).toEqual(dropdownItem); @@ -1136,8 +1082,7 @@ describe('IgxDropDown ', () => { it('should update aria-activedescendant to the id of the focused item', fakeAsync(() => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const dropdownElement = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`)).nativeElement; let focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)).nativeElement; @@ -1149,17 +1094,14 @@ describe('IgxDropDown ', () => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); UIInteractions.triggerEventHandlerKeyDown('ArrowDown', fixture.debugElement.query(By.css(`.${CSS_CLASS_DROP_DOWN_BASE}`))); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); focusedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_FOCUSED}`)).nativeElement; focusedItemId = focusedItem.getAttribute('id'); @@ -1246,8 +1188,7 @@ describe('IgxDropDown ', () => { it('should apply selected item class', fakeAsync(() => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const selectedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_ITEM}`)); expect(selectedItem.classes[CSS_CLASS_SELECTED]).toBeFalsy(); @@ -1280,15 +1221,13 @@ describe('IgxDropDown ', () => { it('should return items/headers property correctly', fakeAsync(() => { dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items.length).toEqual(15); expect(dropdown.headers).toEqual([]); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dropdown.items[0].disabled = true; dropdown.items[1].isHeader = true; dropdown.items[3].disabled = true; @@ -1298,8 +1237,7 @@ describe('IgxDropDown ', () => { fixture.detectChanges(); dropdown.toggle(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.items.length).toEqual(12); expect(dropdown.headers).toBeTruthy(); expect(dropdown.headers.length).toEqual(3); @@ -1367,43 +1305,37 @@ describe('IgxDropDown ', () => { spyOn(dropdown.closed, 'emit').and.callThrough(); tabs.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(1); expect(dropdown.opened.emit).toHaveBeenCalledTimes(1); let dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`)); dropdownItems[2].triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(1); expect(dropdown.closed.emit).toHaveBeenCalledTimes(1); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(2); expect(dropdown.opened.emit).toHaveBeenCalledTimes(2); dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`)); dropdownItems[1].triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(2); expect(dropdown.closed.emit).toHaveBeenCalledTimes(2); img.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.opening.emit).toHaveBeenCalledTimes(3); expect(dropdown.opened.emit).toHaveBeenCalledTimes(3); dropdownItems = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_ITEM}`)); dropdownItems[0].triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(dropdown.closing.emit).toHaveBeenCalledTimes(3); expect(dropdown.closed.emit).toHaveBeenCalledTimes(3); })); @@ -1423,12 +1355,10 @@ describe('IgxDropDown ', () => { dropdown.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dropdown.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dropdownRect = dropdownItems[0].nativeElement.getBoundingClientRect(); expect(dropdownRect.left).toBe(0); diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts index 8bd497e47b4..7a5feda843f 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts @@ -672,7 +672,6 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { expressionItem.dispatchEvent(new MouseEvent('mouseenter')); fix.detectChanges(); tick(); - fix.detectChanges(); // Click the add icon to display the adding buttons. QueryBuilderFunctions.clickQueryBuilderTreeExpressionChipIcon(fix, [9], 'add'); @@ -711,7 +710,6 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { expressionItem.dispatchEvent(new MouseEvent('mouseenter')); fix.detectChanges(); tick(); - fix.detectChanges(); // Click the add icon to display the adding buttons. QueryBuilderFunctions.clickQueryBuilderTreeExpressionChipIcon(fix, [9], 'add'); @@ -752,7 +750,6 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { expressionItem.dispatchEvent(new MouseEvent('mouseenter')); fix.detectChanges(); tick(); - fix.detectChanges(); // Click the chip to enter edit mode of the expression. QueryBuilderFunctions.clickQueryBuilderTreeExpressionChip(fix, [9]); @@ -1327,7 +1324,6 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => { expressionItem.dispatchEvent(new MouseEvent('mouseenter')); fix.detectChanges(); tick(); - fix.detectChanges(); // Click the add icon to display the adding buttons and verify their content. QueryBuilderFunctions.clickQueryBuilderTreeExpressionChipIcon(fix, [0], 'add'); diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts index 1bb8e4046f8..0e2ba3ea141 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts @@ -360,7 +360,6 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { input.triggerEventHandler('click', null); fix.detectChanges(); tick(); - fix.detectChanges(); const outlet = document.getElementsByClassName('igx-grid__outlet')[0]; const calendar = outlet.getElementsByClassName('igx-calendar')[0]; @@ -371,11 +370,9 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { fix.detectChanges(); tick(); - fix.detectChanges(); input.triggerEventHandler('change', null); fix.detectChanges(); tick(); - fix.detectChanges(); expect(grid.rowList.length).toEqual(1); })); @@ -386,7 +383,6 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { filteringCells[4].query(By.css('igx-chip')).nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); const filterUIRow = fix.debugElement.query(By.css(FILTER_UI_ROW)); const filterIcon = filterUIRow.query(By.css('igx-icon')); const input = filterUIRow.query(By.directive(IgxInputDirective)); @@ -394,12 +390,10 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { filterIcon.nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); input.nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); const outlet = document.getElementsByClassName('igx-grid__outlet')[0]; let calendar = outlet.getElementsByClassName('igx-calendar')[0]; @@ -410,14 +404,12 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { monthView.dispatchEvent(new Event('click')); fix.detectChanges(); tick(); - fix.detectChanges(); const firstMonth = calendar.querySelector('.igx-calendar__month'); const firstMonthText = (firstMonth as HTMLElement).innerText; firstMonth.dispatchEvent(new Event('click')); fix.detectChanges(); tick(); - fix.detectChanges(); calendar = outlet.getElementsByClassName('igx-calendar')[0]; const month = calendar.querySelector('.igx-calendar-picker__date'); @@ -431,7 +423,6 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { filteringCells[4].query(By.css('igx-chip')).nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); const filterUIRow = fix.debugElement.query(By.css(FILTER_UI_ROW)); const filterIcon = filterUIRow.query(By.css('igx-icon')); const input = filterUIRow.query(By.directive(IgxInputDirective)); @@ -439,12 +430,10 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { filterIcon.nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); input.nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); const outlet = document.getElementsByClassName('igx-grid__outlet')[0]; let calendar = outlet.getElementsByClassName('igx-calendar')[0]; @@ -453,13 +442,11 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { monthView.dispatchEvent(new Event('click')); fix.detectChanges(); tick(); - fix.detectChanges(); const firstMonth = calendar.querySelectorAll('.igx-calendar__year')[0]; firstMonth.dispatchEvent(new Event('click')); fix.detectChanges(); tick(); - fix.detectChanges(); calendar = outlet.getElementsByClassName('igx-calendar')[0]; const month = calendar.querySelectorAll('.igx-calendar-picker__date')[1]; @@ -1290,7 +1277,6 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { datePicker.componentInstance.getEditElement().click(); fix.detectChanges(); tick(); - fix.detectChanges(); const outlet = document.getElementsByClassName('igx-grid__outlet')[0]; const calendar = outlet.getElementsByClassName('igx-calendar')[0]; @@ -2246,7 +2232,6 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { datePicker.triggerEventHandler('click', null); fix.detectChanges(); tick(); - fix.detectChanges(); const currentDay = document.querySelector('.igx-days-view__date--current'); @@ -2973,7 +2958,6 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { datePicker.triggerEventHandler('click', null); fix.detectChanges(); tick(); - fix.detectChanges(); const outlet = document.getElementsByClassName('igx-grid__outlet')[0]; const calendar = outlet.getElementsByClassName('igx-calendar')[0]; @@ -2987,7 +2971,6 @@ describe('IgxGrid - Filtering Row UI actions #grid', () => { input.triggerEventHandler('change', null); fix.detectChanges(); tick(); - fix.detectChanges(); expect(grid.rowList.length).toEqual(1); })); @@ -3344,7 +3327,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { moveLeft.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(grid.columns[2].field).toBe('ProductName'); expect(grid.columns[1].field).toBe('Downloads'); @@ -3352,7 +3334,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { moveLeft.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(grid.columns[1].field).toBe('ID'); expect(grid.columns[0].field).toBe('Downloads'); @@ -3361,7 +3342,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { moveRight.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(grid.columns[0].field).toBe('ID'); expect(grid.columns[1].field).toBe('Downloads'); @@ -3807,12 +3787,10 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkbox[0].click(); fix.detectChanges(); tick(); - fix.detectChanges(); checkbox[2].click(); fix.detectChanges(); tick(); - fix.detectChanges(); GridFunctions.clickApplyExcelStyleFiltering(fix); fix.detectChanges(); @@ -4524,13 +4502,11 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkbox[0].click(); // Select All fix.detectChanges(); tick(); - fix.detectChanges(); checkbox[2].click(); // Ignite UI for Angular checkbox[3].click(); // Ignite UI for JavaScript fix.detectChanges(); tick(); - fix.detectChanges(); GridFunctions.clickApplyExcelStyleFiltering(fix, excelMenu); tick(); @@ -4554,14 +4530,12 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkbox[0].click(); // Select All fix.detectChanges(); tick(); - fix.detectChanges(); checkbox[2].click(); // Ignite UI for Angular checkbox[3].click(); // Ignite UI for JavaScript checkbox[4].click(); // NetAdvantage fix.detectChanges(); tick(); - fix.detectChanges(); GridFunctions.clickApplyExcelStyleFiltering(fix, excelMenu); tick(); @@ -4585,7 +4559,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkbox[0].click(); // Select All fix.detectChanges(); tick(); - fix.detectChanges(); checkbox[2].click(); checkbox[3].click(); @@ -4593,7 +4566,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkbox[6].click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(() => { GridFunctions.clickApplyExcelStyleFiltering(fix, excelMenu); @@ -4609,14 +4581,12 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkbox[0].click(); // Select All fix.detectChanges(); tick(); - fix.detectChanges(); checkbox[1].click(); // (Blanks) checkbox[2].click(); // Ignite UI for Angular checkbox[3].click(); // Ignite UI for JavaScript fix.detectChanges(); tick(); - fix.detectChanges(); GridFunctions.clickApplyExcelStyleFiltering(fix, excelMenu); tick(); @@ -5620,7 +5590,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkbox.click(); fix.detectChanges(); tick(); - fix.detectChanges(); const applyButton = GridFunctions.getApplyButtonExcelStyleFiltering(fix); applyButton.focus(); @@ -6126,12 +6095,10 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkboxes[0].click(); fix.detectChanges(); tick(); - fix.detectChanges(); checkboxes[2].click(); fix.detectChanges(); tick(); - fix.detectChanges(); GridFunctions.clickApplyExcelStyleFiltering(fix); tick(); @@ -6324,14 +6291,12 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { (lastExpression.querySelector('igx-select').querySelector('igx-input-group') as HTMLElement).click(); fix.detectChanges(); tick(); - fix.detectChanges(); const dropdownList = fix.debugElement.query(By.css('div.igx-drop-down__list.igx-toggle')); const todayItem = dropdownList.children[0].children.find(item => item.nativeElement?.innerText === 'Today'); todayItem.nativeElement.click(); fix.detectChanges(); tick(); - fix.detectChanges(); GridFunctions.clickClearFilterExcelStyleCustomFiltering(fix); tick(); @@ -6477,7 +6442,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { moveLeft.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(grid.columns[2].field).toBe('ProductName'); expect(grid.columns[1].field).toBe('Downloads'); @@ -6485,7 +6449,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { moveLeft.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(grid.columns[1].field).toBe('ID'); expect(grid.columns[0].field).toBe('Downloads'); @@ -6494,7 +6457,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { moveRight.click(); fix.detectChanges(); tick(); - fix.detectChanges(); expect(grid.columns[0].field).toBe('ID'); expect(grid.columns[1].field).toBe('Downloads'); @@ -6889,7 +6851,6 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => { checkboxElements[2].click(); fix.detectChanges(); tick(); - fix.detectChanges(); GridFunctions.clickApplyExcelStyleFiltering(fix); fix.detectChanges(); @@ -7589,8 +7550,7 @@ const closeChipFromFilteringUIRow = (fix, grid, columnName, index) => { close.triggerEventHandler('click', null); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); const filteringExpressions = grid.filteringExpressionsTree.find(columnName) as FilteringExpressionsTree; verifyEmitFilteringDone(grid, filteringExpressions, 1); diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts index 32fef0974c5..81720de7653 100644 --- a/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/grid/grid-validation.spec.ts @@ -222,14 +222,12 @@ describe('IgxGrid - Validation #grid', () => { cell.errorTooltip.first.close(); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(cell.errorTooltip.first.collapsed).toBeTrue(); const element = fixture.debugElement.query(By.directive(IgxTooltipTargetDirective)).nativeElement; element.dispatchEvent(new MouseEvent('mouseenter')); fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(cell.errorTooltip.first.collapsed).toBeFalse(); })); diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts index 153afd981d6..13eee0cc921 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.spec.ts @@ -1125,7 +1125,6 @@ describe('Basic IgxHierarchicalGrid #hGrid', () => { column.disabledSummaries = ['count']; fixture.detectChanges(); tick(); - fixture.detectChanges(); expect(getterSpy).toHaveBeenCalledTimes(7); expect(summaryCell.textContent.trim()).toEqual(''); @@ -1466,7 +1465,6 @@ describe('Basic IgxHierarchicalGrid #hGrid', () => { fixture.componentInstance.islandCols2.push('Col2'); fixture.detectChanges(); tick(); - fixture.detectChanges(); child2Headers = child2Grid.queryAll(By.css('igx-grid-header')); expect(child2Headers.length).toEqual(4); @@ -1517,7 +1515,6 @@ describe('Basic IgxHierarchicalGrid #hGrid', () => { fixture.componentInstance.islandCols2.push('Col2'); fixture.detectChanges(); tick(); - fixture.detectChanges(); UIInteractions.simulateClickAndSelectEvent(row1.expander); fixture.detectChanges(); diff --git a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.spec.ts b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.spec.ts index 248b0108b4b..2bbeda44a15 100644 --- a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.spec.ts +++ b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.spec.ts @@ -201,8 +201,7 @@ describe('IgxQueryBuilder', () => { const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[0] as HTMLElement).click(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); // Newly added condition should be empty QueryBuilderFunctions.verifyEditModeExpressionInputStates(fix, true, false, false, false); @@ -239,8 +238,7 @@ describe('IgxQueryBuilder', () => { const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[1] as HTMLElement).click(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); // Newly added condition should be empty QueryBuilderFunctions.verifyEditModeExpressionInputStates(fix, true, false, false, false); @@ -299,8 +297,7 @@ describe('IgxQueryBuilder', () => { const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[1] as HTMLElement).click(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); // Newly added condition should be empty QueryBuilderFunctions.verifyEditModeExpressionInputStates(fix, true, false, false, false); @@ -1666,8 +1663,7 @@ describe('IgxQueryBuilder', () => { //cancel edit closeBtn.click(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); //Verify changes are reverted QueryBuilderFunctions.verifyExpressionChipContent(fix, [1], 'OrderId', 'Greater Than', '3'); @@ -1747,8 +1743,7 @@ describe('IgxQueryBuilder', () => { const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[0] as HTMLElement).click(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); QueryBuilderFunctions.selectColumnInEditModeExpression(fix, 3); // Select 'Delivered' column. QueryBuilderFunctions.selectOperatorInEditModeExpression(fix, 1); // Select 'True' operator. @@ -1779,8 +1774,7 @@ describe('IgxQueryBuilder', () => { const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[0] as HTMLElement).click(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); // Click on the 'close' button const closeBtn = QueryBuilderFunctions.getQueryBuilderExpressionCloseButton(fix); @@ -1806,8 +1800,7 @@ describe('IgxQueryBuilder', () => { const buttons = Array.from(buttonsContainer.querySelectorAll('button')); (buttons[0] as HTMLElement).click(); fix.detectChanges(); - tick(); - fix.detectChanges(); + tick(); // Add condition with 'in' operator to open inner query QueryBuilderFunctions.selectColumnInEditModeExpression(fix, 0); // Select 'OrderName' column. @@ -2411,8 +2404,7 @@ describe('IgxQueryBuilder', () => { // Open the combo (combo.querySelector('igx-input-group') as HTMLElement).click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); // Select item const outlet = Array.from(document.querySelectorAll(`.igx-drop-down__list-scroll`)) .filter(item => (item as HTMLElement).checkVisibility())[0] as HTMLElement; @@ -2420,8 +2412,7 @@ describe('IgxQueryBuilder', () => { const comboItem = outlet.querySelectorAll(`.igx-drop-down__item`)[0] as HTMLElement; comboItem.click(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); // Commit the expression QueryBuilderFunctions.clickQueryBuilderExpressionCommitButton(fixture); diff --git a/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts b/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts index 4293e7ddc6c..9f6712b2269 100644 --- a/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts +++ b/projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts @@ -1311,7 +1311,6 @@ describe('igxOverlay', () => { document.body.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); wrapperElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_WRAPPER)[0] as HTMLElement; @@ -1349,7 +1348,6 @@ describe('igxOverlay', () => { fixture.detectChanges(); tick(); - fixture.detectChanges(); wrapperElement = shadowRoot.querySelector(`.${CLASS_OVERLAY_WRAPPER}`) as HTMLElement; expect(wrapperElement.style.visibility).toEqual(''); @@ -1357,7 +1355,6 @@ describe('igxOverlay', () => { document.body.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); wrapperElement = shadowRoot.querySelector(`.${CLASS_OVERLAY_WRAPPER}`) as HTMLElement; expect(wrapperElement.style.visibility).toEqual('hidden'); @@ -2343,8 +2340,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - - fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; expect(contentElement.children.length).toEqual(1); @@ -2834,7 +2829,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; @@ -3733,8 +3727,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - - fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; const expectedStyle = 'width:100px; height:100px; background-color:red'; @@ -3787,8 +3779,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - - fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; let overlayStyle = contentElement.getElementsByTagName('div')[0].getAttribute('style'); @@ -3840,8 +3830,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - - fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; const expectedStyle = 'width:100px; height:100px; background-color:red'; @@ -3893,7 +3881,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) @@ -3948,7 +3935,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; @@ -3996,7 +3982,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; @@ -4043,7 +4028,6 @@ describe('igxOverlay', () => { buttonElement.click(); fixture.detectChanges(); tick(); - fixture.detectChanges(); const contentElement = (fixture.nativeElement as HTMLElement) .parentElement.getElementsByClassName(CLASS_OVERLAY_CONTENT)[0] as HTMLElement; diff --git a/projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts b/projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts index 73e39305f64..acea5a1e6b1 100644 --- a/projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts +++ b/projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts @@ -514,8 +514,7 @@ describe('IgxTimePicker', () => { toggleIcon.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeTruthy(); const pickerValue = new Date(fixture.componentInstance.date); pickerValue.setHours(pickerValue.getHours() - 1); @@ -525,8 +524,7 @@ describe('IgxTimePicker', () => { it('should open the dropdown with `ArrowDown` + `Alt` key press and close it on outside click', fakeAsync(() => { UIInteractions.triggerEventHandlerKeyDown('ArrowDown', timePickerDebElement, true); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeFalsy(); const event = new WheelEvent('wheel', { deltaX: 0, deltaY: -100 }); @@ -550,8 +548,7 @@ describe('IgxTimePicker', () => { const input = fixture.debugElement.query(By.css(CSS_CLASS_INPUT)); input.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeFalsy(); const event = new WheelEvent('wheel', { deltaX: 0, deltaY: -100 }); @@ -609,8 +606,7 @@ describe('IgxTimePicker', () => { it('should open/close the dropdown and keep the current selection on Space/Enter key press', fakeAsync(() => { UIInteractions.triggerEventHandlerKeyDown(' ', timePickerDebElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeFalsy(); const event = new WheelEvent('wheel', { deltaX: 0, deltaY: -100 }); @@ -649,8 +645,7 @@ describe('IgxTimePicker', () => { UIInteractions.triggerEventHandlerKeyDown('Escape', timePickerDebElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeTruthy(); expect(timePicker.value).toEqual(fixture.componentInstance.date); })); @@ -658,8 +653,7 @@ describe('IgxTimePicker', () => { it('should not change the current selection and close the dropdown on OK button click', fakeAsync(() => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const event = new WheelEvent('wheel', { deltaX: 0, deltaY: -100 }); hourColumn.triggerEventHandler('wheel', event); @@ -668,8 +662,7 @@ describe('IgxTimePicker', () => { const okButton = fixture.debugElement.queryAll(By.css('button'))[1]; okButton.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeTruthy(); const pickerValue = new Date(fixture.componentInstance.date); @@ -680,8 +673,7 @@ describe('IgxTimePicker', () => { it('should close the dropdown and discard the current selection on Cancel button click', fakeAsync(() => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const event = new WheelEvent('wheel', { deltaX: 0, deltaY: -100 }); hourColumn.triggerEventHandler('wheel', event); @@ -690,8 +682,7 @@ describe('IgxTimePicker', () => { const cancelButton = fixture.debugElement.queryAll(By.css('button'))[0]; cancelButton.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeTruthy(); expect(timePicker.value).toEqual(fixture.componentInstance.date); @@ -705,16 +696,14 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeFalsy(); expect(timePicker.opening.emit).toHaveBeenCalled(); expect(timePicker.opened.emit).toHaveBeenCalled(); timePicker.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeTruthy(); expect(timePicker.closing.emit).toHaveBeenCalled(); expect(timePicker.closed.emit).toHaveBeenCalled(); @@ -730,8 +719,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeTruthy(); expect(timePicker.opening.emit).toHaveBeenCalled(); expect(timePicker.opened.emit).not.toHaveBeenCalled(); @@ -742,13 +730,11 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); timePicker.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeFalsy(); expect(timePicker.closing.emit).toHaveBeenCalled(); expect(timePicker.closed.emit).not.toHaveBeenCalled(); @@ -856,8 +842,7 @@ describe('IgxTimePicker', () => { const toggleIcon = fixture.debugElement.query(By.css('igx-prefix')); toggleIcon.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeTrue(); expect((timePicker.value as Date).getHours()).toEqual(expectedValuedHour); @@ -908,8 +893,7 @@ describe('IgxTimePicker', () => { const toggleIcon = fixture.debugElement.query(By.css('igx-prefix')); toggleIcon.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeTrue(); expect((timePicker.value as Date).getHours()).toEqual(expectedValuedHour); @@ -1214,24 +1198,21 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); let dropdown = fixture.debugElement.query(By.css(CSS_CLASS_DROPDOWN)); expect(dropdown).toBeDefined(); timePicker.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); fixture.componentInstance.timePicker.mode = PickerInteractionMode.Dialog; fixture.detectChanges(); timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dropdown = fixture.debugElement.query(By.css(CSS_CLASS_DROPDOWN)); expect(dropdown).toBeNull(); @@ -1255,8 +1236,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); const selectedHour = selectedItems[0].nativeElement.innerText; @@ -1280,8 +1260,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); const selectedHour = selectedItems[0].nativeElement.innerText; @@ -1353,8 +1332,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const hourHeader = fixture.debugElement.query(By.css(CSS_CLASS_HEADER_HOUR)); const selectedTime = hourHeader.children[0].nativeElement.innerText; @@ -1376,8 +1354,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(inputEl.getAttribute('aria-expanded')).toEqual('true'); let selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); @@ -1405,8 +1382,7 @@ describe('IgxTimePicker', () => { timePicker.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(inputEl.getAttribute('aria-expanded')).toEqual('false'); timePicker.value = new Date(2021, 24, 2, 6, 42, 0); @@ -1417,8 +1393,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); selectedHour = selectedItems[0]; @@ -1436,8 +1411,7 @@ describe('IgxTimePicker', () => { const item = ampmColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); selectedHour = selectedItems[0]; @@ -1454,8 +1428,7 @@ describe('IgxTimePicker', () => { timePicker.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); })); it('should select closest value when value does not match dropdown values', fakeAsync(() => { @@ -1466,8 +1439,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); const selectedHour = selectedItems[0].nativeElement.innerText; @@ -1487,8 +1459,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); const selectedHour = selectedItems[0].nativeElement.innerText; @@ -1509,8 +1480,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); const selectedHour = selectedItems[0].nativeElement.innerText; @@ -1528,8 +1498,7 @@ describe('IgxTimePicker', () => { secondsColumn = fixture.debugElement.query(By.css(CSS_CLASS_SECONDSLIST)); timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeFalsy(); const expectedHour = '12'; @@ -1541,8 +1510,7 @@ describe('IgxTimePicker', () => { item = ampmColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); let selectedAMPM = selectedItems[3].nativeElement.innerText; expect(selectedAMPM).toEqual(expectedAmPm); @@ -1550,8 +1518,7 @@ describe('IgxTimePicker', () => { item = hourColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); const selectedHour = selectedItems[0].nativeElement.innerText; expect(selectedHour).toEqual(expectedHour); @@ -1559,8 +1526,7 @@ describe('IgxTimePicker', () => { item = minutesColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); const selectedMinute = selectedItems[1].nativeElement.innerText; expect(selectedMinute).toEqual(expectedMinute); @@ -1568,8 +1534,7 @@ describe('IgxTimePicker', () => { item = secondsColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); const selectedSecond = selectedItems[2].nativeElement.innerText; expect(selectedSecond).toEqual(expectedSecond); @@ -1580,8 +1545,7 @@ describe('IgxTimePicker', () => { item = ampmColumn.queryAll(By.directive(IgxTimeItemDirective))[4]; item.triggerEventHandler('click', UIInteractions.getMouseEvent('click')); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); selectedItems = fixture.debugElement.queryAll(By.css(CSS_CLASS_SELECTED_ITEM)); selectedAMPM = selectedItems[3].nativeElement.innerText; expect(selectedAMPM).toEqual(expectedAmPm); @@ -1614,16 +1578,14 @@ describe('IgxTimePicker', () => { timePicker.mode = PickerInteractionMode.Dialog; timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.headerOrientation).toEqual('horizontal'); let dialogDivVertical = timePickerDebElement.query(By.css(CSS_CLASS_TIME_PICKER_VERTICAL)); expect(dialogDivVertical).toBeNull(); timePicker.close(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); timePicker.mode = PickerInteractionMode.Dialog; timePicker.headerOrientation = 'vertical'; @@ -1631,8 +1593,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); dialogDivVertical = timePickerDebElement.query(By.css(CSS_CLASS_TIME_PICKER_VERTICAL)); expect(dialogDivVertical).not.toBeNull(); @@ -1645,8 +1606,7 @@ describe('IgxTimePicker', () => { timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); const header = fixture.debugElement.query(By.css(CSS_CLASS_HEADER)); expect(header).toBeNull(); @@ -1712,8 +1672,7 @@ describe('IgxTimePicker', () => { UIInteractions.triggerEventHandlerKeyDown(' ', timePickerDebElement); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeFalsy(); expect(timePicker.opening.emit).toHaveBeenCalledTimes(1); @@ -1727,8 +1686,7 @@ describe('IgxTimePicker', () => { expect(timePicker.collapsed).toBeTruthy(); timePicker.open(); fixture.detectChanges(); - tick(); - fixture.detectChanges(); + tick(); expect(timePicker.collapsed).toBeFalsy(); UIInteractions.triggerKeyDownEvtUponElem('Escape', timePickerElement, true);