11741984483

Committed 08 Nov 2024 12:19PM CUT coverage: 91.57% (-0.04%) from 91.606%

Build # 11741984483

Build Type

Pull #14999

github

Committed by

web-flow

Commit Message

Merge dba70cfe6 into 7b8563221

Pull Request Pull Request #14999: fix(grid): add coerceToInt attribute to IPinningConfig and pagingMode props

Run Details

12947 of 15174 branches covered (85.32%)

26243 of 28659 relevant lines covered (91.57%)

33883.34 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

95.77

/projects/igniteui-angular/src/lib/grids/headers/grid-header.component.ts

import {
    ChangeDetectionStrategy,
    ChangeDetectorRef,
    Component,
    DoCheck,
    ElementRef,
    HostBinding,
    HostListener,
    Inject,
    Input,
    OnDestroy,
    TemplateRef,
    ViewChild
} from '@angular/core';
import { GridColumnDataType } from '../../data-operations/data-util';
import { IgxColumnResizingService } from '../resizing/resizing.service';
import { Subject } from 'rxjs';
import { ColumnType, GridType, IGX_GRID_BASE } from '../common/grid.interface';
import { GridSelectionMode } from '../common/enums';
import { SortingDirection } from '../../data-operations/sorting-strategy';
import { SortingIndexPipe } from './pipes';
import { NgTemplateOutlet, NgIf, NgClass } from '@angular/common';
import { IgxIconComponent } from '../../icon/icon.component';
import { ExpressionsTreeUtil } from '../../data-operations/expressions-tree-util';

/**
 * @hidden
 */
@Component({
    changeDetection: ChangeDetectionStrategy.OnPush,
    selector: 'igx-grid-header',
    templateUrl: 'grid-header.component.html',
    standalone: true,
    imports: [IgxIconComponent, NgTemplateOutlet, NgIf, NgClass, SortingIndexPipe]
})
export class IgxGridHeaderComponent implements DoCheck, OnDestroy {

    @Input()
    public column: ColumnType;

    /**
     * @hidden
     */
    @ViewChild('defaultESFHeaderIconTemplate', { read: TemplateRef, static: true })
    protected defaultESFHeaderIconTemplate: TemplateRef<any>;

    /**
     * @hidden
     */
    @ViewChild('defaultSortHeaderIconTemplate', { read: TemplateRef, static: true })
    protected defaultSortHeaderIconTemplate;

    /**
     * @hidden
     */
    @ViewChild('sortIconContainer', { read: ElementRef })
    protected sortIconContainer: ElementRef;

    /**
     * Returns the `aria-selected` of the header.
     */
    @HostBinding('attr.aria-selected')
    public get ariaSelected(): boolean {
        return this.column.selected;
    }

    @HostBinding('class.igx-grid-th')
    public get columnGroupStyle() {
        return !this.column.columnGroup;
    }

    @HostBinding('class.asc')
    public get sortAscendingStyle() {
        return this.sortDirection === SortingDirection.Asc;
    }

    @HostBinding('class.desc')
    public get sortDescendingStyle() {
        return this.sortDirection === SortingDirection.Desc;
    }

    @HostBinding('class.igx-grid-th--number')
    public get numberStyle() {
        return this.column.dataType === GridColumnDataType.Number;
    }

    @HostBinding('class.igx-grid-th--sortable')
    public get sortableStyle() {
        return this.column.sortable;
    }

    @HostBinding('class.igx-grid-th--selectable')
    public get selectableStyle() {
        return this.selectable;
    }

    @HostBinding('class.igx-grid-th--filtrable')
    public get filterableStyle() {
        return this.column.filterable && this.grid.filteringService.isFilterRowVisible;
    }

    @HostBinding('class.igx-grid-th--sorted')
    public get sortedStyle() {
        return this.sorted;
    }

    @HostBinding('class.igx-grid-th--selected')
    public get selectedStyle() {
        return this.selected;
    }

    /**
     * @hidden
     */
    public get esfIconTemplate() {
        return this.grid.excelStyleHeaderIconTemplate || this.defaultESFHeaderIconTemplate;
    }

