Skip to content

Commit bf54dd3

Browse files
kdinevkdinev
authored
Merge branch '10.1.x' into mvenkov/handle_correctly_target_as_point-10.1
2 parents f7a82a1 + 40a2972 commit bf54dd3

File tree

5 files changed

+89
-28
lines changed

5 files changed

+89
-28
lines changed

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

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

2423
const CSS_CLASS_COMBO = 'igx-combo';
2524
const CSS_CLASS_COMBO_DROPDOWN = 'igx-combo__drop-down';
@@ -584,6 +583,38 @@ describe('igxCombo', () => {
584583
expect(combo.onSearchInput.emit).toHaveBeenCalledTimes(1);
585584
expect(matchSpy).toHaveBeenCalledTimes(1);
586585
});
586+
it('should not open on click if combo is disabled', () => {
587+
combo = new IgxComboComponent(elementRef, mockCdr, mockSelection as any, mockComboService,
588+
mockIconService, null, mockInjector);
589+
const dropdown = jasmine.createSpyObj('IgxComboDropDownComponent', ['open', 'close', 'toggle']);
590+
const spyObj = jasmine.createSpyObj('event', ['stopPropagation', 'preventDefault']);
591+
spyOn(mockIconService, 'addSvgIconFromText').and.returnValue(null);
592+
combo.ngOnInit();
593+
combo.dropdown = dropdown;
594+
dropdown.collapsed = true;
595+
596+
combo.disabled = true;
597+
combo.onInputClick(spyObj);
598+
expect(combo.dropdown.collapsed).toBeTruthy();
599+
});
600+
it('should not clear value when combo is disabled', () => {
601+
const selectionService = new IgxSelectionAPIService();
602+
combo = new IgxComboComponent(elementRef, mockCdr, selectionService, mockComboService,
603+
mockIconService, null, mockInjector);
604+
const dropdown = jasmine.createSpyObj('IgxComboDropDownComponent', ['selectItem']);
605+
const spyObj = jasmine.createSpyObj('event', ['stopPropagation']);
606+
spyOn(mockIconService, 'addSvgIconFromText').and.returnValue(null);
607+
combo.ngOnInit();
608+
combo.data = data;
609+
combo.dropdown = dropdown;
610+
combo.disabled = true;
611+
spyOnProperty(combo, 'totalItemCount').and.returnValue(combo.data.length);
612+
613+
const item = combo.data.slice(0, 1);
614+
combo.selectItems(item, true);
615+
combo.handleClearItems(spyObj);
616+
expect(combo.value).toEqual(item[0]);
617+
});
587618
});
588619
describe('Initialization and rendering tests: ', () => {
589620
configureTestSuite();
@@ -2523,13 +2554,6 @@ describe('igxCombo', () => {
25232554
expect(combo.valid).toEqual(IgxComboState.INITIAL);
25242555
expect(combo.comboInput.valid).toEqual(IgxInputState.INITIAL);
25252556
});
2526-
it('should not open on click if combo is disabled', () => {
2527-
combo.disabled = true;
2528-
fixture.detectChanges();
2529-
UIInteractions.simulateClickEvent(combo.comboInput.nativeElement);
2530-
fixture.detectChanges();
2531-
expect(combo.dropdown.collapsed).toBeTruthy();
2532-
});
25332557
it('should be possible to be enabled/disabled when used as a form control', () => {
25342558
const form = fixture.componentInstance.reactiveForm;
25352559
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
@@ -1316,6 +1316,9 @@ export class IgxComboComponent extends DisplayDensityBase implements IgxComboBas
13161316
* @hidden @internal
13171317
*/
13181318
public handleClearItems(event: Event): void {
1319+
if (this.disabled) {
1320+
return;
1321+
}
13191322
this.deselectAllItems(true, event);
13201323
if (this.collapsed) {
13211324
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
@@ -1389,6 +1389,15 @@ describe('IgxTimePicker', () => {
13891389
expect(timePicker.onValidationFailed.emit).toHaveBeenCalled();
13901390
}));
13911391

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

@@ -1846,7 +1855,6 @@ describe('IgxTimePicker', () => {
18461855
fixture.componentInstance.format = 'hh tt';
18471856
fixture.componentInstance.customDate = new Date(2018, 10, 27, 17, 45, 0, 0);
18481857
fixture.detectChanges();
1849-
18501858
const clearTime = dom.queryAll(By.css('.igx-icon'))[1];
18511859

18521860
UIInteractions.simulateClickAndSelectEvent(clearTime);
@@ -1866,6 +1874,21 @@ describe('IgxTimePicker', () => {
18661874
expect(input.nativeElement.value).toBe('-- AM');
18671875
}));
18681876

1877+
it('should allow editing of input after clear', fakeAsync(() => {
1878+
fixture.componentInstance.format = 'hh tt';
1879+
fixture.componentInstance.customDate = new Date(2018, 10, 27, 17, 45, 0, 0);
1880+
fixture.detectChanges();
1881+
spyOn(fixture.componentInstance.timePicker, 'onInput');
1882+
1883+
const clearTime = dom.queryAll(By.css('.igx-icon'))[1];
1884+
UIInteractions.simulateClickAndSelectEvent(clearTime);
1885+
fixture.detectChanges();
1886+
const _input = fixture.debugElement.query(By.css('input'));
1887+
UIInteractions.simulateTyping('12 AM', _input);
1888+
expect(fixture.componentInstance.timePicker.onInput).not.toThrow();
1889+
expect(_input.nativeElement.value).toEqual('12 AM');
1890+
}));
1891+
18691892
it('Should navigate dropdown lists correctly when format contains only hours.', fakeAsync(() => {
18701893
fixture.componentInstance.format = 'hh tt';
18711894
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

5656
let NEXT_ID = 0;
@@ -1944,11 +1944,14 @@ export class IgxTimePickerComponent implements
19441944
this.isNotEmpty = false;
19451945

19461946
const oldVal = new Date(this.value);
1947+
this.displayValue = this.parseMask(false);
1948+
requestAnimationFrame(() => {
1949+
this._setCursorPosition(0);
1950+
});
1951+
// TODO: refactoring - this.value should be null #6585
1952+
this.value?.setHours(0, 0, 0);
19471953

1948-
this.displayValue = '';
1949-
this.value.setHours(0, 0);
1950-
1951-
if (oldVal.getTime() !== this.value.getTime()) {
1954+
if (oldVal.getTime() !== this.value?.getTime() || this.isReset()) {
19521955
const args: IgxTimePickerValueChangedEventArgs = {
19531956
oldValue: oldVal,
19541957
newValue: this.value
@@ -1964,35 +1967,35 @@ export class IgxTimePickerComponent implements
19641967
* @hidden
19651968
*/
19661969
public onInput(event): void {
1967-
const val = event.target.value;
1970+
const inputMask: string = event.target.value;
19681971
const oldVal = new Date(this.value);
19691972

1970-
this.isNotEmpty = val !== this.parseMask(false);
1973+
this.isNotEmpty = inputMask !== this.parseMask(false);
19711974

19721975
// handle cases where all empty positions (promts) are filled and we want to update
19731976
// timepicker own value property if it is a valid Date
1974-
if (val.indexOf(this.promptChar) === -1) {
1975-
if (this._isEntryValid(val)) {
1976-
const newVal = this.convertMinMaxValue(val);
1977+
if (inputMask.indexOf(this.promptChar) === -1) {
1978+
if (this._isEntryValid(inputMask)) {
1979+
const newVal = this.convertMinMaxValue(inputMask);
19771980
if (oldVal.getTime() !== newVal.getTime()) {
19781981
this.value = newVal;
19791982
}
19801983
} else {
19811984
const args: IgxTimePickerValidationFailedEventArgs = {
19821985
timePicker: this,
1983-
currentValue: val,
1986+
currentValue: new Date(inputMask),
19841987
setThroughUI: false
19851988
};
19861989
this.onValidationFailed.emit(args);
19871990
}
19881991
// handle cases where the user deletes the display value (when pressing backspace or delete)
1989-
} else if (!this.value || !val || val === this.parseMask(false)) {
1992+
} else if (!this.value || inputMask.length === 0 || !this.isNotEmpty) {
19901993
this.isNotEmpty = false;
1991-
1992-
this.value.setHours(0, 0);
1993-
this.displayValue = val;
1994-
1995-
if (oldVal.getTime() !== this.value.getTime()) {
1994+
// TODO: refactoring - this.value should be null #6585
1995+
this.value?.setHours(0, 0, 0);
1996+
this.displayValue = inputMask;
1997+
if (oldVal.getTime() !== this.value?.getTime() || this.isReset()) {
1998+
// TODO: Do not emit event when the editor is empty #6482
19961999
const args: IgxTimePickerValueChangedEventArgs = {
19972000
oldValue: oldVal,
19982001
newValue: this.value
@@ -2019,7 +2022,7 @@ export class IgxTimePickerComponent implements
20192022
this.isNotEmpty = value !== '';
20202023
this.displayValue = value;
20212024

2022-
if (value && value !== this.parseMask()) {
2025+
if (value && (value !== this.parseMask() || value !== this.parseMask(false))) {
20232026
if (this._isEntryValid(value)) {
20242027
const newVal = this.convertMinMaxValue(value);
20252028
if (!this.value || this.value.getTime() !== newVal.getTime()) {
@@ -2144,6 +2147,14 @@ export class IgxTimePickerComponent implements
21442147
input.valid = IgxInputState.INITIAL;
21452148
}
21462149
}
2150+
2151+
// Workaround method for #8135
2152+
// TODO: It must be removed in #6482
2153+
private isReset(): boolean {
2154+
return this.value?.getHours() === 0
2155+
&& this.value?.getMinutes() === 0
2156+
&& this.value?.getSeconds() === 0;
2157+
}
21472158
}
21482159

21492160
/**

0 commit comments

Comments
 (0)