Skip to content
Permalink
Browse files
fix(date-value-handler): add some null checks to ensure component has…
… everything it needs before trying to use a property (#771)
  • Loading branch information
mdelez committed Jun 27, 2022
1 parent 3947992 commit 4076f3e94a94b10467817ce6e17aab8ef0e774b9
Show file tree
Hide file tree
Showing 4 changed files with 53 additions and 7 deletions.
@@ -56,7 +56,7 @@
"configurations": {
"development": {
"optimization": false,
"sourceMap": false,
"sourceMap": true,
"namedChunks": true,
"aot": true,
"extractLicenses": false,
@@ -12,8 +12,9 @@
<mat-icon *ngIf="isPeriodControl.value">remove</mat-icon>
</button>

<div *ngIf="isPeriodControl.value" class="date-form-field">
<app-date-picker class="end-date" [formControlName]="'endDate'" [disableCalendarSelector]="true" [calendar]="startDate.value.calendar">
<div *ngIf="isPeriodControl.value && startDate.value" class="date-form-field">
<app-date-picker class="end-date" [formControlName]="'endDate'" [disableCalendarSelector]="true"
[calendar]="startDate.value.calendar">
</app-date-picker>
</div>
</div>
@@ -30,4 +31,4 @@
</mat-error>
</div>

</div>
</div>
@@ -286,16 +286,25 @@ describe('DateValueHandlerComponent', () => {
(startDateEditComponentDe.componentInstance as TestDatePickerComponent).writeValue(new KnoraDate('JULIAN', 'CE', 2019, 5, 19));
(startDateEditComponentDe.componentInstance as TestDatePickerComponent)._handleInput();

testHostFixture.detectChanges();

const endDateEditComponentDe = hostCompDe.query(By.css('.end-date'));

(endDateEditComponentDe.componentInstance as TestDatePickerComponent).writeValue(new KnoraDate('JULIAN', 'CE', 2020, 5, 19));
(endDateEditComponentDe.componentInstance as TestDatePickerComponent)._handleInput();

testHostFixture.detectChanges();

await testHostFixture.whenStable();

expect(testHostComponent.dateValueHandlerComponent.form.valid).toBe(true);

expect(testHostComponent.form.controls.date.value).toEqual(new KnoraPeriod(new KnoraDate('JULIAN', 'CE', 2019, 5, 19), new KnoraDate('JULIAN', 'CE', 2020, 5, 19)));

// access private _subscriptions property and ensure that each subscription is still open
testHostComponent.dateValueHandlerComponent['_subscriptions'].forEach((sub) => {
expect(sub.closed).toBeFalse();
});
});

it('should return "null" for an invalid user input (start date greater than end date)', async () => {
@@ -373,7 +382,44 @@ describe('DateValueHandlerComponent (no validator required)', () => {
expect(testHostComponent).toBeTruthy();
});

it('should receive the propagated valueRequiredValidator from the parent component', () => {
it('should propagate changes made by the user for a period', async () => {
expect(testHostComponent.dateValueHandlerComponent.isPeriodControl.value).toBeFalse();

testHostComponent.dateValueHandlerComponent.isPeriodControl.setValue(true);

expect(testHostComponent.dateValueHandlerComponent.isPeriodControl.value).toBeTrue();

testHostFixture.detectChanges();

const hostCompDe = testHostFixture.debugElement;

const startDateEditComponentDe = hostCompDe.query(By.css('.start-date'));

(startDateEditComponentDe.componentInstance as TestDatePickerComponent).writeValue(new KnoraDate('JULIAN', 'CE', 2019, 5, 19));
(startDateEditComponentDe.componentInstance as TestDatePickerComponent)._handleInput();

testHostFixture.detectChanges();

const endDateEditComponentDe = hostCompDe.query(By.css('.end-date'));

(endDateEditComponentDe.componentInstance as TestDatePickerComponent).writeValue(new KnoraDate('JULIAN', 'CE', 2020, 5, 19));
(endDateEditComponentDe.componentInstance as TestDatePickerComponent)._handleInput();

testHostFixture.detectChanges();

await testHostFixture.whenStable();

expect(testHostComponent.dateValueHandlerComponent.form.valid).toBe(true);

expect(testHostComponent.form.controls.date.value).toEqual(new KnoraPeriod(new KnoraDate('JULIAN', 'CE', 2019, 5, 19), new KnoraDate('JULIAN', 'CE', 2020, 5, 19)));

// access private _subscriptions property and ensure that each subscription is still open
testHostComponent.dateValueHandlerComponent['_subscriptions'].forEach((sub) => {
expect(sub.closed).toBeFalse();
});
});

it('should not receive the propagated valueRequiredValidator from the parent component', () => {
expect(testHostComponent.dateValueHandlerComponent.valueRequiredValidator).toBe(false);
});

@@ -100,7 +100,7 @@ export class DateValueHandlerComponent extends _MatInputMixinBase implements Con
if (!this.isPeriodControl.value) {
return this.startDate.value;
} else {
if (this.startDate.value.calendar !== this.endDate.value.calendar) {
if (this.endDate.value && (this.startDate.value.calendar !== this.endDate.value.calendar)) {
this.endDate.value.calendar = this.startDate.value.calendar;
}

@@ -109,7 +109,6 @@ export class DateValueHandlerComponent extends _MatInputMixinBase implements Con
}

set value(date: KnoraDate | KnoraPeriod | null) {

if (date instanceof KnoraDate) {
// single date
this.calendarControl.setValue(date.calendar);

0 comments on commit 4076f3e

Please sign in to comment.