    /**
     * @hidden
     */
    public get sortIconTemplate() {
        if (this.sortDirection === SortingDirection.None && this.grid.sortHeaderIconTemplate) {
            return this.grid.sortHeaderIconTemplate;
        } else if (this.sortDirection === SortingDirection.Asc && this.grid.sortAscendingHeaderIconTemplate) {
            return this.grid.sortAscendingHeaderIconTemplate;
        } else if (this.sortDirection === SortingDirection.Desc && this.grid.sortDescendingHeaderIconTemplate) {
            return this.grid.sortDescendingHeaderIconTemplate;
        } else {
            return this.defaultSortHeaderIconTemplate;
        }
    }
    /**
     * @hidden
     */
    public get disabled() {
        const groupArea = this.grid.groupArea || this.grid.treeGroupArea;
        if (groupArea?.expressions && groupArea.expressions.length && groupArea.expressions.map(g => g.fieldName).includes(this.column.field)) {
            return true;
        }
        return false;
    }

    public get sorted() {
        return this.sortDirection !== SortingDirection.None;
    }

    public get filterIconClassName() {
        return this.column.filteringExpressionsTree || this.isAdvancedFilterApplied() ? 'igx-excel-filter__icon--filtered' : 'igx-excel-filter__icon';
    }

    public get selectable() {
        return this.grid.columnSelection !== GridSelectionMode.none &&
            this.column.applySelectableClass &&
            !this.column.selected &&
            !this.grid.filteringService.isFilterRowVisible;
    }

    public get selected() {
        return this.column.selected
            && (!this.grid.filteringService.isFilterRowVisible || this.grid.filteringService.filteredColumn !== this.column);
    }

    public get title() {
        return this.column.title || this.column.header || this.column.field;
    }

    public get nativeElement() {
        return this.ref.nativeElement;
    }

    public sortDirection = SortingDirection.None;
    protected _destroy$ = new Subject<boolean>();

    constructor(
        @Inject(IGX_GRID_BASE) public grid: GridType,
        public colResizingService: IgxColumnResizingService,
        public cdr: ChangeDetectorRef,
        private ref: ElementRef<HTMLElement>
    ) { }

    @HostListener('click', ['$event'])
    public onClick(event: MouseEvent) {
        if (!this.colResizingService.isColumnResizing) {

            if (this.grid.filteringService.isFilterRowVisible) {
                if (this.column.filterCellTemplate) {
                    this.grid.filteringRow.close();
                    return;
                }

                if (this.column.filterable && !this.column.columnGroup &&
                    !this.grid.filteringService.isFilterComplex(this.column.field)) {
                    this.grid.filteringService.filteredColumn = this.column;
                }
            } else if (this.grid.columnSelection !== GridSelectionMode.none && this.column.selectable) {
                const clearSelection = this.grid.columnSelection === GridSelectionMode.single || !event.ctrlKey;
                const rangeSelection = this.grid.columnSelection === GridSelectionMode.multiple && event.shiftKey;

                if (!this.column.selected || (this.grid.selectionService.getSelectedColumns().length > 1 && clearSelection)) {
                    this.grid.selectionService.selectColumn(this.column.field, clearSelection, rangeSelection, event);
                } else {
                    this.grid.selectionService.deselectColumn(this.column.field, event);
                }
            }
        }
        this.grid.theadRow.nativeElement.focus();
    }

    /**
     * @hidden
     */
    @HostListener('pointerenter')
    public onPinterEnter() {
        this.column.applySelectableClass = true;
    }

    /**
     * @hidden
     */
    @HostListener('pointerleave')
    public onPointerLeave() {
        this.column.applySelectableClass = false;
    }

    /**
     * @hidden @internal
     */
    public ngDoCheck() {
        this.getSortDirection();
        this.cdr.markForCheck();
    }

    /**
     * @hidden @internal
     */
    public ngOnDestroy(): void {
        this._destroy$.next(true);
        this._destroy$.complete();
    }

    /**
     * @hidden @internal
     */
    public onPointerDownIndicator(event) {
        // Stop propagation of pointer events to now allow column dragging using the header indicators.
        event.stopPropagation();
    }

    /**
     * @hidden @internal
     */
    public onFilteringIconClick(event) {
        event.stopPropagation();
        this.grid.filteringService.toggleFilterDropdown(this.nativeElement, this.column);
    }

