Skip to content

Commit ed6afa4

Browse files
kdinevkdinev
authored
Merge branch '9.1.x' into mvenkov/handle_correctly_target_as_point-9.1
2 parents 1dbbac4 + 4671176 commit ed6afa4

File tree

5 files changed

+85
-28
lines changed

5 files changed

+85
-28
lines changed

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

Lines changed: 28 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@ import { configureTestSuite } from '../test-utils/configure-suite';
1919
import { DisplayDensity } from '../core/density';
2020
import { AbsoluteScrollStrategy, ConnectedPositioningStrategy } from '../services/public_api';
2121
import { IgxSelectionAPIService } from '../core/selection';
22-
import { CancelableEventArgs } from '../core/utils';
2322

2423
const CSS_CLASS_COMBO = 'igx-combo';
2524
const CSS_CLASS_COMBO_DROPDOWN = 'igx-combo__drop-down';
@@ -564,6 +563,34 @@ describe('igxCombo', () => {
564563
expect(combo.onSearchInput.emit).toHaveBeenCalledTimes(1);
565564
expect(matchSpy).toHaveBeenCalledTimes(1);
566565
});
566+
it('should not open on click if combo is disabled', () => {
567+
combo = new IgxComboComponent({ nativeElement: null }, mockCdr, mockSelection as any, mockComboService, null, mockInjector);
568+
const dropdown = jasmine.createSpyObj('IgxComboDropDownComponent', ['open', 'close', 'toggle']);
569+
const spyObj = jasmine.createSpyObj('event', ['stopPropagation', 'preventDefault']);
570+
combo.ngOnInit();
571+
combo.dropdown = dropdown;
572+
dropdown.collapsed = true;
573+
574+
combo.disabled = true;
575+
combo.onInputClick(spyObj);
576+
expect(combo.dropdown.collapsed).toBeTruthy();
577+
});
578+
it('should not clear value when combo is disabled', () => {
579+
const selectionService = new IgxSelectionAPIService();
580+
combo = new IgxComboComponent({ nativeElement: null }, mockCdr, selectionService, mockComboService, null, mockInjector);
581+
const dropdown = jasmine.createSpyObj('IgxComboDropDownComponent', ['selectItem']);
582+
const spyObj = jasmine.createSpyObj('event', ['stopPropagation']);
583+
combo.ngOnInit();
584+
combo.data = data;
585+
combo.dropdown = dropdown;
586+
combo.disabled = true;
587+
spyOnProperty(combo, 'totalItemCount').and.returnValue(combo.data.length);
588+
589+
const item = combo.data.slice(0, 1);
590+
combo.selectItems(item, true);
591+
combo.handleClearItems(spyObj);
592+
expect(combo.value).toEqual(item[0]);
593+
});
567594
});
568595
describe('Initialization and rendering tests: ', () => {
569596
configureTestSuite();
@@ -2469,13 +2496,6 @@ describe('igxCombo', () => {
24692496
expect(combo.valid).toEqual(IgxComboState.INITIAL);
24702497
expect(combo.comboInput.valid).toEqual(IgxInputState.INITIAL);
24712498
});
2472-
it('should not open on click if combo is disabled', () => {
2473-
combo.disabled = true;
2474-
fixture.detectChanges();
2475-
UIInteractions.simulateClickEvent(combo.comboInput.nativeElement);
2476-
fixture.detectChanges();
2477-
expect(combo.dropdown.collapsed).toBeTruthy();
2478-
});
24792499
it('should be possible to be enabled/disabled when used as a form control', () => {
24802500
const form = fixture.componentInstance.reactiveForm;
24812501
const comboFormReference = form.controls.townCombo;

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

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1276,6 +1276,9 @@ export class IgxComboComponent extends DisplayDensityBase implements IgxComboBas
12761276
* @hidden @internal
12771277
*/
12781278
public handleClearItems(event: Event): void {
1279+
if (this.disabled) {
1280+
return;
1281+
}
12791282
this.deselectAllItems(true, event);
12801283
if (this.collapsed) {
12811284
this.getEditElement().focus();

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<ng-template #dropdownInputTemplate>
2-
<igx-input-group #group (mousedown)="mouseDown($event)">
2+
<igx-input-group #group (mousedown)="mouseDown($event)" [suppressInputAutofocus]="true">
33
<label igxLabel>Time</label>
44
<igx-prefix (click)="openDialog(group.element.nativeElement)">
55
<igx-icon>access_time</igx-icon>

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

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1388,6 +1388,15 @@ describe('IgxTimePicker', () => {
13881388
expect(timePicker.onValidationFailed.emit).toHaveBeenCalled();
13891389
}));
13901390

1391+
it('should trigger onValueChanged if 00:00 is cleared from the input', () => {
1392+
fixture.componentInstance.date = new Date(2018, 10, 27, 0, 0, 0, 0);
1393+
fixture.detectChanges();
1394+
spyOn(timePicker.onValueChanged, 'emit');
1395+
timePicker.clear();
1396+
fixture.detectChanges();
1397+
expect(timePicker.onValueChanged.emit).toHaveBeenCalledTimes(1);
1398+
});
1399+
13911400
it('should scroll on dropdown opened and accept value when focus lost', fakeAsync(() => {
13921401
fixture.detectChanges();
13931402

@@ -1798,7 +1807,6 @@ describe('IgxTimePicker', () => {
17981807
fixture.componentInstance.format = 'hh tt';
17991808
fixture.componentInstance.customDate = new Date(2018, 10, 27, 17, 45, 0, 0);
18001809
fixture.detectChanges();
1801-
18021810
const clearTime = dom.queryAll(By.css('.igx-icon'))[1];
18031811

18041812
UIInteractions.simulateClickAndSelectEvent(clearTime);
@@ -1818,6 +1826,21 @@ describe('IgxTimePicker', () => {
18181826
expect(input.nativeElement.value).toBe('-- AM');
18191827
}));
18201828

1829+
it('should allow editing of input after clear', fakeAsync(() => {
1830+
fixture.componentInstance.format = 'hh tt';
1831+
fixture.componentInstance.customDate = new Date(2018, 10, 27, 17, 45, 0, 0);
1832+
fixture.detectChanges();
1833+
spyOn(fixture.componentInstance.timePicker, 'onInput');
1834+
1835+
const clearTime = dom.queryAll(By.css('.igx-icon'))[1];
1836+
UIInteractions.simulateClickAndSelectEvent(clearTime);
1837+
fixture.detectChanges();
1838+
const _input = fixture.debugElement.query(By.css('input'));
1839+
UIInteractions.simulateTyping('12 AM', _input);
1840+
expect(fixture.componentInstance.timePicker.onInput).not.toThrow();
1841+
expect(_input.nativeElement.value).toEqual('12 AM');
1842+
}));
1843+
18211844
it('Should navigate dropdown lists correctly when format contains only hours.', fakeAsync(() => {
18221845
fixture.componentInstance.format = 'hh tt';
18231846
fixture.componentInstance.customDate = new Date(2018, 10, 27, 17, 45, 0);

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

Lines changed: 29 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ import { ITimePickerResourceStrings } from '../core/i18n/time-picker-resources';
5050
import { CurrentResourceStrings } from '../core/i18n/resources';
5151
import { KEYS, CancelableBrowserEventArgs, IBaseEventArgs } from '../core/utils';
5252
import { InteractionMode } from '../core/enums';
53-
import { IgxTextSelectionModule} from '../directives/text-selection/text-selection.directive';
53+
import { IgxTextSelectionModule } from '../directives/text-selection/text-selection.directive';
5454

5555
let NEXT_ID = 0;
5656
const ITEMS_COUNT = 7;
@@ -1894,11 +1894,14 @@ export class IgxTimePickerComponent implements
18941894
this.isNotEmpty = false;
18951895

18961896
const oldVal = new Date(this.value);
1897+
this.displayValue = this.parseMask(false);
1898+
requestAnimationFrame(() => {
1899+
this._setCursorPosition(0);
1900+
});
1901+
// TODO: refactoring - this.value should be null #6585
1902+
this.value?.setHours(0, 0, 0);
18971903

1898-
this.displayValue = '';
1899-
this.value.setHours(0, 0);
1900-
1901-
if (oldVal.getTime() !== this.value.getTime()) {
1904+
if (oldVal.getTime() !== this.value?.getTime() || this.isReset()) {
19021905
const args: IgxTimePickerValueChangedEventArgs = {
19031906
oldValue: oldVal,
19041907
newValue: this.value
@@ -1914,35 +1917,35 @@ export class IgxTimePickerComponent implements
19141917
* @hidden
19151918
*/
19161919
public onInput(event): void {
1917-
const val = event.target.value;
1920+
const inputMask: string = event.target.value;
19181921
const oldVal = new Date(this.value);
19191922

1920-
this.isNotEmpty = val !== this.parseMask(false);
1923+
this.isNotEmpty = inputMask !== this.parseMask(false);
19211924

19221925
// handle cases where all empty positions (promts) are filled and we want to update
19231926
// timepicker own value property if it is a valid Date
1924-
if (val.indexOf(this.promptChar) === -1) {
1925-
if (this._isEntryValid(val)) {
1926-
const newVal = this._convertMinMaxValue(val);
1927+
if (inputMask.indexOf(this.promptChar) === -1) {
1928+
if (this._isEntryValid(inputMask)) {
1929+
const newVal = this._convertMinMaxValue(inputMask);
19271930
if (oldVal.getTime() !== newVal.getTime()) {
19281931
this.value = newVal;
19291932
}
19301933
} else {
19311934
const args: IgxTimePickerValidationFailedEventArgs = {
19321935
timePicker: this,
1933-
currentValue: val,
1936+
currentValue: new Date(inputMask),
19341937
setThroughUI: false
19351938
};
19361939
this.onValidationFailed.emit(args);
19371940
}
19381941
// handle cases where the user deletes the display value (when pressing backspace or delete)
1939-
} else if (!this.value || !val || val === this.parseMask(false)) {
1942+
} else if (!this.value || inputMask.length === 0 || !this.isNotEmpty) {
19401943
this.isNotEmpty = false;
1941-
1942-
this.value.setHours(0, 0);
1943-
this.displayValue = val;
1944-
1945-
if (oldVal.getTime() !== this.value.getTime()) {
1944+
// TODO: refactoring - this.value should be null #6585
1945+
this.value?.setHours(0, 0, 0);
1946+
this.displayValue = inputMask;
1947+
if (oldVal.getTime() !== this.value?.getTime() || this.isReset()) {
1948+
// TODO: Do not emit event when the editor is empty #6482
19461949
const args: IgxTimePickerValueChangedEventArgs = {
19471950
oldValue: oldVal,
19481951
newValue: this.value
@@ -1969,7 +1972,7 @@ export class IgxTimePickerComponent implements
19691972
this.isNotEmpty = value !== '';
19701973
this.displayValue = value;
19711974

1972-
if (value && value !== this.parseMask()) {
1975+
if (value && (value !== this.parseMask() || value !== this.parseMask(false))) {
19731976
if (this._isEntryValid(value)) {
19741977
const newVal = this._convertMinMaxValue(value);
19751978
if (!this.value || this.value.getTime() !== newVal.getTime()) {
@@ -2094,6 +2097,14 @@ export class IgxTimePickerComponent implements
20942097
input.valid = IgxInputState.INITIAL;
20952098
}
20962099
}
2100+
2101+
// Workaround method for #8135
2102+
// TODO: It must be removed in #6482
2103+
private isReset(): boolean {
2104+
return this.value?.getHours() === 0
2105+
&& this.value?.getMinutes() === 0
2106+
&& this.value?.getSeconds() === 0;
2107+
}
20972108
}
20982109

20992110
/**

0 commit comments

Comments
 (0)