[ADF-5269] - fix datatable date filter (#6232)

* [ADF-5269] - fix datatable date filter

* fix e2e
This commit is contained in:
Silviu Popa
2020-10-12 14:27:49 +03:00
committed by GitHub
parent e3560a3f72
commit 2b23edd0bd
3 changed files with 15 additions and 15 deletions

View File

@@ -6,8 +6,8 @@
[errorStateMatcher]="matcher" [errorStateMatcher]="matcher"
placeholder="{{ 'SEARCH.FILTER.RANGE.FROM-DATE' | translate }}" placeholder="{{ 'SEARCH.FILTER.RANGE.FROM-DATE' | translate }}"
[matDatepicker]="fromDatepicker" [matDatepicker]="fromDatepicker"
[max]="getFromMaxDate()" [max]="fromMaxDate"
(focusout)="onChangedHandler($event, from)" (dateChange)="onChangedHandler($event, from)"
data-automation-id="date-range-from-input"> data-automation-id="date-range-from-input">
<mat-datepicker-toggle matSuffix [for]="fromDatepicker" data-automation-id="date-range-from-date-toggle"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="fromDatepicker" data-automation-id="date-range-from-date-toggle"></mat-datepicker-toggle>
<mat-datepicker #fromDatepicker color="accent"></mat-datepicker> <mat-datepicker #fromDatepicker color="accent"></mat-datepicker>
@@ -25,7 +25,7 @@
[matDatepicker]="toDatepicker" [matDatepicker]="toDatepicker"
[min]="from.value" [min]="from.value"
[max]="maxDate" [max]="maxDate"
(focusout)="onChangedHandler($event, to)" (dateChange)="onChangedHandler($event, to)"
data-automation-id="date-range-to-input"> data-automation-id="date-range-to-input">
<mat-datepicker-toggle matSuffix [for]="toDatepicker" data-automation-id="date-range-to-date-toggle"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="toDatepicker" data-automation-id="date-range-to-date-toggle"></mat-datepicker-toggle>
<mat-datepicker #toDatepicker color="accent"></mat-datepicker> <mat-datepicker #toDatepicker color="accent"></mat-datepicker>

View File

@@ -74,7 +74,7 @@ describe('SearchDateRangeComponent', () => {
const momentFromInput = moment(inputString, dateFormatFixture); const momentFromInput = moment(inputString, dateFormatFixture);
expect(momentFromInput.isValid()).toBeTruthy(); expect(momentFromInput.isValid()).toBeTruthy();
component.onChangedHandler({ srcElement: { value: inputString } }, component.from); component.onChangedHandler({ value: inputString }, component.from);
expect(component.from.value.toString()).toEqual(momentFromInput.toString()); expect(component.from.value.toString()).toEqual(momentFromInput.toString());
}); });
@@ -86,7 +86,7 @@ describe('SearchDateRangeComponent', () => {
const momentFromInput = moment(inputString, dateFormatFixture); const momentFromInput = moment(inputString, dateFormatFixture);
expect(momentFromInput.isValid()).toBeFalsy(); expect(momentFromInput.isValid()).toBeFalsy();
component.onChangedHandler({ srcElement: { value: inputString } }, component.from); component.onChangedHandler({ value: inputString }, component.from);
expect(component.from.value.toString()).not.toEqual(momentFromInput.toString()); expect(component.from.value.toString()).not.toEqual(momentFromInput.toString());
}); });
@@ -156,7 +156,7 @@ describe('SearchDateRangeComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
const input = fixture.debugElement.nativeElement.querySelector('[data-automation-id="date-range-from-input"]'); const input = fixture.debugElement.nativeElement.querySelector('[data-automation-id="date-range-from-input"]');
input.value = '10-05-18'; input.value = '10-05-18';
input.dispatchEvent(new Event('focusout')); input.dispatchEvent(new Event('input'));
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.INVALID-DATE'); expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.INVALID-DATE');
@@ -167,7 +167,7 @@ describe('SearchDateRangeComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
const input = fixture.debugElement.nativeElement.querySelector('[data-automation-id="date-range-from-input"]'); const input = fixture.debugElement.nativeElement.querySelector('[data-automation-id="date-range-from-input"]');
input.value = '10/10/2018'; input.value = '10/10/2018';
input.dispatchEvent(new Event('focusout')); input.dispatchEvent(new Event('input'));
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();

View File

@@ -56,6 +56,7 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit, OnDestroy
context?: SearchQueryBuilderService; context?: SearchQueryBuilderService;
datePickerDateFormat = DEFAULT_FORMAT_DATE; datePickerDateFormat = DEFAULT_FORMAT_DATE;
maxDate: any; maxDate: any;
fromMaxDate: any;
isActive = false; isActive = false;
startValue: any; startValue: any;
@@ -119,6 +120,8 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit, OnDestroy
from: this.from, from: this.from,
to: this.to to: this.to
}); });
this.setFromMaxDate();
} }
ngOnDestroy() { ngOnDestroy() {
@@ -178,8 +181,7 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit, OnDestroy
onChangedHandler(event: any, formControl: FormControl) { onChangedHandler(event: any, formControl: FormControl) {
const inputValue = event.srcElement.value; const inputValue = event.value;
const formatDate = this.dateAdapter.parse(inputValue, this.datePickerDateFormat); const formatDate = this.dateAdapter.parse(inputValue, this.datePickerDateFormat);
if (formatDate && formatDate.isValid()) { if (formatDate && formatDate.isValid()) {
formControl.setValue(formatDate); formControl.setValue(formatDate);
@@ -187,11 +189,9 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit, OnDestroy
formControl.setErrors({ formControl.setErrors({
'invalidOnChange': true 'invalidOnChange': true
}); });
} else {
formControl.setErrors({
'required': true
});
} }
this.setFromMaxDate();
} }
setLocale(locale) { setLocale(locale) {
@@ -207,13 +207,13 @@ export class SearchDateRangeComponent implements SearchWidget, OnInit, OnDestroy
event.srcElement.click(); event.srcElement.click();
} }
getFromMaxDate(): any { setFromMaxDate(): any {
let maxDate: string; let maxDate: string;
if (!this.to.value || this.maxDate && (moment(this.maxDate).isBefore(this.to.value))) { if (!this.to.value || this.maxDate && (moment(this.maxDate).isBefore(this.to.value))) {
maxDate = this.maxDate; maxDate = this.maxDate;
} else { } else {
maxDate = moment(this.to.value); maxDate = moment(this.to.value);
} }
return maxDate; this.fromMaxDate = maxDate;
} }
} }