Skip to content

Commit e78694f

Browse files
PlamenaMitevaPlamenaMiteva
committed
test(overlay): fix failing tests with Ivy#6692
1 parent 93606a9 commit e78694f

File tree

3 files changed

+36
-24
lines changed

3 files changed

+36
-24
lines changed

‎projects/igniteui-angular/src/lib/directives/autocomplete/autocomplete.directive.spec.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -369,7 +369,10 @@ describe('IgxAutocomplete', () => {
369369
expect(dropdownListScrollElement.children[itemIndex].nativeElement.textContent.trim()).
370370
toEqual(filteredTowns[itemIndex]);
371371
const isFocused = itemIndex === 0 ? true : false;
372-
expect(dropdownListScrollElement.children[itemIndex].classes[CSS_CLASS_DROP_DOWN_ITEM_FOCUSED]).toEqual(isFocused);
372+
const hasFocusedClass =
373+
dropdownListScrollElement.children[itemIndex].nativeElement.classList.contains(CSS_CLASS_DROP_DOWN_ITEM_FOCUSED);
374+
isFocused ? expect(hasFocusedClass).toBeTruthy() :
375+
expect(hasFocusedClass).toBeFalsy();
373376
expect(dropDown.items[itemIndex].focused).toEqual(isFocused);
374377
}
375378
};

‎projects/igniteui-angular/src/lib/services/overlay/overlay.spec.ts‎

Lines changed: 19 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1678,8 +1678,8 @@ describe('igxOverlay', () => {
16781678
const wrappers = document.getElementsByClassName(CLASS_OVERLAY_CONTENT);
16791679
const wrapperContent = wrappers[wrappers.length - 1].lastElementChild; // wrapped in NG-COMPONENT
16801680
expect(wrapperContent.children.length).toEqual(1);
1681-
expect(wrapperContent.lastElementChild.getAttribute('style'))
1682-
.toEqual('width:100px; height: 100px; background-color: red');
1681+
expect(wrapperContent.lastElementChild.getAttribute('style').replace(/:\s/g, ':').replace(/red;/, 'red'))
1682+
.toEqual('width:100px; height:100px; background-color:red');
16831683
}));
16841684

