Merge pull request #197 from formio/FIO-9021-fix-nested-form-iteration

[2.3.x] FIO-9021: Fixed eachComponentData iteration for nested forms

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/core",
-  "version": "2.3.0-rc.22",
+  "version": "2.3.0-dev.197.968a32c",
   "description": "The core Form.io renderering framework.",
   "main": "lib/index.js",
   "exports": {

src/utils/formUtil/__tests__/eachComponentData.test.ts

@@ -0,0 +1,54 @@
+import { expect } from 'chai';
+
+import { eachComponentData } from '../eachComponentData';
+import { Component } from 'types';
+
+describe('eachComponentData', function () {
+  const components = [
+    {
+      key: 'form',
+      type: 'form',
+      order: 1,
+      input: true,
+      components: [
+        {
+          type: 'textfield',
+          key: 'textField1',
+          order: 2,
+        },
+        {
+          type: 'textfield',
+          key: 'textField2',
+          order: 3,
+        },
+      ],
+    },
+    {
+      key: 'textField',
+      type: 'textfield',
+      order: 4,
+      input: true,
+    },
+  ];
+
+  const data = {
+    form: {
+      data: {
+        textField1: 'textField1Value',
+        textField2: 'textField2Value',
+      },
+      metadata: {},
+    },
+    textField: 'textFieldValue',
+    submit: true,
+  };
+
+  it('Should iterate through nested form components in the right order', function () {
+    let n = 1;
+
+    eachComponentData(components, data, (component: Component) => {
+      expect((component as any).order).to.equal(n);
+      n += 1;
+    });
+  });
+});

src/utils/formUtil/eachComponentData.ts

@@ -62,12 +62,12 @@ export const eachComponentData = (
         }
         if (getModelType(component) === 'dataObject') {
           // No need to bother processing all the children data if there is no data for this form or the reference value has not been loaded.
-          const nestedFormValue: any = get(data, component.path);
+          const nestedFormValue: any = get(data, compPath);
           const noReferenceAttached =
             nestedFormValue?._id && isEmpty(nestedFormValue.data) && !has(nestedFormValue, 'form');
           const shouldProcessNestedFormData = nestedFormValue?._id
             ? !noReferenceAttached
-            : has(data, component.path);
+            : has(data, compPath);
           if (shouldProcessNestedFormData) {
             // For nested forms, we need to reset the "data" and "path" objects for all of the children components, and then re-establish the data when it is done.
             const childPath: string = componentDataPath(component, path, compPath);

src/utils/formUtil/eachComponentDataAsync.ts

@@ -65,12 +65,12 @@ export const eachComponentDataAsync = async (
         }
         if (getModelType(component) === 'dataObject') {
           // No need to bother processing all the children data if there is no data for this form or the reference value has not been loaded.
-          const nestedFormValue: any = get(data, component.path);
+          const nestedFormValue: any = get(data, compPath);
           const noReferenceAttached =
             nestedFormValue?._id && isEmpty(nestedFormValue.data) && !has(nestedFormValue, 'form');
           const shouldProcessNestedFormData = nestedFormValue?._id
             ? !noReferenceAttached
-            : has(data, component.path);
+            : has(data, compPath);
           if (shouldProcessNestedFormData) {
             // For nested forms, we need to reset the "data" and "path" objects for all of the children components, and then re-establish the data when it is done.
             const childPath: string = componentDataPath(component, path, compPath);