syncing commit from monorepo. PR: 340, Title: FIO-10396: Fixes an issue where data of conditionally shown nested form inside nested form inside DataGrid is not passed to the root form

src/components/datagrid/DataGrid.js

@@ -587,7 +587,13 @@ export default class DataGridComponent extends NestedArrayComponent {
           const formComp = getComponent(this.component.components, changed.component.key)
           _.set(formComp, 'components', changed.component.components);
         }
-        this.triggerChange({ modified });
+        // If we're in a nested form we need to ensure our changes are triggered upstream
+        if (changed.instance.root?.id && (this.root?.id !== changed.instance.root.id)) {
+          changed.instance.root.triggerChange(flags, changed, modified);
+        }
+        else {
+          this.triggerChange({ modified });
+        }
       }
 
       let columnComponent;

test/unit/DataGrid.unit.js

@@ -29,7 +29,8 @@ import {
   withAllowCalculateOverride,
   twoWithAllowCalculatedOverride, withCheckboxes,
   withReorder,
-  wizardWithDataGridWithNestedForm
+  wizardWithDataGridWithNestedForm,
+  dataGridWithNestedFormWithNestedForm, dataGridChildForm, dataGridGrandChildForm,
 } from './fixtures/datagrid';
 
 describe('DataGrid Component', () => {
@@ -1173,6 +1174,12 @@ describe('Wizard Form with Grid with Nested Form validation', () => {
       if (type === 'form' && method === 'get' && url.includes('6800c965a969b07fbd8d7077')) {
         return Promise.resolve(_.cloneDeep(nestedForm));
       }
+      if (type === 'form' && method === 'get' && url.includes('child')) {
+        return Promise.resolve(_.cloneDeep(dataGridChildForm));
+      }
+      if (type === 'form' && method === 'get' && url.includes('grandChild')) {
+        return Promise.resolve(_.cloneDeep(dataGridGrandChildForm));
+      }
       return Promise.resolve();
     };
   });
@@ -1197,4 +1204,58 @@ describe('Wizard Form with Grid with Nested Form validation', () => {
       }, 300);
     }).catch(done);
   });
+
+  it('Should validate DataGrid with nested form inside Nested Wizard before going to the next page', function (done) {
+    Formio.createForm(document.createElement('div'), dataGridWithNestedFormWithNestedForm)
+          .then((form) => {
+            const selectToShowChildForm = form.getComponent(['dataGrid', 0, 'select']);
+            selectToShowChildForm.setValue('show', { modified: true });
+            setTimeout(() => {
+              const selectToShowGrandChildForm = form.getComponent(['dataGrid', 0, 'form', 'data', 'selectnested']);
+              selectToShowGrandChildForm.setValue('dog', { modified: true });
+              setTimeout(() => {
+                const grandChildTextField = form.getComponent(['dataGrid', 0, 'form', 'data', 'form', 'data', 'textField']);
+                grandChildTextField.setValue('Test', { modified: true });
+                setTimeout(() => {
+                  assert.equal(grandChildTextField.dataValue, 'Test', 'Should set the value properly');
+                  const submissionData = {
+                    dataGrid: [
+                      {
+                        select: 'show',
+                        form: {
+                          data: {
+                            selectnested: 'dog',
+                            form: {
+                              data: {
+                                textField: 'Test',
+                              },
+                            },
+                          },
+                          metadata: {
+                            selectData: {
+                              dataGrid: [
+                                {
+                                  form: {
+                                    data: {
+                                      selectnested: {
+                                        label: 'dog',
+                                      },
+                                    },
+                                  },
+                                },
+                              ],
+                            },
+                          },
+                        },
+                      },
+                    ],
+                    submit: false,
+                  };
+                  assert.deepEqual(form.submission.data,  submissionData, 'Should set all the nested values to submission object properly');
+                  done();
+                }, 500);
+              }, 500);
+            }, 500);
+          }).catch(done);
+  });
 });

test/unit/fixtures/datagrid/dataGridWithNestedFormWithNestedForm.js

