[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)
This commit is contained in:
Pablo Martinez Garcia
2022-04-19 13:35:08 +02:00
committed by GitHub
parent 7141230649
commit 6963bef092
5 changed files with 23 additions and 6 deletions

View File

@@ -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 () => {

View File

@@ -41,6 +41,7 @@ declare const adf: any;
template: `
<div [id]="'field-'+field?.id+'-container'"
[style.visibility]="!field?.isVisible ? 'hidden' : 'visible'"
[style.display]="!field?.isVisible ? 'none' : 'block'"
[class.adf-focus]="focus"
(focusin)="focusToggle()"
(focusout)="focusToggle()">

View File

@@ -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;
}
}

View File

@@ -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<WidgetComponent>;
@@ -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();

View File

@@ -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 {