Skip to content

Commit 59d957e

Browse files
MayaKirovaMayaKirova
committed
Merge branch 'mkirova/feat-15235' of https://github.com/IgniteUI/igniteui-angular into mkirova/feat-15235
2 parents 949f435 + 37a528c commit 59d957e

36 files changed

Lines changed: 1334 additions & 154 deletions

File tree

‎projects/igniteui-angular-elements/src/lib/csv-exporter.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { GridTypeBase, IgxCsvExporterOptions, IgxCsvExporterService } from 'igniteui-angular';
2+
3+
export class IgcCsvExporterService extends IgxCsvExporterService {
4+
public override export(grid: GridTypeBase, options: IgxCsvExporterOptions): void {
5+
const gridRef = (grid as any).ngElementStrategy?.componentRef?.instance;
6+
super.export(gridRef || grid, options);
7+
}
8+
}

‎projects/igniteui-angular-elements/src/lib/excel-exporter.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { GridTypeBase, IgxExcelExporterOptions, IgxExcelExporterService } from 'igniteui-angular';
2+
3+
export class IgcExcelExporterService extends IgxExcelExporterService {
4+
public override export(grid: GridTypeBase, options: IgxExcelExporterOptions): void {
5+
const gridRef = (grid as any).ngElementStrategy?.componentRef?.instance;
6+
super.export(gridRef || grid, options);
7+
}
8+
}

