Skip to content

Commit 9010f89

Browse files
Hyperkid123Hyperkid123
authored
Merge pull request #357 from rvsia/pr356
[V2] Merge master to V2
2 parents 7bd9ba7 + 9e8574e commit 9010f89

4 files changed

Lines changed: 286 additions & 8 deletions

File tree

‎packages/react-form-renderer/src/form-renderer/enhanced-on-change.js‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,10 @@ const checkEmpty = (value) => {
5252
return false;
5353
}
5454

55+
if (typeof value === 'boolean') {
56+
return false;
57+
}
58+
5559
if (typeof value === 'string' && value.length > 0) {
5660
return false;
5761
}

‎packages/react-form-renderer/src/hooks/use-field-api.js‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,29 +15,29 @@ const useFieldApi = ({ name, initializeOnMount, component, render, validate, dat
1515
* This affects conditional fields
1616
*/
1717
if (initializeOnMount) {
18-
const initialValue = props.initialValue || fieldProps.meta.initial;
18+
const initialValue = Object.prototype.hasOwnProperty.call(props, 'initialValue') ? props.initialValue : formOptions.getFieldState(name).initial;
1919
fieldProps.input.onChange(initialValue);
2020
}
2121
}, [initializeOnMount, props.initialValue, fieldProps.meta.initial, fieldProps.input]);
2222

23+
/**
24+
* Prepare deleted value of field
25+
*/
26+
const fieldClearedValue = Object.prototype.hasOwnProperty.call(props, 'clearedValue') ? props.clearedValue : formOptions.clearedValue;
27+
2328
useEffect(
2429
() => () => {
2530
/**
2631
* Delete the value from form state when field is inmounted
2732
*/
2833
if ((formOptions.clearOnUnmount || props.clearOnUnmount) && props.clearOnUnmount !== false) {
29-
fieldProps.input.onChange(undefined);
34+
fieldProps.input.onChange(fieldClearedValue);
3035
}
3136
},
3237
// eslint-disable-next-line react-hooks/exhaustive-deps
3338
[]
3439
);
3540

36-
/**
37-
* Prepare deleted value of field
38-
*/
39-
const fieldClearedValue = Object.prototype.hasOwnProperty.call(props, 'clearedValue') ? props.clearedValue : formOptions.clearedValue;
40-
4141
/**
4242
* Map actions to props
4343
*/

‎packages/react-form-renderer/src/tests/form-renderer/enhanced-on-change.test.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,25 @@ describe('#enhancedOnChange', () => {
2929
expect(enhancedOnChange({ onChange: (value) => value, clearedValue }, value)).toEqual('Me');
3030
});
3131