@@ -0,0 +1,71 @@
+export default {
+  title: 'FD61237 Parent',
+  name: 'fd61237Parent',
+  path: 'fd61237parent',
+  type: 'form',
+  display: 'form',
+  components: [
+    {
+      label: 'Data Grid',
+      reorder: false,
+      addAnotherPosition: 'bottom',
+      layoutFixed: false,
+      enableRowGroups: false,
+      initEmpty: false,
+      tableView: false,
+      defaultValue: [{}],
+      validateWhenHidden: false,
+      key: 'dataGrid',
+      type: 'datagrid',
+      input: true,
+      components: [
+        {
+          label: 'Select',
+          widget: 'choicesjs',
+          tableView: true,
+          data: {
+            values: [
+              {
+                label: 'show',
+                value: 'show',
+              }, {
+                label: 'no show',
+                value: 'noShow',
+              },
+            ],
+          },
+          validateWhenHidden: false,
+          key: 'select',
+          type: 'select',
+          input: true,
+        }, {
+          label: 'Form',
+          tableView: true,
+          form: 'child',
+          useOriginalRevision: false,
+          key: 'form',
+          conditional: {
+            show: true,
+            conjunction: 'any',
+            conditions: [
+              {
+                component: 'dataGrid.select',
+                operator: 'isEqual',
+                value: 'show',
+              },
+            ],
+          },
+          type: 'form',
+          input: true,
+        },
+      ],
+    }, {
+      type: 'button',
+      label: 'Submit',
+      key: 'submit',
+      disableOnInvalid: true,
+      input: true,
+      tableView: false,
+    },
+  ],
+};

test/unit/fixtures/datagrid/fd61237Child.js

@@ -0,0 +1,70 @@
+export default {
+  title: 'FD61237 child',
+  type: 'form',
+  name: 'fd61237Child',
+  path: 'fd61237child',
+  pdfComponents: [],
+  display: 'form',
+  tags: [
+    'common',
+  ],
+  settings: {},
+  components: [
+    {
+      label: 'Select',
+      widget: 'choicesjs',
+      tableView: true,
+      data: {
+        values: [
+          {
+            label: 'dog',
+            value: 'dog',
+          },
+          {
+            label: 'cat',
+            value: 'cat',
+          },
+          {
+            label: 'horse',
+            value: 'horse',
+          },
+        ],
+      },
+      validate: {
+        required: true,
+      },
+      validateWhenHidden: false,
+      key: 'selectnested',
+      type: 'select',
+      input: true,
+    },
+    {
+      label: 'Form',
+      tableView: true,
+      form: 'grandChild',
+      useOriginalRevision: false,
+      key: 'form',
+      conditional: {
+        show: true,
+        conjunction: 'all',
+        conditions: [
+          {
+            component: 'selectnested',
+            operator: 'isEqual',
+            value: 'dog',
+          },
+        ],
+      },
+      type: 'form',
+      input: true,
+    },
+    {
+      type: 'button',
+      label: 'Submit',
+      key: 'submit',
+      disableOnInvalid: true,
+      input: true,
+      tableView: false,
+    },
+  ],
+};

test/unit/fixtures/datagrid/fd61237GrandChild.js

@@ -0,0 +1,26 @@
+export default {
+  title: 'Grand Child Form',
+  name: 'grandChildForm',
+  path: 'grandchildform',
+  type: 'form',
+  display: 'form',
+  components: [
+    {
+      label: 'Text Field',
+      applyMaskOn: 'change',
+      tableView: true,
+      validate: { required: true },
+      validateWhenHidden: false,
+      key: 'textField',
+      type: 'textfield',
+      input: true,
+    }, {
+      type: 'button',
+      label: 'Submit',
+      key: 'submit',
+      disableOnInvalid: true,
+      input: true,
+      tableView: false,
+    },
+  ],
+};

test/unit/fixtures/datagrid/index.js

@@ -20,6 +20,15 @@ import withAllowCalculateOverride from './comp-with-allow-calculate-override';
 import twoWithAllowCalculatedOverride from './two-comp-with-allow-calculate-override';
 import withCheckboxes from './comp-with-checkboxes';
 import withReorder from './comp-with-reorder';
-import wizardWithDataGridWithNestedForm from './wizardWithDataGridWithNestedForm'
-export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, withCollapsibleRowGroups, withConditionalFieldsAndValidations, withDefValue, withLogic, withRowGroupsAndDefValue, modalWithRequiredFields, withAllowCalculateOverride, twoWithAllowCalculatedOverride, withCheckboxes, withReorder,wizardWithDataGridWithNestedForm };
+import wizardWithDataGridWithNestedForm from './wizardWithDataGridWithNestedForm';
+import dataGridWithNestedFormWithNestedForm from './dataGridWithNestedFormWithNestedForm';
+import dataGridChildForm from './fd61237Child';
+import dataGridGrandChildForm from './fd61237GrandChild';
+
+export {
+  comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, withCollapsibleRowGroups,
+  withConditionalFieldsAndValidations, withDefValue, withLogic, withRowGroupsAndDefValue, modalWithRequiredFields,
+  withAllowCalculateOverride, twoWithAllowCalculatedOverride, withCheckboxes, withReorder,
+  wizardWithDataGridWithNestedForm, dataGridWithNestedFormWithNestedForm, dataGridChildForm, dataGridGrandChildForm
+};