‎projects/igniteui-angular-elements/src/lib/grids/grid.component.ts‎

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -70,14 +70,6 @@ import { IgxGridComponent } from 'igniteui-angular/grids/grid/src/grid.component
7070
* @remarks
7171
* The Ignite UI Grid is used for presenting and manipulating tabular data in the simplest way possible. Once data
7272
* has been bound, it can be manipulated through filtering, sorting & editing operations.
73-
* @example
74-
* ```html
75-
* <igx-grid [data]="employeeData" [autoGenerate]="false">
76-
* <igx-column field="first" header="First Name"></igx-column>
77-
* <igx-column field="last" header="Last Name"></igx-column>
78-
* <igx-column field="role" header="Role"></igx-column>
79-
* </igx-grid>
80-
* ```
8173
*/
8274
@Component({
8375
changeDetection: ChangeDetectionStrategy.OnPush,

‎projects/igniteui-angular-elements/src/public_api.ts‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import { registerI18n, setCurrentI18n } from 'igniteui-i18n-core';
22
import { ByLevelTreeGridMergeStrategy, ColumnPinningPosition, DefaultMergeStrategy, DefaultTreeGridMergeStrategy, FilteringExpressionsTree, FilteringExpressionsTreeType, FilteringLogic, HorizontalAlignment, IgxBooleanFilteringOperand, IgxDateFilteringOperand, IgxDateTimeFilteringOperand, IgxFilteringOperand, IgxNumberFilteringOperand, IgxStringFilteringOperand, IgxTimeFilteringOperand, NoopFilteringStrategy, NoopSortingStrategy, SortingDirection, TransactionType, TransactionEventOrigin, VerticalAlignment } from 'igniteui-angular/core';
3-
import { DropPosition, GridPagingMode, IgxDateSummaryOperand, IgxNumberSummaryOperand, IgxPivotAggregate, IgxPivotDateAggregate, IgxPivotDateDimension, IgxPivotNumericAggregate, IgxPivotTimeAggregate, IgxSummaryOperand, IgxTimeSummaryOperand, NoopPivotDimensionsStrategy, PivotDimensionType, RowPinningPosition } from 'igniteui-angular/grids/core';
3+
import { CsvFileTypes, DropPosition, GridPagingMode, IgxCsvExporterOptions, IgxDateSummaryOperand, IgxExcelExporterOptions, IgxNumberSummaryOperand, IgxPivotAggregate, IgxPivotDateAggregate, IgxPivotDateDimension, IgxPivotNumericAggregate, IgxPivotTimeAggregate, IgxSummaryOperand, IgxTimeSummaryOperand, NoopPivotDimensionsStrategy, PivotDimensionType, RowPinningPosition } from 'igniteui-angular/grids/core';
4+
import { IgcExcelExporterService } from './lib/excel-exporter';
5+
import { IgcCsvExporterService } from './lib/csv-exporter';
46

57
/** Export Public API, TODO: reorganize, Generate all w/ renames? */
68
export {
@@ -53,4 +55,11 @@ export {
5355
// Transactions API
5456
TransactionType,
5557
TransactionEventOrigin,
58+
59+
// Exporters
60+
IgxExcelExporterOptions as IgcExcelExporterOptions,
61+
IgxCsvExporterOptions as IgcCsvExporterOptions,
62+
IgcExcelExporterService,
63+
IgcCsvExporterService,
64+
CsvFileTypes
5665
}

‎projects/igniteui-angular/calendar/src/calendar/month-picker/month-picker.component.spec.ts‎

Lines changed: 177 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -552,6 +552,183 @@ describe('IgxMonthPicker', () => {
552552
currentValue: new Date(2019, 1, 1)
553553
});
554554
});
555+
556+
it('should return the correct next and previous years via getNextYear/getPreviousYear', () => {
557+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
558+
fixture.detectChanges();
559+
const monthPicker = fixture.componentInstance.monthPicker;
560+
// viewDate is 2019
561+
expect(monthPicker.getNextYear()).toBe(2020);
562+
expect(monthPicker.getPreviousYear()).toBe(2018);
563+
});
564+
565+
it('should navigate forward one year via PageDown in default (year) view', () => {
566+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
567+
fixture.detectChanges();
568+
const monthPicker = fixture.componentInstance.monthPicker;
569+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
570+
wrapper.nativeElement.focus();
571+
fixture.detectChanges();
572+
573+
const initialYear = monthPicker.viewDate.getFullYear();
574+
UIInteractions.triggerKeyDownEvtUponElem('PageDown', document.activeElement);
575+
fixture.detectChanges();
576+
577+
expect(monthPicker.viewDate.getFullYear()).toBe(initialYear + 1);
578+
});
579+
580+
it('should navigate backward one year via PageUp in default (year) view', () => {
581+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
582+
fixture.detectChanges();
583+
const monthPicker = fixture.componentInstance.monthPicker;
584+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
585+
wrapper.nativeElement.focus();
586+
fixture.detectChanges();
587+
588+
const initialYear = monthPicker.viewDate.getFullYear();
589+
UIInteractions.triggerKeyDownEvtUponElem('PageUp', document.activeElement);
590+
fixture.detectChanges();
591+
592+
expect(monthPicker.viewDate.getFullYear()).toBe(initialYear - 1);
593+
});
594+
595+
it('should navigate forward one year via PageDown in default (year) view', () => {
596+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
597+
fixture.detectChanges();
598+
const monthPicker = fixture.componentInstance.monthPicker;
599+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
600+
wrapper.nativeElement.focus();
601+
fixture.detectChanges();
602+
603+
const initialYear = monthPicker.viewDate.getFullYear();
604+
UIInteractions.triggerKeyDownEvtUponElem('PageDown', document.activeElement);
605+
fixture.detectChanges();
606+
607+
expect(monthPicker.viewDate.getFullYear()).toBe(initialYear + 1);
608+
});
609+
610+
it('should navigate backward one page via PageUp in decade (years) view', () => {
611+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
612+
fixture.detectChanges();
613+
const monthPicker = fixture.componentInstance.monthPicker;
614+
// Switch to decade view
615+
monthPicker.activeView = IgxCalendarView.Decade;
616+
fixture.detectChanges();
617+
618+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
619+
wrapper.nativeElement.focus();
620+
fixture.detectChanges();
621+
622+
const initialYear = monthPicker.viewDate.getFullYear();
623+
UIInteractions.triggerKeyDownEvtUponElem('PageUp', document.activeElement);
624+
fixture.detectChanges();
625+
626+
// In decade view, PageUp calls previousPage which moves back 15 years
627+
expect(monthPicker.viewDate.getFullYear()).toBe(initialYear - 15);
628+
});
629+
630+
it('should navigate forward one page via PageDown in decade (years) view', () => {
631+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
632+
fixture.detectChanges();
633+
const monthPicker = fixture.componentInstance.monthPicker;
634+
monthPicker.activeView = IgxCalendarView.Decade;
635+
fixture.detectChanges();
636+
637+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
638+
wrapper.nativeElement.focus();
639+
fixture.detectChanges();
640+
641+
const initialYear = monthPicker.viewDate.getFullYear();
642+
UIInteractions.triggerKeyDownEvtUponElem('PageDown', document.activeElement);
643+
fixture.detectChanges();
644+
645+
// In decade view, PageDown calls nextPage which moves forward 15 years
646+
expect(monthPicker.viewDate.getFullYear()).toBe(initialYear + 15);
647+
});
648+
649+
it('should navigate to January via Home key in default (year) view', () => {
650+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
651+
fixture.detectChanges();
652+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
653+
wrapper.nativeElement.focus();
654+
fixture.detectChanges();
655+
656+
UIInteractions.triggerKeyDownEvtUponElem('Home', document.activeElement);
657+
fixture.detectChanges();
658+
659+
const dom = fixture.debugElement;
660+
const selected = dom.query(By.css('.igx-calendar-view__item--selected'));
661+
expect(selected.nativeElement.textContent.trim()).toMatch('Jan');
662+
});
663+
664+
it('should navigate to December via End key in default (year) view', () => {
665+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
666+
fixture.detectChanges();
667+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
668+
wrapper.nativeElement.focus();
669+
fixture.detectChanges();
670+
671+
UIInteractions.triggerKeyDownEvtUponElem('End', document.activeElement);
672+
fixture.detectChanges();
673+
674+
const dom = fixture.debugElement;
675+
const selected = dom.query(By.css('.igx-calendar-view__item--selected'));
676+
expect(selected.nativeElement.textContent.trim()).toMatch('Dec');
677+
});
678+
679+
it('should navigate to first year in view via Home key in decade (years) view', () => {
680+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
681+
fixture.detectChanges();
682+
const monthPicker = fixture.componentInstance.monthPicker;
683+
monthPicker.activeView = IgxCalendarView.Decade;
684+
fixture.detectChanges();
685+
686+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
687+
wrapper.nativeElement.focus();
688+
fixture.detectChanges();
689+
690+
UIInteractions.triggerKeyDownEvtUponElem('Home', document.activeElement);
691+
fixture.detectChanges();
692+
693+
const dom = fixture.debugElement;
694+
const years = dom.queryAll(By.css('.igx-calendar-view__item'));
695+
const selected = dom.query(By.css('.igx-calendar-view__item--selected'));
696+
expect(selected.nativeElement).toBe(years[0].nativeElement);
697+
});
698+
699+
it('should navigate to last year in view via End key in decade (years) view', () => {
700+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
701+
fixture.detectChanges();
702+
const monthPicker = fixture.componentInstance.monthPicker;
703+
monthPicker.activeView = IgxCalendarView.Decade;
704+
fixture.detectChanges();
705+
706+
const wrapper = fixture.debugElement.query(By.css('.igx-calendar__wrapper'));
707+
wrapper.nativeElement.focus();
708+
fixture.detectChanges();
709+
710+
UIInteractions.triggerKeyDownEvtUponElem('End', document.activeElement);
711+
fixture.detectChanges();
712+
713+
const dom = fixture.debugElement;
714+
const years = dom.queryAll(By.css('.igx-calendar-view__item'));
715+
const selected = dom.query(By.css('.igx-calendar-view__item--selected'));
716+
expect(selected.nativeElement).toBe(years[years.length - 1].nativeElement);
717+
});
718+
719+
it('should change the active view to decade via activeViewDecade and focus the years view', () => {
720+
const fixture = TestBed.createComponent(IgxMonthPickerSampleComponent);
721+
fixture.detectChanges();
722+
const monthPicker = fixture.componentInstance.monthPicker;
723+
724+
expect(monthPicker.activeView).toBe(IgxCalendarView.Year);
725+
726+
const yearBtn = fixture.debugElement.query(By.css('.igx-calendar-picker__date'));
727+
UIInteractions.simulateMouseDownEvent(yearBtn.nativeElement);
728+
fixture.detectChanges();
729+
730+
expect(monthPicker.activeView).toBe(IgxCalendarView.Decade);
731+
});
555732
});
556733