    /**
     * @hidden @internal
     */
    public onSortingIconClick(event) {
        event.stopPropagation();
        this.triggerSort();
    }

    protected getSortDirection() {
        const expr = this.grid.sortingExpressions.find((x) => x.fieldName === this.column.field);
        this.sortDirection = expr ? expr.dir : SortingDirection.None;
    }

    protected isAdvancedFilterApplied() {
        if(!this.grid.advancedFilteringExpressionsTree) {
            return false;
        }
        return !!ExpressionsTreeUtil.find(this.grid.advancedFilteringExpressionsTree, this.column.field);
    }

    private triggerSort() {
        const groupingExpr = this.grid.groupingExpressions ?
            this.grid.groupingExpressions.find((expr) => expr.fieldName === this.column.field) :
            this.grid.groupArea?.expressions ? this.grid.groupArea?.expressions.find((expr) => expr.fieldName === this.column.field) : null;
        const sortDir = groupingExpr ?
            this.sortDirection + 1 > SortingDirection.Desc ? SortingDirection.Asc : SortingDirection.Desc
            : this.sortDirection + 1 > SortingDirection.Desc ? SortingDirection.None : this.sortDirection + 1;
        this.sortDirection = sortDir;
        this.grid.sort({
            fieldName: this.column.field, dir: this.sortDirection, ignoreCase: this.column.sortingIgnoreCase,
            strategy: this.column.sortStrategy
        });
    }
}

