[AAE-12260] - fixing form field mapping (#8243)

* [AAE-12260] - reverting form field mapping to fix wrong behaivour

* [AAE-12260] - fixed readonly radiobutton

* [AAE-12260] - fixed valid check for rest options when multiple choice is made

* [AAE-12260] - fixed name for array elements

* [ci skip]

* start ci
This commit is contained in:
Vito Albano
2023-02-10 13:16:08 +00:00
committed by GitHub
parent 5d2dddee28
commit e16bed611c
5 changed files with 104 additions and 27 deletions

View File

@@ -714,8 +714,8 @@ describe('FormFieldModel', () => {
]
});
field.updateForm();
expect(form.values['dropdown_field']['fake-id-property']).toEqual('opt1');
expect(form.values['dropdown_field']['fake-label-property']).toEqual('Option 1');
expect(form.values['dropdown_field'].id).toEqual('opt1');
expect(form.values['dropdown_field'].name).toEqual('Option 1');
});
it('dropdown field type should be formatted on id and name properties if rest properties are not set', () => {
@@ -760,8 +760,8 @@ describe('FormFieldModel', () => {
]
});
field.updateForm();
expect(form.values['radio_bananan_field']['banana']).toEqual('opt1');
expect(form.values['radio_bananan_field']['banLabel']).toEqual('Option 1');
expect(form.values['radio_bananan_field'].id).toEqual('opt1');
expect(form.values['radio_bananan_field'].name).toEqual('Option 1');
});
it('radio button field rest type should appear with id / name properties when rest properties are not configured', () => {

View File

@@ -384,14 +384,14 @@ export class FormFieldModel extends FormWidgetModel {
const entry: FormFieldOption[] = this.options.filter((opt) => opt.id === this.value);
if (entry.length > 0) {
this.setFormFieldValueOption(entry[0]);
this.form.values[this.id] = entry[0];
}
}
break;
case FormFieldTypes.RADIO_BUTTONS:
const radioButton: FormFieldOption[] = this.options.filter((opt) => opt.id === this.value);
if (radioButton.length > 0) {
this.setFormFieldValueOption(radioButton[0]);
this.form.values[this.id] = radioButton[0];
}
break;
case FormFieldTypes.UPLOAD:
@@ -500,17 +500,4 @@ export class FormFieldModel extends FormWidgetModel {
json.type === FormFieldTypes.BOOLEAN;
}
private setFormFieldValueOption(option: FormFieldOption ) {
if (this.optionType === 'rest' && !!this.restUrl) {
const restEntry = {};
const restIdProperty = this.restIdProperty || 'id';
const restLabelProperty = this.restLabelProperty || 'name';
restEntry[restIdProperty] = option.id;
restEntry[restLabelProperty] = option.name;
this.form.values[this.id] = restEntry;
} else {
this.form.values[this.id] = option;
}
}
}

View File

@@ -465,6 +465,96 @@ describe('DropdownCloudWidgetComponent', () => {
{ id: 'opt_2', name: 'option_2' }
]);
});
it('should show preselected option for rest options', async () => {
widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
id: 'dropdown-id',
name: 'date-name',
type: 'dropdown',
readOnly: 'false',
restUrl: 'https://fake-rest-url',
optionType : 'rest',
selectionType: 'multiple',
value: [
{ id: 'opt_3', name: 'option_3' },
{ id: 'opt_4', name: 'option_4' }
]
});
spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of([
{
id: 'opt_1',
name: 'option_1'
},
{
id: 'opt_2',
name: 'option_2'
},
{
id: 'opt_3',
name: 'option_3'
},
{
id: 'opt_4',
name: 'option_4'
}
] as any));
fixture.detectChanges();
await fixture.whenStable();
fixture.detectChanges();
const selectedPlaceHolder = fixture.debugElement.query(By.css('.mat-select-value-text span'));
expect(selectedPlaceHolder.nativeElement.getInnerHTML()).toEqual('option_3, option_4');
await openSelect('#dropdown-id');
const options = fixture.debugElement.queryAll(By.css('.mat-selected span'));
expect(Array.from(options).map(({ nativeElement }) => nativeElement.getInnerHTML().trim()))
.toEqual(['option_3', 'option_4']);
});
it('should support multiple options for rest options', async () => {
widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
id: 'dropdown-id',
name: 'date-name',
type: 'dropdown',
readOnly: 'false',
restUrl: 'https://fake-rest-url',
optionType : 'rest',
selectionType: 'multiple'
});
spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of([
{
id: 'opt_1',
name: 'option_1'
},
{
id: 'opt_2',
name: 'option_2'
},
{
id: 'opt_3',
name: 'option_3'
},
{
id: 'opt_4',
name: 'option_4'
}
] as any));
fixture.detectChanges();
await openSelect('#dropdown-id');
const optionOne = fixture.debugElement.query(By.css('[id="opt_2"]'));
const optionTwo = fixture.debugElement.query(By.css('[id="opt_4"]'));
optionOne.triggerEventHandler('click', null);
optionTwo.triggerEventHandler('click', null);
expect(widget.field.value).toEqual([
{ id: 'opt_2', name: 'option_2' },
{ id: 'opt_4', name: 'option_4' }
]);
});
});
describe('Linked Dropdown', () => {

View File

@@ -185,7 +185,13 @@ export class DropdownCloudWidgetComponent extends WidgetComponent implements OnI
}
private isSelectedValueInOptions(): boolean {
return [...this.field.options].map(option => option.id).includes(this.fieldValue);
if (Array.isArray(this.fieldValue)) {
const optionIdList = [...this.field.options].map(option => option.id);
const fieldValueIds = this.fieldValue.map(valueOption => valueOption.id);
return fieldValueIds.every(valueOptionId => optionIdList.includes(valueOptionId));
} else {
return [...this.field.options].map(option => option.id).includes(this.fieldValue);
}
}
get fieldValue(): string {

View File

@@ -85,13 +85,7 @@ export class RadioButtonsCloudWidgetComponent extends WidgetComponent implements
isChecked(option: FormFieldOption): boolean {
if (this.field.value && typeof this.field.value === 'object') {
let id = 'id';
let name = 'name';
if (this.field.restUrl) {
id = this.field.restIdProperty ?? 'id';
name = this.field.restLabelProperty ?? 'name';
}
return this.field.value[id] === option.id || this.field.value[name] === option.name;
return this.field.value['id'] === option.id || this.field.value['name'] === option.name;
}
return this.field.value === option.id;
}