557734
@Component({

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

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1942,6 +1942,40 @@ describe('igxCombo', () => {
19421942
expect(document.activeElement).toEqual(combo.comboInput.nativeElement);
19431943
expect(combo.selection.length).toEqual(0);
19441944
}));
1945+
it('should stop Escape keydown event propagation when the dropdown is open', fakeAsync(() => {
1946+
const escapeEvent = new KeyboardEvent('keydown', { key: 'Escape', bubbles: true });
1947+
spyOn(escapeEvent, 'stopPropagation');
1948+
1949+
combo.comboInput.nativeElement.focus();
1950+
fixture.detectChanges();
1951+
1952+
combo.toggle();
1953+
fixture.detectChanges();
1954+
expect(combo.collapsed).toBeFalsy();
1955+
1956+
combo.onEscape(escapeEvent);
1957+
tick();
1958+
fixture.detectChanges();
1959+
1960+
expect(escapeEvent.stopPropagation).toHaveBeenCalled();
1961+
}));
1962+
it('should stop Escape key propagation when the combo is collapsed and has a selection', fakeAsync(() => {
1963+
combo.comboInput.nativeElement.focus();
1964+
fixture.detectChanges();
1965+
1966+
combo.select([combo.data[0][combo.valueKey]]);
1967+
expect(combo.selection.length).toEqual(1);
1968+
fixture.detectChanges();
1969+
1970+
const keyEvent = new KeyboardEvent('keydown', { key: 'Escape' });
1971+
const stopPropSpy = spyOn(keyEvent, 'stopPropagation');
1972+
1973+
combo.onEscape(keyEvent);
1974+
tick();
1975+
fixture.detectChanges();
1976+
1977+
expect(stopPropSpy).toHaveBeenCalledTimes(1);
1978+
}));
19451979
it('should close the combo and preserve the focus when Escape key is pressed', fakeAsync(() => {
19461980
combo.comboInput.nativeElement.focus();
19471981
fixture.detectChanges();

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -199,6 +199,7 @@ export class IgxComboComponent extends IgxComboBaseDirective implements AfterVie
199199

200200
@HostListener('keydown.Escape', ['$event'])
201201
public onEscape(event: Event) {
202+
event.stopPropagation();
202203
if (this.collapsed) {
203204
this.deselectAllItems(true, event);
204205
}

0 commit comments

Comments
 (0)