32+
it('should return booelan events correctly with initialValue set', () => {
33+
const initial = false;
34+
const valueFalse = {
35+
target: {
36+
checked: false,
37+
type: 'checkbox'
38+
}
39+
};
40+
expect(enhancedOnChange({ onChange: (value) => value, clearedValue, initial }, valueFalse)).toEqual(valueFalse);
41+
42+
const valueTrue = {
43+
target: {
44+
checked: true,
45+
type: 'checkbox'
46+
}
47+
};
48+
expect(enhancedOnChange({ onChange: (value) => value, clearedValue, initial }, valueTrue)).toEqual(valueTrue);
49+
});
50+
3251
it('should correctly convert array datatype from strings to integers', () => {
3352
const value = ['1', '2', 3];
3453
expect(enhancedOnChange({ dataType: 'integer', onChange: (value) => value, clearedValue }, value)).toEqual([1, 2, 3]);

‎packages/react-form-renderer/src/tests/form-renderer/render-form.test.js‎

Lines changed: 256 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -992,6 +992,129 @@ describe('renderForm function', () => {
992992
wrapper.find('form').simulate('submit');
993993
expect(onSubmit).toHaveBeenCalledWith({ unmnounted: undefined, foo: 'barrr' });
994994
});
995+
996+
it('should clear values after unmount and set to field cleared value', () => {
997+
const schema = {
998+
fields: [
999+
{
1000+
component: componentTypes.TEXT_FIELD,
1001+
name: 'foo'
1002+
},
1003+
{
1004+
component: componentTypes.TEXT_FIELD,
1005+
name: 'unmnounted',
1006+
label: 'Label 1',
1007+
clearedValue: 'bla',
1008+
clearOnUnmount: true,
1009+
condition: {
1010+
when: 'foo',
1011+
is: 'show'
1012+
}
1013+
}
1014+
]
1015+
};
1016+
1017+
const onSubmit = jest.fn();
1018+
1019+
const wrapper = mount(
1020+
<FormRenderer
1021+
FormTemplate={(props) => <FormTemplate {...props} />}
1022+
componentMapper={{
1023+
[componentTypes.TEXT_FIELD]: TextField
1024+
}}
1025+
schema={schema}
1026+
onSubmit={(values) => onSubmit(values)}
1027+
clearedValue="BlaBlaBla"
1028+
/>
1029+
);
1030+
1031+
wrapper
1032+
.find('input')
1033+
.first()
1034+
.simulate('change', { target: { value: 'show' } });
1035+
wrapper.update();
1036+
wrapper
1037+
.find('input')
1038+
.last()
1039+
.simulate('change', { target: { value: 'foovalue' } });
1040+
wrapper.update();
1041+
1042+
wrapper.find('form').simulate('submit');
1043+
1044+
expect(onSubmit).toHaveBeenCalledWith({ foo: 'show', unmnounted: 'foovalue' });
1045+
onSubmit.mockClear();
1046+
1047+
wrapper
1048+
.find('input')
1049+
.first()
1050+
.simulate('change', { target: { value: 'barrr' } });
1051+
wrapper.update();
1052+
1053+
wrapper.find('form').simulate('submit');
1054+
1055+
expect(onSubmit).toHaveBeenCalledWith({ foo: 'barrr', unmnounted: 'bla' });
1056+
});
1057+
1058+
it('should clear values after unmount and set to form cleared value', () => {
1059+
const schema = {
1060+
fields: [
1061+
{
1062+
component: componentTypes.TEXT_FIELD,
1063+
name: 'foo'
1064+
},
1065+
{
1066+
component: componentTypes.TEXT_FIELD,
1067+
name: 'unmnounted',
1068+
label: 'Label 1',
1069+
clearOnUnmount: true,
1070+
condition: {
1071+
when: 'foo',
1072+
is: 'show'
1073+
}
1074+
}
1075+
]
1076+
};
1077+
1078+
const onSubmit = jest.fn();
1079+
1080+
const wrapper = mount(
1081+
<FormRenderer
1082+
FormTemplate={(props) => <FormTemplate {...props} />}
1083+
componentMapper={{
1084+
[componentTypes.TEXT_FIELD]: TextField
1085+
}}
1086+
schema={schema}
1087+
onSubmit={(values) => onSubmit(values)}
1088+
clearedValue="BlaBlaBla"
1089+
/>
1090+
);
1091+
1092+
wrapper
1093+
.find('input')
1094+
.first()
1095+
.simulate('change', { target: { value: 'show' } });
1096+
wrapper.update();
1097+
wrapper
1098+
.find('input')
1099+
.last()
1100+
.simulate('change', { target: { value: 'foovalue' } });
1101+
wrapper.update();
1102+
1103+
wrapper.find('form').simulate('submit');
1104+
1105+
expect(onSubmit).toHaveBeenCalledWith({ foo: 'show', unmnounted: 'foovalue' });
1106+
onSubmit.mockClear();
1107+
1108+
wrapper
1109+
.find('input')
1110+
.first()
1111+
.simulate('change', { target: { value: 'barrr' } });
1112+
wrapper.update();
1113+
1114+
wrapper.find('form').simulate('submit');
1115+
1116+
expect(onSubmit).toHaveBeenCalledWith({ foo: 'barrr', unmnounted: 'BlaBlaBla' });
1117+
});
9951118
});
9961119

