Skip to content

Commit 355c886

Browse files
LipataLipata
authored
Merge branch 'master' into nalipiev/node-ci
2 parents 6f040ee + 2d17af8 commit 355c886

File tree

3 files changed

+38
-34
lines changed

3 files changed

+38
-34
lines changed

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

Lines changed: 28 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ const CSS_CLASS_EMPTY = 'igx-combo__empty';
5656
const CSS_CLASS_ITEM_CHECKBOX = 'igx-combo__checkbox';
5757
const CSS_CLASS_ITME_CHECKBOX_CHECKED = 'igx-checkbox--checked';
5858
const defaultDropdownItemHeight = 40;
59-
const defaultDropdownItemMaxHeight = 400;
59+
const defaultDropdownItemMaxHeight = 240;
6060

6161
describe('igxCombo', () => {
6262
let fixture: ComponentFixture<any>;
@@ -1195,17 +1195,18 @@ describe('igxCombo', () => {
11951195
it('should render selected items properly', () => {
11961196
combo.toggle();
11971197
fixture.detectChanges();
1198+
11981199
const dropdownList = fixture.debugElement.query(By.css(`.${CSS_CLASS_DROPDOWNLIST_SCROLL}`)).nativeElement;
11991200
const dropdownItems = dropdownList.querySelectorAll(`.${CSS_CLASS_DROPDOWNLISTITEM}`);
1201+
1202+
12001203
expect(dropdownItems[1].classList.contains(CSS_CLASS_SELECTED)).toBeFalsy();
12011204
expect(dropdownItems[3].classList.contains(CSS_CLASS_SELECTED)).toBeFalsy();
1202-
expect(dropdownItems[7].classList.contains(CSS_CLASS_SELECTED)).toBeFalsy();
12031205

1204-
combo.select(['Illinois', 'Mississippi', 'Ohio']);
1206+
combo.select(['Illinois', 'Ohio']);
12051207
fixture.detectChanges();
12061208
expect(dropdownItems[1].classList.contains(CSS_CLASS_SELECTED)).toBeTruthy();
12071209
expect(dropdownItems[3].classList.contains(CSS_CLASS_SELECTED)).toBeTruthy();
1208-
expect(dropdownItems[7].classList.contains(CSS_CLASS_SELECTED)).toBeTruthy();
12091210

12101211
combo.deselect(['Ohio']);
12111212
fixture.detectChanges();
@@ -1225,9 +1226,9 @@ describe('igxCombo', () => {
12251226
expect(focusedItem_1.classList.contains(CSS_CLASS_FOCUSED)).toBeTruthy();
12261227

12271228
// Change focus
1228-
dropdown.navigateItem(6);
1229+
dropdown.navigateItem(4);
12291230
fixture.detectChanges();
1230-
const focusedItem_2 = dropdownItems[5];
1231+
const focusedItem_2 = dropdownItems[3];
12311232
expect(focusedItem_2.classList.contains(CSS_CLASS_FOCUSED)).toBeTruthy();
12321233
expect(focusedItem_1.classList.contains(CSS_CLASS_FOCUSED)).toBeFalsy();
12331234
});
@@ -1772,7 +1773,7 @@ describe('igxCombo', () => {
17721773
dropdown.toggle();
17731774
fixture.detectChanges();
17741775
expect(dropdown.items).toBeDefined();
1775-
expect(dropdown.items.length).toEqual(9);
1776+
expect(dropdown.items.length).toEqual(5);
17761777
dropdown.onFocus();
17771778
expect(dropdown.focusedItem).toEqual(dropdown.items[0]);
17781779
expect(dropdown.focusedItem.focused).toEqual(true);
@@ -1894,17 +1895,17 @@ describe('igxCombo', () => {
18941895
selectedItemsCount++;
18951896
selectAndVerifyItem(0);
18961897

1897-
for (let index = 1; index < 7; index++) {
1898+
for (let index = 1; index < 5; index++) {
18981899
focusAndVerifyItem(index, 'ArrowDown');
18991900
}
19001901
selectedItemsCount++;
1901-
selectAndVerifyItem(6);
1902+
selectAndVerifyItem(4);
19021903

1903-
for (let index = 5; index > 3; index--) {
1904+
for (let index = 3; index >= 2; index--) {
19041905
focusAndVerifyItem(index, 'ArrowUp');
19051906
}
19061907
selectedItemsCount++;
1907-
selectAndVerifyItem(4);
1908+
selectAndVerifyItem(2);
19081909
});
19091910
it('should properly navigate using HOME/END key', (async () => {
19101911
let firstVisibleItem: Element;
@@ -2072,7 +2073,7 @@ describe('igxCombo', () => {
20722073
const scrollbar = fixture.debugElement.query(By.css(`.${CSS_CLASS_SCROLLBAR_VERTICAL}`)).nativeElement as HTMLElement;
20732074
expect(scrollbar.scrollTop).toEqual(0);
20742075

2075-
combo.virtualScrollContainer.scrollTo(16);
2076+
combo.virtualScrollContainer.scrollTo(12);
20762077
await firstValueFrom(combo.virtualScrollContainer.chunkLoad);
20772078
fixture.detectChanges();
20782079
let selectedItem = fixture.debugElement.queryAll(By.css(`.${CSS_CLASS_DROPDOWNLISTITEM}`))[1];
@@ -2088,7 +2089,7 @@ describe('igxCombo', () => {
20882089
// Content was scrolled to bottom
20892090
expect(scrollbar.scrollHeight - scrollbar.scrollTop).toEqual(scrollbar.clientHeight);
20902091

2091-
combo.virtualScrollContainer.scrollTo(5);
2092+
combo.virtualScrollContainer.scrollTo(4);
20922093
await firstValueFrom(combo.virtualScrollContainer.chunkLoad);
20932094
fixture.detectChanges();
20942095
selectedItem = fixture.debugElement.query(By.css(`.${CSS_CLASS_SELECTED}`));
@@ -2163,15 +2164,14 @@ describe('igxCombo', () => {
21632164
expect(input.nativeElement.value).toEqual(expectedOutput);
21642165
});
21652166
it('should dismiss all selected items by pressing clear button', () => {
2166-
const expectedOutput = 'Kentucky, Ohio, Indiana';
2167-
combo.select(['Kentucky', 'Ohio', 'Indiana']);
2167+
const expectedOutput = 'Ohio, Indiana';
2168+
combo.select(['Ohio', 'Indiana']);
21682169
fixture.detectChanges();
21692170
expect(input.nativeElement.value).toEqual(expectedOutput);
21702171
combo.toggle();
21712172
fixture.detectChanges();
21722173
expect(combo.dropdown.items[1].selected).toBeTruthy();
21732174
expect(combo.dropdown.items[4].selected).toBeTruthy();
2174-
expect(combo.dropdown.items[6].selected).toBeTruthy();
21752175

21762176
const clearBtn = fixture.debugElement.query(By.css(`.${CSS_CLASS_CLEARBUTTON}`));
21772177
clearBtn.triggerEventHandler('click', UIInteractions.getMouseEvent('click'));
@@ -2184,7 +2184,6 @@ describe('igxCombo', () => {
21842184
fixture.detectChanges();
21852185
expect(combo.dropdown.items[1].selected).toBeFalsy();
21862186
expect(combo.dropdown.items[4].selected).toBeFalsy();
2187-
expect(combo.dropdown.items[6].selected).toBeFalsy();
21882187
});
21892188
it('should show/hide clear button after selecting/deselecting items', () => {
21902189
// This is a workaround for issue github.com/angular/angular/issues/14235
@@ -2242,8 +2241,8 @@ describe('igxCombo', () => {
22422241
cancel: false
22432242
});
22442243

2245-
const selectedItem_2 = dropdown.items[5];
2246-
simulateComboItemClick(5);
2244+
const selectedItem_2 = dropdown.items[4];
2245+
simulateComboItemClick(4);
22472246
expect(combo.selection[1]).toEqual(selectedItem_2.value);
22482247
expect(combo.value[1]).toEqual(selectedItem_2.value[combo.valueKey]);
22492248
expect(selectedItem_2.selected).toBeTruthy();
@@ -2691,19 +2690,19 @@ describe('igxCombo', () => {
26912690
combo.toggle();
26922691
fixture.detectChanges();
26932692
let headers = combo.dropdown.headers.map(header => header.element.nativeElement.innerText);
2694-
expect(headers).toEqual(['Ángel', 'Boris', 'México', 'Méxícó']);
2693+
expect(headers).toEqual(['Ángel', 'Boris', 'México']);
26952694

26962695
combo.groupSortingDirection = SortingDirection.Desc;
26972696
combo.toggle();
26982697
fixture.detectChanges();
26992698
headers = combo.dropdown.headers.map(header => header.element.nativeElement.innerText);
2700-
expect(headers).toEqual(['Méxícó', 'México', 'Boris', 'Ángel']);
2699+
expect(headers).toEqual(['Méxícó', 'México', 'Boris']);
27012700

27022701
combo.groupSortingDirection = SortingDirection.None;
27032702
combo.toggle();
27042703
fixture.detectChanges();
27052704
headers = combo.dropdown.headers.map(header => header.element.nativeElement.innerText);
2706-
expect(headers).toEqual(['Méxícó', 'Ángel', 'México', 'Boris']);
2705+
expect(headers).toEqual(['Méxícó', 'Ángel', 'México']);
27072706
});
27082707
});
27092708
describe('Filtering tests: ', () => {
@@ -2862,8 +2861,8 @@ describe('igxCombo', () => {
28622861

28632862
verifyFilteredItems('jose', 1);
28642863
verifyFilteredItems('mexico', 3);
2865-
verifyFilteredItems('o', 7);
2866-
verifyFilteredItems('é', 7);
2864+
verifyFilteredItems('o', 6);
2865+
verifyFilteredItems('é', 6);
28672866
}));
28682867

28692868
it('should filter the dropdown items when typing in the search input', fakeAsync(() => {
@@ -2888,9 +2887,9 @@ describe('igxCombo', () => {
28882887
dropdownItems = dropdownList.querySelectorAll(`.${CSS_CLASS_DROPDOWNLISTITEM}`);
28892888
expect(dropdownItems.length).toEqual(expectedItemsNumber);
28902889
};
2891-
verifyFilteredItems('M', 7);
2890+
verifyFilteredItems('M', 4);
28922891

2893-
verifyFilteredItems('Mi', 5);
2892+
verifyFilteredItems('Mi', 3);
28942893
expectedValues = expectedValues.filter(data => data.field.toLowerCase().includes('mi'));
28952894
checkFilteredItems(dropdownItems);
28962895

@@ -2960,9 +2959,9 @@ describe('igxCombo', () => {
29602959
expect(combo.filteredData.length).toEqual(expectedFilteredItemsNumber);
29612960
};
29622961

2963-
verifyFilteredItems('M', 7, 15);
2964-
verifyFilteredItems('Mi', 5, 5);
2965-
verifyFilteredItems('M', 7, 15);
2962+
verifyFilteredItems('M', 4, 15);
2963+
verifyFilteredItems('Mi', 3, 5);
2964+
verifyFilteredItems('M', 4, 15);
29662965
combo.filteredData.forEach((item) => expect(combo.data).toContain(item));
29672966
});
29682967
it('should clear the search input and close the dropdown list on pressing ESC key', fakeAsync(() => {
@@ -3768,7 +3767,6 @@ class IgxComboFormComponent {
37683767
password: ['', Validators.required],
37693768
townCombo: [[this.items[0]], Validators.required]
37703769
});
3771-
37723770
}
37733771
public onSubmitReactive() { }
37743772

‎projects/igniteui-angular/src/lib/core/styles/components/combo/_combo-theme.scss‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,9 +98,15 @@
9898
}
9999

100100
%igx-combo__content {
101+
--item-count: 6;
102+
101103
position: relative;
102104
overflow: hidden;
103-
max-height: calc(var(--size) * 10);
105+
max-height: calc(var(--size) * var(--item-count));
106+
107+
@if $variant == 'indigo' {
108+
max-height: calc(var(--size) * var(--item-count) + rem(16px));
109+
}
104110

105111
&:focus {
106112
outline: transparent;

‎projects/igniteui-angular/src/lib/simple-combo/simple-combo.component.spec.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ const CSS_CLASS_FOOTER = 'footer-class';
3939
const CSS_CLASS_INPUT_GROUP_REQUIRED = 'igx-input-group--required';
4040
const CSS_CLASS_INPUT_GROUP_INVALID = 'igx-input-group--invalid';
4141
const defaultDropdownItemHeight = 40;
42-
const defaultDropdownItemMaxHeight = 400;
42+
const defaultDropdownItemMaxHeight = 240;
4343

4444
describe('IgxSimpleCombo', () => {
4545
let fixture: ComponentFixture<any>;
@@ -720,9 +720,9 @@ describe('IgxSimpleCombo', () => {
720720
expect(focusedItem_1.classList.contains(CSS_CLASS_FOCUSED)).toBeTruthy();
721721

722722
// Change focus
723-
dropdown.navigateItem(6);
723+
dropdown.navigateItem(5);
724724
fixture.detectChanges();
725-
const focusedItem_2 = dropdownItems[5];
725+
const focusedItem_2 = dropdownItems[4];
726726
expect(focusedItem_2.classList.contains(CSS_CLASS_FOCUSED)).toBeTruthy();
727727
expect(focusedItem_1.classList.contains(CSS_CLASS_FOCUSED)).toBeFalsy();
728728
});

0 commit comments

Comments
 (0)