Skip to content

Commit b315d32

Browse files
ChronosSFChronosSF
authored
Merge branch '17.2.x' into mkirova/partial-fix-13993-17.2.x
2 parents e0ae6d8 + f01626c commit b315d32

File tree

15 files changed

+161
-32
lines changed

15 files changed

+161
-32
lines changed

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

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -159,6 +159,17 @@ describe('Avatar', () => {
159159
expect(hostEl.getAttribute('aria-roledescription')).toEqual('image avatar');
160160
expect(hostEl.getAttribute('aria-label')).toEqual('avatar');
161161
});
162+
163+
it('Normalizes the value of the `src` input', () => {
164+
const fixture = TestBed.createComponent(InitImageAvatarComponent);
165+
fixture.detectChanges();
166+
167+
const instance = fixture.componentInstance.avatar;
168+
instance.src = "/assets/Test - 17.jpg";
169+
fixture.detectChanges();
170+
171+
expect(instance.src).toEqual("/assets/Test%20-%2017.jpg");
172+
});
162173
});
163174

164175
@Component({

‎projects/igniteui-angular/src/lib/avatar/avatar.component.ts‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import {
99
ViewChild
1010
} from '@angular/core';
1111

12-
import { mkenum } from '../core/utils';
12+
import { mkenum, normalizeURI } from '../core/utils';
1313
import { IgxIconComponent } from '../icon/icon.component';
1414

1515
let NEXT_ID = 0;
@@ -202,7 +202,13 @@ export class IgxAvatarComponent implements OnInit {
202202
* @igxFriendlyName Image URL
203203
*/
204204
@Input()
205-
public src: string;
205+
public set src(value: string) {
206+
this._src = normalizeURI(value);
207+
}
208+
209+
public get src() {
210+
return this._src;
211+
}
206212

207213
/** @hidden @internal */
208214
@ViewChild('defaultTemplate', { read: TemplateRef, static: true })
@@ -225,6 +231,7 @@ export class IgxAvatarComponent implements OnInit {
225231
* @internal
226232
*/
227233
private _size: string | IgxAvatarSize;
234+
private _src: string;
228235

229236
/**
230237
* Returns the size of the avatar.

‎projects/igniteui-angular/src/lib/calendar/common/calendar-view.directive.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import {
2121
import { CalendarDay, DayInterval } from "../common/model";
2222
import { getNextActiveDate, isDateInRanges } from "./helpers";
2323
import { DateRangeType } from "../../core/dates";
24+
import { isDate } from "../../core/utils";
2425

2526
export enum Direction {
2627
NEXT = 1,
@@ -141,7 +142,7 @@ export abstract class IgxCalendarViewDirective implements ControlValueAccessor {
141142
*/
142143
@Input()
143144
public set date(value: Date) {
144-
if (!(value instanceof Date)) return;
145+
if (!isDate(value)) return;
145146

146147
this._date = value;
147148
}

‎projects/igniteui-angular/src/lib/calendar/common/model.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import { isDate } from "../../core/utils";
2+
13
/* eslint-disable @typescript-eslint/consistent-type-definitions */
24
export type DayParameter = CalendarDay | Date;
35

@@ -19,7 +21,7 @@ export const daysInWeek = 7;
1921
const millisecondsInDay = 86400000;
2022

2123
export function toCalendarDay(date: DayParameter) {
22-
return date instanceof Date ? CalendarDay.from(date) : date;
24+
return isDate(date) ? CalendarDay.from(date) : date;
2325
}
2426

2527
function checkRollover(original: CalendarDay, modified: CalendarDay) {

‎projects/igniteui-angular/src/lib/core/styles/components/action-strip/_action-strip-component.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
@include register-component(
1111
$name: string.slice($this, 2, -1),
1212
$deps: (
13-
igx-button,
13+
igx-icon-button,
1414
igx-drop-down,
1515
igx-icon,
1616
)

‎projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-component.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
igx-checkbox,
1919
igx-chip,
2020
igx-grid-summary,
21+
igx-icon-button,
2122
igx-input-group,
2223
igx-grid-toolbar,
2324
igx-paginator,

‎projects/igniteui-angular/src/lib/core/styles/components/paginator/_paginator-component.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
$name: string.slice($this, 2, -1),
1111
$deps: (
1212
igx-button,
13-
igx-icon,
13+
igx-icon-button,
1414
igx-input-group,
1515
)
1616
);

‎projects/igniteui-angular/src/lib/core/styles/components/query-builder/_query-builder-component.scss‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,15 @@
1313
$this: bem--selector-to-string(&);
1414
@include register-component(
1515
$name: string.slice($this, 2, -1),
16-
$deps: ()
16+
$deps: (
17+
igx-icon,
18+
igx-button,
19+
igx-chip,
20+
igx-select,
21+
igx-input-button,
22+
igx-icon-button,
23+
igx-overlay,
24+
)
1725
);
1826

1927
@extend %advanced-filter !optional;

‎projects/igniteui-angular/src/lib/core/utils.ts‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -208,7 +208,9 @@ export const isObject = (value: any): boolean => !!(value && value.toString() ==
208208
* @returns true if provided variable is Date
209209
* @hidden
210210
*/
211-
export const isDate = (value: any): value is Date => value instanceof Date;
211+
export const isDate = (value: any): value is Date => {
212+
return Object.prototype.toString.call(value) === "[object Date]";
213+
}
212214

213215
/**
214216
* Checks if the two passed arguments are equal
@@ -613,3 +615,11 @@ export function* intoChunks<T>(arr: T[], size: number) {
613615
yield arr.slice(i, i + size);
614616
}
615617
}
618+
619+
/**
620+
* @param path - The URI path to be normalized.
621+
* @returns string encoded using the encodeURI function.
622+
*/
623+
export function normalizeURI(path: string) {
624+
return path.split('/').map(encodeURI).join('/');
625+
}

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

Lines changed: 57 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import {
66
IgxHintDirective, IgxInputGroupComponent, IgxInputState, IgxLabelDirective, IgxPrefixDirective, IgxSuffixDirective
77
} from '../input-group/public_api';
88
import { configureTestSuite } from '../test-utils/configure-suite';
9-
import { IFormattingViews, IgxCalendarComponent, WEEKDAYS } from '../calendar/public_api';
9+
import { IFormattingViews, IgxCalendarComponent, IgxCalendarHeaderTemplateDirective, IgxCalendarHeaderTitleTemplateDirective, WEEKDAYS } from '../calendar/public_api';
1010
import { IgxCalendarContainerComponent } from '../date-common/calendar-container/calendar-container.component';
1111
import { IgxDatePickerComponent } from './date-picker.component';
1212
import {
@@ -44,6 +44,7 @@ describe('IgxDatePicker', () => {
4444
IgxDatePickerTestComponent,
4545
IgxDatePickerNgModelComponent,
4646
IgxDatePickerWithProjectionsComponent,
47+
IgxDatePickerWithTemplatesComponent,
4748
IgxDatePickerInFormComponent,
4849
IgxDatePickerReactiveFormComponent
4950
]
@@ -490,6 +491,47 @@ describe('IgxDatePicker', () => {
490491
});
491492
});
492493

494+
describe('Templated Header', () => {
495+
let fixture: ComponentFixture<IgxDatePickerWithTemplatesComponent>;
496+
497+
beforeEach(fakeAsync(() => {
498+
TestBed.configureTestingModule({
499+
imports: [IgxDatePickerWithTemplatesComponent]
500+
}).compileComponents();
501+
502+
fixture = TestBed.createComponent(IgxDatePickerWithTemplatesComponent);
503+
fixture.detectChanges();
504+
}));
505+
506+
it('Should use the custom template for header title', fakeAsync(() => {
507+
const testDate = new Date(2024, 10, 11);
508+
fixture.componentInstance.datePicker.value = testDate;
509+
fixture.componentInstance.datePicker.open();
510+
tick();
511+
fixture.detectChanges();
512+
513+
const headerTitleElement = fixture.debugElement.query(By.css('.igx-calendar__header-year'));
514+
expect(headerTitleElement).toBeTruthy('Header title element should be present');
515+
if (headerTitleElement) {
516+
expect(headerTitleElement.nativeElement.textContent.trim()).toBe('2024');
517+
}
518+
}));
519+
520+
it('Should use the custom template for header', fakeAsync(() => {
521+
const testDate = new Date(2024, 10, 11);
522+
fixture.componentInstance.datePicker.value = testDate;
523+
fixture.componentInstance.datePicker.open();
524+
tick();
525+
fixture.detectChanges();
526+
527+
const headerElement = fixture.debugElement.query(By.css('.igx-calendar__header-date'));
528+
expect(headerElement).toBeTruthy('Header element should be present');
529+
if (headerElement) {
530+
expect(headerElement.nativeElement.textContent.trim()).toBe('Nov');
531+
}
532+
}));
533+
});
534+
493535
describe('UI Interaction', () => {
494536
let fixture: ComponentFixture<any>;
495537
let datePicker: IgxDatePickerComponent;
@@ -1470,6 +1512,20 @@ export class IgxDatePickerWithProjectionsComponent {
14701512
public showCustomClear = false;
14711513
}
14721514

1515+
@Component({
1516+
template: `
1517+
<igx-date-picker [mode]="mode">
1518+
<ng-template igxCalendarHeaderTitle let-formatCalendar>{{ formatCalendar.year.value }}</ng-template>
1519+
<ng-template igxCalendarHeader let-formatCalendar>{{ formatCalendar.month.value }}</ng-template>
1520+
</igx-date-picker>`,
1521+
standalone: true,
1522+
imports: [IgxDatePickerComponent, IgxCalendarHeaderTemplateDirective, IgxCalendarHeaderTitleTemplateDirective]
1523+
})
1524+
export class IgxDatePickerWithTemplatesComponent {
1525+
@ViewChild(IgxDatePickerComponent) public datePicker: IgxDatePickerComponent;
1526+
public mode: PickerInteractionMode = PickerInteractionMode.Dialog;
1527+
}
1528+
14731529
@Component({
14741530
template: `
14751531
<form #form="ngForm">

0 commit comments

Comments
 (0)