16851685
it('Should show the component inside of the viewport if it would normally be outside of bounds, BOTTOM + RIGHT.', fakeAsync(() => {
@@ -1702,8 +1702,9 @@ describe('igxOverlay', () => {
17021702
fix.detectChanges();
17031703
const wrappers = document.getElementsByClassName(CLASS_OVERLAY_CONTENT);
17041704
const wrapperContent = wrappers[wrappers.length - 1] as HTMLElement; // wrapped in NG-COMPONENT
1705-
const expectedStyle = 'width:100px; height: 100px; background-color: red';
1706-
expect(wrapperContent.lastElementChild.lastElementChild.getAttribute('style')).toEqual(expectedStyle);
1705+
const expectedStyle = 'width:100px; height:100px; background-color:red';
1706+
expect(wrapperContent.lastElementChild.lastElementChild.getAttribute('style').replace(/:\s/g, ':').replace(/red;/, 'red'))
1707+
.toEqual(expectedStyle);
17071708
const buttonLeft = buttonElement.offsetLeft;
17081709
const buttonTop = buttonElement.offsetTop;
17091710
const expectedLeft = buttonLeft - wrapperContent.lastElementChild.lastElementChild.clientWidth;
@@ -2131,8 +2132,8 @@ describe('igxOverlay', () => {
21312132
const wrappers = document.getElementsByClassName(CLASS_OVERLAY_CONTENT);
21322133
const wrapperContent = wrappers[wrappers.length - 1].lastElementChild; // wrapped in NG-COMPONENT
21332134
expect(wrapperContent.children.length).toEqual(1);
2134-
expect(wrapperContent.lastElementChild.getAttribute('style'))
2135-
.toEqual('width:100px; height: 100px; background-color: red');
2135+
expect(wrapperContent.lastElementChild.getAttribute('style').replace(/:\s/g, ':').replace(/red;/, 'red'))
2136+
.toEqual('width:100px; height:100px; background-color:red');
21362137
}));
21372138

21382139
it('Should show the component inside of the viewport if it would normally be outside of bounds, BOTTOM + RIGHT.', fakeAsync(() => {
@@ -2910,8 +2911,9 @@ describe('igxOverlay', () => {
29102911
fix.detectChanges();
29112912
const wrappers = document.getElementsByClassName(CLASS_OVERLAY_CONTENT);
29122913
const wrapperContent = wrappers[wrappers.length - 1] as HTMLElement;
2913-
const expectedStyle = 'width:100px; height: 100px; background-color: red';
2914-
expect(wrapperContent.lastElementChild.lastElementChild.getAttribute('style')).toEqual(expectedStyle);
2914+
const expectedStyle = 'width:100px; height:100px; background-color:red';
2915+
expect(wrapperContent.lastElementChild.lastElementChild.getAttribute('style').replace(/:\s/g, ':').replace(/red;/, 'red'))
2916+
.toEqual(expectedStyle);
29152917
const buttonLeft = buttonElement.offsetLeft;
29162918
const buttonTop = buttonElement.offsetTop;
29172919
const expectedLeft = buttonLeft + buttonElement.clientWidth; // To the right of the button
@@ -2960,8 +2962,9 @@ describe('igxOverlay', () => {
29602962
fix.detectChanges();
29612963
const wrappers = document.getElementsByClassName(CLASS_OVERLAY_CONTENT);
29622964
const wrapperContent = wrappers[wrappers.length - 1] as HTMLElement;
2963-
const expectedStyle = 'width:100px; height: 100px; background-color: red';
2964-
expect(wrapperContent.lastElementChild.lastElementChild.getAttribute('style')).toEqual(expectedStyle);
2965+
const expectedStyle = 'width:100px; height:100px; background-color:red';
2966+
expect(wrapperContent.lastElementChild.lastElementChild.getAttribute('style').replace(/:\s/g, ':').replace(/red;/, 'red'))
2967+
.toEqual(expectedStyle);
29652968
const buttonLeft = buttonElement.offsetLeft;
29662969
const buttonTop = buttonElement.offsetTop;
29672970
const expectedRight = buttonLeft; // To the left of the button
@@ -3009,8 +3012,9 @@ describe('igxOverlay', () => {
30093012
fix.detectChanges();
30103013
const wrappers = document.getElementsByClassName(CLASS_OVERLAY_CONTENT);
30113014
const contentElement = wrappers[wrappers.length - 1] as HTMLElement; // wrapper in NG-COMPONENT
3012-
const expectedStyle = 'width:100px; height: 100px; background-color: red';
3013-
expect(contentElement.lastElementChild.lastElementChild.getAttribute('style')).toEqual(expectedStyle);
3015+
const expectedStyle = 'width:100px; height:100px; background-color:red';
3016+
expect(contentElement.lastElementChild.lastElementChild.getAttribute('style').replace(/:\s/g, ':').replace(/red;/, 'red'))
3017+
.toEqual(expectedStyle);
30143018
const expectedRight = buttonElement.offsetLeft;
30153019
const expectedTop = buttonElement.offsetTop + buttonElement.clientHeight;
30163020
const contentElementRect = contentElement.getBoundingClientRect();
@@ -3058,8 +3062,9 @@ describe('igxOverlay', () => {
30583062
fix.detectChanges();
30593063
const wrappers = document.getElementsByClassName(CLASS_OVERLAY_CONTENT);
30603064
const wrapperContent = wrappers[wrappers.length - 1] as HTMLElement;
3061-
const expectedStyle = 'width:100px; height: 100px; background-color: red';
3062-
expect(wrapperContent.lastElementChild.lastElementChild.getAttribute('style')).toEqual(expectedStyle);
3065+
const expectedStyle = 'width:100px; height:100px; background-color:red';
3066+
expect(wrapperContent.lastElementChild.lastElementChild.getAttribute('style').replace(/:\s/g, ':').replace(/red;/, 'red'))
3067+
.toEqual(expectedStyle);
30633068
const buttonLeft = buttonElement.offsetLeft;
30643069
const buttonTop = buttonElement.offsetTop;
30653070
const expectedLeft = buttonLeft + buttonElement.clientWidth; // To the right of the button

‎projects/igniteui-angular/src/lib/time-picker/time-picker.component.spec.ts‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1419,8 +1419,10 @@ describe('IgxTimePicker', () => {
14191419
UIInteractions.simulateWheelEvent(AMPMColumn.nativeElement, 0, -10);
14201420
fixture.detectChanges();
14211421

1422-
expect(AMPMColumn.children[0].nativeElement.innerText).toBe('AM');
1423-
expect(AMPMColumn.children[1].nativeElement.innerText).toBe('PM');
1422+
const AMIndicator = AMPMColumn.children.find(item => item.nativeElement.innerText === 'AM');
1423+
const PMIndicator = AMPMColumn.children.find(item => item.nativeElement.innerText === 'PM');
1424+
expect(AMIndicator).not.toBeUndefined();
1425+
expect(PMIndicator).not.toBeUndefined();
14241426

14251427
// expect input value to be changed
14261428
expect(input.nativeElement.value).toBe('04:50 AM');
@@ -1999,26 +2001,28 @@ describe('IgxTimePicker', () => {
19992001
// Bug #6025 Date picker does not disable in reactive form
20002002
it('Should disable when form is disabled', fakeAsync(() => {
20012003
fixture.detectChanges();
2004+
const mockClickEvent = new Event('click');
20022005
const formGroup: FormGroup = fixture.componentInstance.reactiveForm;
2003-
const timeIcon = fixture.debugElement.query(By.css('.igx-icon'));
2006+
let timeIcon = fixture.debugElement.query(By.css('.igx-icon'));
20042007

2005-
timeIcon.nativeElement.click();
2006-
tick();
2008+
timeIcon.triggerEventHandler('click', mockClickEvent);
20072009
fixture.detectChanges();
2008-
const timeDropDown = fixture.debugElement.query(By.css('.igx-time-picker--dropdown'));
2010+
let timeDropDown = fixture.debugElement.query(By.css('.igx-time-picker--dropdown'));
20092011
expect(timeDropDown.properties.hidden).toBeFalsy();
20102012

20112013
timePicker.close();
2014+
tick();
20122015
fixture.detectChanges();
20132016

20142017
formGroup.disable();
20152018
tick();
20162019
fixture.detectChanges();
2020+
timeIcon = fixture.debugElement.query(By.css('.igx-icon'));
20172021

2018-
timeIcon.nativeElement.click();
2019-
tick();
2022+
timeIcon.triggerEventHandler('click', mockClickEvent);
20202023
fixture.detectChanges();
2021-
expect(timeDropDown.properties).toEqual({});
2024+
timeDropDown = fixture.debugElement.query(By.css('.igx-time-picker--dropdown'));
2025+
expect(timeDropDown.classes['igx-toggle--hidden']).toEqual(true);
20222026
}));
20232027
});
20242028
});

0 commit comments

Comments
 (0)