9971120
describe('#initializeOnMount', () => {
@@ -1016,7 +1139,7 @@ describe('renderForm function', () => {
10161139
component: componentTypes.TEXT_FIELD,
10171140
name: INITIALIZED_FIELD,
10181141
initializeOnMount,
1019-
initialValue,
1142+
...(initialValue ? { initialValue } : {}),
10201143
condition: {
10211144
when: SHOWER_FIELD,
10221145
is: SHOW_VALUE
@@ -1183,6 +1306,138 @@ describe('renderForm function', () => {
11831306
expect(onSubmit).toHaveBeenCalledWith(expect.objectContaining({ [INITIALIZED_FIELD]: SCHEMA_INITIAL_VALUE, [SHOWER_FIELD]: SHOW_VALUE }));
11841307
onSubmit.mockReset();
11851308
});
1309+
1310+
it('should set false value in initializeOnMount', () => {
1311+
const schema = {
1312+
fields: [
1313+
{
1314+
component: componentTypes.TEXT_FIELD,
1315+
name: 'input'
1316+
},
1317+
{
1318+
component: componentTypes.TEXT_FIELD,
1319+
name: 'unmounted',
1320+
initialValue: false,
1321+
initializeOnMount: true,
1322+
condition: {
1323+
when: 'input',
1324+
is: 'show_false'
1325+
}
1326+
},
1327+
{
1328+
component: componentTypes.TEXT_FIELD,
1329+
name: 'unmounted',
1330+
initialValue: true,
1331+
initializeOnMount: true,
1332+
condition: {
1333+
when: 'input',
1334+
is: 'show_true'
1335+
}
1336+
}
1337+
]
1338+
};
1339+
1340+
const onSubmit = jest.fn();
1341+
1342+
const wrapper = mount(
1343+
<FormRenderer
1344+
FormTemplate={(props) => <FormTemplate {...props} />}
1345+
componentMapper={{
1346+
[componentTypes.TEXT_FIELD]: TextField
1347+
}}
1348+
schema={schema}
1349+
onSubmit={onSubmit}
1350+
/>
1351+
);
1352+
1353+
wrapper
1354+
.find('input')
1355+
.first()
1356+
.simulate('change', { target: { value: 'show_true' } });
1357+
wrapper.update();
1358+
1359+
wrapper.find('form').simulate('submit');
1360+
1361+
expect(onSubmit).toHaveBeenCalledWith({ input: 'show_true', unmounted: true }, expect.any(Object), expect.any(Function));
1362+
onSubmit.mockClear();
1363+
1364+
wrapper
1365+
.find('input')
1366+
.first()
1367+
.simulate('change', { target: { value: 'show_false' } });
1368+
wrapper.update();
1369+
1370+
wrapper.find('form').simulate('submit');
1371+
wrapper.update();
1372+
1373+
expect(onSubmit).toHaveBeenCalledWith({ input: 'show_false', unmounted: false }, expect.any(Object), expect.any(Function));
1374+
});
1375+
1376+
it('should set unefined value in initializeOnMount', () => {
1377+
const schema = {
1378+
fields: [
1379+
{
1380+
component: componentTypes.TEXT_FIELD,
1381+
name: 'input'
1382+
},
1383+
{
1384+
component: componentTypes.TEXT_FIELD,
1385+
name: 'unmounted',
1386+
initialValue: undefined,
1387+
initializeOnMount: true,
1388+
condition: {
1389+
when: 'input',
1390+
is: 'show_undef'
1391+
}
1392+
},
1393+
{
1394+
component: componentTypes.TEXT_FIELD,
1395+
name: 'unmounted',
1396+
initialValue: true,
1397+
initializeOnMount: true,
1398+
condition: {
1399+
when: 'input',
1400+
is: 'show_true'
1401+
}
1402+
}
1403+
]
1404+
};
1405+
1406+
const onSubmit = jest.fn();
1407+
1408+
const wrapper = mount(
1409+
<FormRenderer
1410+
FormTemplate={(props) => <FormTemplate {...props} />}
1411+
componentMapper={{
1412+
[componentTypes.TEXT_FIELD]: TextField
1413+
}}
1414+
schema={schema}
1415+
onSubmit={onSubmit}
1416+
/>
1417+
);
1418+
1419+
wrapper
1420+
.find('input')
1421+
.first()
1422+
.simulate('change', { target: { value: 'show_true' } });
1423+
wrapper.update();
1424+
1425+
wrapper.find('form').simulate('submit');
1426+
1427+
expect(onSubmit).toHaveBeenCalledWith({ input: 'show_true', unmounted: true }, expect.any(Object), expect.any(Function));
1428+
onSubmit.mockClear();
1429+
1430+
wrapper
1431+
.find('input')
1432+
.first()
1433+
.simulate('change', { target: { value: 'show_undef' } });
1434+
wrapper.update();
1435+
1436+
wrapper.find('form').simulate('submit');
1437+
wrapper.update();
1438+
1439+
expect(onSubmit).toHaveBeenCalledWith({ input: 'show_undef', unmounted: undefined }, expect.any(Object), expect.any(Function));
1440+
});
11861441
});
11871442

11881443
it('should use actionMapper', () => {

0 commit comments

Comments
 (0)