1	import {
2	ChangeDetectionStrategy,
3	ChangeDetectorRef,
4	Component,
5	DoCheck,
6	ElementRef,
7	HostBinding,
8	HostListener,
9	Inject,
10	Input,
11	OnDestroy,
12	TemplateRef,
13	ViewChild
14	} from '@angular/core';
15	import { GridColumnDataType } from '../../data-operations/data-util';
16	import { IgxColumnResizingService } from '../resizing/resizing.service';
17	import { Subject } from 'rxjs';
18	import { ColumnType, GridType, IGX_GRID_BASE } from '../common/grid.interface';
19	import { GridSelectionMode } from '../common/enums';
20	import { SortingDirection } from '../../data-operations/sorting-strategy';
21	import { SortingIndexPipe } from './pipes';
22	import { NgTemplateOutlet, NgIf, NgClass } from '@angular/common';
23	import { IgxIconComponent } from '../../icon/icon.component';
24	import { ExpressionsTreeUtil } from '../../data-operations/expressions-tree-util';
25
26	/**
27	* @hidden
28	*/
29	@Component({
30	changeDetection: ChangeDetectionStrategy.OnPush,
31	selector: 'igx-grid-header',
32	templateUrl: 'grid-header.component.html',
33	standalone: true,
34	imports: [IgxIconComponent, NgTemplateOutlet, NgIf, NgClass, SortingIndexPipe]
35	})
36	export class IgxGridHeaderComponent implements DoCheck, OnDestroy {	2✔
37
38	@Input()
39	public column: ColumnType;
40
41	/**
42	* @hidden
43	*/
44	@ViewChild('defaultESFHeaderIconTemplate', { read: TemplateRef, static: true })
45	protected defaultESFHeaderIconTemplate: TemplateRef<any>;
46
47	/**
48	* @hidden
49	*/
50	@ViewChild('defaultSortHeaderIconTemplate', { read: TemplateRef, static: true })
51	protected defaultSortHeaderIconTemplate;
52
53	/**
54	* @hidden
55	*/
56	@ViewChild('sortIconContainer', { read: ElementRef })
57	protected sortIconContainer: ElementRef;
58
59	/**
60	* Returns the `aria-selected` of the header.
61	*/
62	@HostBinding('attr.aria-selected')
63	public get ariaSelected(): boolean {
64	return this.column.selected;	223,373✔
65	}
66
67	@HostBinding('class.igx-grid-th')
68	public get columnGroupStyle() {
69	return !this.column.columnGroup;	223,373✔
70	}
71
72	@HostBinding('class.asc')
73	public get sortAscendingStyle() {
74	return this.sortDirection === SortingDirection.Asc;	223,373✔
75	}
76
77	@HostBinding('class.desc')
78	public get sortDescendingStyle() {
79	return this.sortDirection === SortingDirection.Desc;	223,373✔
80	}
81
82	@HostBinding('class.igx-grid-th--number')
83	public get numberStyle() {
84	return this.column.dataType === GridColumnDataType.Number;	223,373✔
85	}
86
87	@HostBinding('class.igx-grid-th--sortable')
88	public get sortableStyle() {
89	return this.column.sortable;	223,373✔
90	}
91
92	@HostBinding('class.igx-grid-th--selectable')
93	public get selectableStyle() {
94	return this.selectable;	223,373✔
95	}
96
97	@HostBinding('class.igx-grid-th--filtrable')
98	public get filterableStyle() {
99	return this.column.filterable && this.grid.filteringService.isFilterRowVisible;	223,373✔
100	}
101
102	@HostBinding('class.igx-grid-th--sorted')
103	public get sortedStyle() {
104	return this.sorted;	223,373✔
105	}
106
107	@HostBinding('class.igx-grid-th--selected')
108	public get selectedStyle() {
109	return this.selected;	223,373✔
110	}
111
112	/**
113	* @hidden
114	*/
115	public get esfIconTemplate() {
116	return this.grid.excelStyleHeaderIconTemplate \|\| this.defaultESFHeaderIconTemplate;	11,172✔
117	}
118
119	/**
120	* @hidden
121	*/
122	public get sortIconTemplate() {
123	if (this.sortDirection === SortingDirection.None && this.grid.sortHeaderIconTemplate) {	28,529✔
124	return this.grid.sortHeaderIconTemplate;	110✔
125	} else if (this.sortDirection === SortingDirection.Asc && this.grid.sortAscendingHeaderIconTemplate) {	28,419✔
126	return this.grid.sortAscendingHeaderIconTemplate;	10✔
127	} else if (this.sortDirection === SortingDirection.Desc && this.grid.sortDescendingHeaderIconTemplate) {	28,409✔
128	return this.grid.sortDescendingHeaderIconTemplate;	3✔
129	} else {
130	return this.defaultSortHeaderIconTemplate;	28,406✔
131	}
132	}
133	/**
134	* @hidden
135	*/
136	public get disabled() {
137	const groupArea = this.grid.groupArea \|\| this.grid.treeGroupArea;	28,618✔
138	if (groupArea?.expressions && groupArea.expressions.length && groupArea.expressions.map(g => g.fieldName).includes(this.column.field)) {	28,618✔
139	return true;	89✔
140	}
141	return false;	28,529✔
142	}
143
144	public get sorted() {
145	return this.sortDirection !== SortingDirection.None;	223,373✔
146	}
147
148	public get filterIconClassName() {
149	return this.column.filteringExpressionsTree \|\| this.isAdvancedFilterApplied() ? 'igx-excel-filter__icon--filtered' : 'igx-excel-filter__icon';	11,172✔
150	}
151
152	public get selectable() {
153	return this.grid.columnSelection !== GridSelectionMode.none &&	207,616✔
154	this.column.applySelectableClass &&
155	!this.column.selected &&
156	!this.grid.filteringService.isFilterRowVisible;
157	}
158
159	public get selected() {
160	return this.column.selected	223,373✔
161	&& (!this.grid.filteringService.isFilterRowVisible \|\| this.grid.filteringService.filteredColumn !== this.column);
162	}
163
164	public get title() {
165	return this.column.title \|\| this.column.header \|\| this.column.field;	207,426✔
166	}
167
168	public get nativeElement() {
169	return this.ref.nativeElement;	1,263✔
170	}
171
172	public sortDirection = SortingDirection.None;	24,456✔
173	protected _destroy$ = new Subject<boolean>();	24,456✔
174
175	constructor(
176	@Inject(IGX_GRID_BASE) public grid: GridType,	24,456✔
177	public colResizingService: IgxColumnResizingService,	24,456✔
178	public cdr: ChangeDetectorRef,	24,456✔
179	private ref: ElementRef<HTMLElement>	24,456✔
180	) { }
181
182	@HostListener('click', ['$event'])
183	public onClick(event: MouseEvent) {
184	if (!this.colResizingService.isColumnResizing) {	74✔
185
186	if (this.grid.filteringService.isFilterRowVisible) {	74✔
187	if (this.column.filterCellTemplate) {	6✔
188	this.grid.filteringRow.close();	1✔
189	return;	1✔
190	}
191
192	if (this.column.filterable && !this.column.columnGroup &&	5✔
193	!this.grid.filteringService.isFilterComplex(this.column.field)) {
194	this.grid.filteringService.filteredColumn = this.column;	5✔
195	}
196	} else if (this.grid.columnSelection !== GridSelectionMode.none && this.column.selectable) {	68✔
197	const clearSelection = this.grid.columnSelection === GridSelectionMode.single \|\| !event.ctrlKey;	33✔
198	const rangeSelection = this.grid.columnSelection === GridSelectionMode.multiple && event.shiftKey;	33✔
199
200	if (!this.column.selected \|\| (this.grid.selectionService.getSelectedColumns().length > 1 && clearSelection)) {	33✔
201	this.grid.selectionService.selectColumn(this.column.field, clearSelection, rangeSelection, event);	29✔
202	} else {
203	this.grid.selectionService.deselectColumn(this.column.field, event);	4✔
204	}
205	}
206	}
207	this.grid.theadRow.nativeElement.focus();	73✔
208	}
209
210	/**
211	* @hidden
212	*/
213	@HostListener('pointerenter')
214	public onPinterEnter() {
215	this.column.applySelectableClass = true;	4✔
216	}
217
218	/**
219	* @hidden
220	*/
221	@HostListener('pointerleave')
222	public onPointerLeave() {
223	this.column.applySelectableClass = false;	3✔
224	}
225
226	/**
227	* @hidden @internal
228	*/
229	public ngDoCheck() {
230	this.getSortDirection();	223,373✔
231	this.cdr.markForCheck();	223,373✔
232	}
233
234	/**
235	* @hidden @internal
236	*/
237	public ngOnDestroy(): void {
238	this._destroy$.next(true);	24,343✔
239	this._destroy$.complete();	24,343✔
240	}
241
242	/**
243	* @hidden @internal
244	*/
245	public onPointerDownIndicator(event) {
246	// Stop propagation of pointer events to now allow column dragging using the header indicators.
247	event.stopPropagation();	109✔
248	}
249
250	/**
251	* @hidden @internal
252	*/
253	public onFilteringIconClick(event) {
254	event.stopPropagation();	195✔
255	this.grid.filteringService.toggleFilterDropdown(this.nativeElement, this.column);	195✔
256	}
257
258	/**
259	* @hidden @internal
260	*/
261	public onSortingIconClick(event) {
262	event.stopPropagation();	47✔
263	this.triggerSort();	47✔
264	}
265
266	protected getSortDirection() {
267	const expr = this.grid.sortingExpressions.find((x) => x.fieldName === this.column.field);	207,616✔
268	this.sortDirection = expr ? expr.dir : SortingDirection.None;	207,616✔
269	}
270
271	protected isAdvancedFilterApplied() {
272	if(!this.grid.advancedFilteringExpressionsTree) {	11,037✔
273	return false;	11,037✔
274	}
275	return !!ExpressionsTreeUtil.find(this.grid.advancedFilteringExpressionsTree, this.column.field);	×
276	}
277
278	private triggerSort() {
279	const groupingExpr = this.grid.groupingExpressions ?	47✔
280	this.grid.groupingExpressions.find((expr) => expr.fieldName === this.column.field) :	×
281	this.grid.groupArea?.expressions ? this.grid.groupArea?.expressions.find((expr) => expr.fieldName === this.column.field) : null;	×
282	const sortDir = groupingExpr ?	47!
283	this.sortDirection + 1 > SortingDirection.Desc ? SortingDirection.Asc : SortingDirection.Desc	×
284	: this.sortDirection + 1 > SortingDirection.Desc ? SortingDirection.None : this.sortDirection + 1;	47✔
285	this.sortDirection = sortDir;	47✔
286	this.grid.sort({	47✔
287	fieldName: this.column.field, dir: this.sortDirection, ignoreCase: this.column.sortingIgnoreCase,
288	strategy: this.column.sortStrategy
289	});
290	}
291	}

IgniteUI / igniteui-angular / 11741984483

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous