From 6963bef0921791cb8badcc9d300d713f9f56d102 Mon Sep 17 00:00:00 2001 From: Pablo Martinez Garcia Date: Tue, 19 Apr 2022 13:35:08 +0200 Subject: [PATCH] [AAE-8086] Add form field changed event (#7584) * [AAE-8086] Add form field changed event * [AAE-8086] Send field changed event only qhen value changes (not in visibility check) --- .../form-field/form-field.component.spec.ts | 8 ++++++-- .../form-field/form-field.component.ts | 1 + .../form/components/widgets/core/form.model.ts | 2 +- .../components/widgets/widget.component.spec.ts | 17 ++++++++++++++--- .../form/components/widgets/widget.component.ts | 1 + 5 files changed, 23 insertions(+), 6 deletions(-) diff --git a/lib/core/form/components/form-field/form-field.component.spec.ts b/lib/core/form/components/form-field/form-field.component.spec.ts index 147d7aa3e9..90a1fa56fc 100644 --- a/lib/core/form/components/form-field/form-field.component.spec.ts +++ b/lib/core/form/components/form-field/form-field.component.spec.ts @@ -113,8 +113,9 @@ describe('FormFieldComponent', () => { component.field.isVisible = false; fixture.detectChanges(); fixture.whenStable().then(() => { - const debugElement = fixture.nativeElement.querySelector('#field-FAKE-TXT-WIDGET-container').style.visibility; - expect(debugElement).toEqual('hidden'); + const debugElement = fixture.nativeElement.querySelector('#field-FAKE-TXT-WIDGET-container').style; + expect(debugElement.visibility).toEqual('hidden'); + expect(debugElement.display).toEqual('none'); done(); }); }); @@ -130,6 +131,7 @@ describe('FormFieldComponent', () => { fixture.whenStable().then(() => { expect(fixture.nativeElement.querySelector('#field-FAKE-TXT-WIDGET-container').style.visibility).toEqual('visible'); + expect(fixture.nativeElement.querySelector('#field-FAKE-TXT-WIDGET-container').style.display).toEqual('block'); done(); }); }); @@ -143,9 +145,11 @@ describe('FormFieldComponent', () => { component.field = field; fixture.detectChanges(); expect(fixture.nativeElement.querySelector('#field-FAKE-TXT-WIDGET-container').style.visibility).toEqual('visible'); + expect(fixture.nativeElement.querySelector('#field-FAKE-TXT-WIDGET-container').style.display).toEqual('block'); component.field.isVisible = false; fixture.detectChanges(); expect(fixture.nativeElement.querySelector('#field-FAKE-TXT-WIDGET-container').style.visibility).toEqual('hidden'); + expect(fixture.nativeElement.querySelector('#field-FAKE-TXT-WIDGET-container').style.display).toEqual('none'); }); it('[C213878] - Should fields be correctly rendered when filled with process variables', async () => { diff --git a/lib/core/form/components/form-field/form-field.component.ts b/lib/core/form/components/form-field/form-field.component.ts index 27a0530e24..c64661299d 100644 --- a/lib/core/form/components/form-field/form-field.component.ts +++ b/lib/core/form/components/form-field/form-field.component.ts @@ -41,6 +41,7 @@ declare const adf: any; template: `
diff --git a/lib/core/form/components/widgets/core/form.model.ts b/lib/core/form/components/widgets/core/form.model.ts index 13ed152a43..8edb5c97f7 100644 --- a/lib/core/form/components/widgets/core/form.model.ts +++ b/lib/core/form/components/widgets/core/form.model.ts @@ -429,7 +429,7 @@ export class FormModel implements ProcessFormModel { visibilityRule.operator = visibility ? 'empty' : '!empty'; visibilityRule.leftType = WidgetTypeEnum.field; field.visibilityCondition = visibilityRule; - field.isVisible = false; + field.isVisible = visibility; } } diff --git a/lib/core/form/components/widgets/widget.component.spec.ts b/lib/core/form/components/widgets/widget.component.spec.ts index 6104246a33..d2d660a9db 100644 --- a/lib/core/form/components/widgets/widget.component.spec.ts +++ b/lib/core/form/components/widgets/widget.component.spec.ts @@ -22,8 +22,9 @@ import { WidgetComponent } from './widget.component'; import { setupTestBed } from '../../../testing/setup-test-bed'; import { CoreTestingModule } from '../../../testing'; import { TranslateModule } from '@ngx-translate/core'; +import { filter } from 'rxjs/operators'; -describe('WidgetComponent', () => { +fdescribe('WidgetComponent', () => { let widget: WidgetComponent; let fixture: ComponentFixture; @@ -56,8 +57,7 @@ describe('WidgetComponent', () => { }); it('should click event be redirect on the form rules event service', (done) => { - widget.formService.formRulesEvent.subscribe((event) => { - expect(event.type).toEqual('click'); + widget.formService.formRulesEvent.pipe(filter(event => event.type === 'click')).subscribe(() => { done(); }); @@ -99,6 +99,17 @@ describe('WidgetComponent', () => { widget.onFieldChanged(fakeField); }); + it('should send a rule event when a field is changed', (done) => { + const fakeForm = new FormModel(); + const fakeField = new FormFieldModel(fakeForm, { id: 'fakeField', value: 'fakeValue' }); + widget.formService.formRulesEvent.subscribe((event) => { + expect(event.type).toEqual('fieldValueChanged'); + done(); + }); + + widget.onFieldChanged(fakeField); + }); + it('should eval isRequired state of the field', () => { expect(widget.isRequired()).toBeFalsy(); diff --git a/lib/core/form/components/widgets/widget.component.ts b/lib/core/form/components/widgets/widget.component.ts index d2dbbdc6cd..d400994f99 100644 --- a/lib/core/form/components/widgets/widget.component.ts +++ b/lib/core/form/components/widgets/widget.component.ts @@ -104,6 +104,7 @@ export class WidgetComponent implements AfterViewInit { onFieldChanged(field: FormFieldModel) { this.fieldChanged.emit(field); + this.formService.formRulesEvent.next(new FormRulesEvent('fieldValueChanged', new FormFieldEvent(this.field?.form, this.field), null)); } event(event: Event): void {