Merge branch 'master' of github.com:formio/formio.js into FIO-7195-se…

…lect-radio-itl-url-source-show-value-for-modal-preview
formio · May 16, 2024 · 9e84922 · 9e84922
2 parents 75f460a + 7d668e1
commit 9e84922
Show file tree

Hide file tree

Showing 7 changed files with 131 additions and 18 deletions.
diff --git a/Changelog.md b/Changelog.md
@@ -243,6 +243,8 @@ Formio.createForm(document.getElementById('formio'), 'https://examples.form.io/e
  - FIO-8091: Fixed missing metadata for html5 select component with default value
  - FIO-7445: fixed an issue with interpolated data in HTML
  - FIO-7507: publish-dev-tag-to-npm
+ - FIO-8330: fixed saving draft if saveDraft and skipDraftRestore are true
+ - FIO-7595: fixed incorrect value for conditionally hidden Checkbox
 
 ## 5.0.0-rc.37
 ### Fixed

diff --git a/src/Webform.js b/src/Webform.js
@@ -303,12 +303,19 @@ export default class Webform extends NestedDataComponent {
     this.language = this.i18next.language;
 
     // See if we need to restore the draft from a user.
-    if (this.options.saveDraft && !this.options.skipDraftRestore) {
+    if (this.options.saveDraft) {
       this.formReady.then(()=> {
-        const user = Formio.getUser();
-        // Only restore a draft if the submission isn't explicitly set.
-        if (user && !this.submissionSet) {
-          this.restoreDraft(user._id);
+        if (!this.options.skipDraftRestore) {
+          const user = Formio.getUser();
+          // Only restore a draft if the submission isn't explicitly set.
+          if (user && !this.submissionSet) {
+            this.restoreDraft(user._id);
+          }
+        }
+        else {
+          // Enable drafts
+          this.draftEnabled = true;
+          this.savingDraft = false;
         }
       });
     }

diff --git a/src/Webform.unit.js b/src/Webform.unit.js
@@ -4603,6 +4603,7 @@ describe('Webform tests', function() {
     const originalMakeRequest = Formio.makeRequest;
     let saveDraftCalls = 0;
     let restoreDraftCalls = 0;
+    let state = null;
     const scenario = {
       restoreDraftError: false,
       saveDraftError: false,
@@ -4626,6 +4627,11 @@ describe('Webform tests', function() {
             ? Promise.reject('Save Draft Error')
             : Promise.resolve(fastCloneDeep(data));
         }
+        if (type === 'submission' && method === 'post') {
+          state = data.state;
+          saveDraftCalls = ++saveDraftCalls;
+          return Promise.resolve(fastCloneDeep(data));
+        }
         if (type === 'form' && method === 'get') {
           return Promise.resolve(fastCloneDeep({
             _id: '65cdd69efb1b9683c216fa1d',
@@ -4709,6 +4715,7 @@ describe('Webform tests', function() {
     afterEach(() => {
       saveDraftCalls = 0;
       restoreDraftCalls = 0;
+      state = null;
       scenario.restoreDraftError = false;
       scenario.saveDraftError = false;
     });
@@ -4812,6 +4819,34 @@ describe('Webform tests', function() {
         }, 200);
       }).catch((err) => done(err));
     });
+
+    it('Should save the draft after changing the data if skipDraftRestore is set as true', function(done) {
+      const formElement = document.createElement('div');
+      Formio.createForm(
+        formElement,
+        'http://localhost:3000/zarbzxibjafpcjb/testdrafterrors',
+        {
+          saveDraft: true,
+          skipDraftRestore: true
+        }
+      ).then((form) => {
+        setTimeout(() => {
+          assert.equal(restoreDraftCalls, 0, 'Should not restore Draft');
+          assert.equal(saveDraftCalls, 0);
+          assert.equal(_.isUndefined(form.submission.state), true);
+          const tfInput = form.getComponent('textField').refs.input[0];
+          tfInput.value = 'test';
+          const inputEvent = new Event('input');
+          tfInput.dispatchEvent(inputEvent);
+          setTimeout(() => {
+            assert.equal(restoreDraftCalls, 0);
+            assert.equal(saveDraftCalls, 1, 'Should save Draft');
+            assert.equal(state, 'draft');
+            done();
+          }, 300);
+        },200);
+      }).catch((err) => done(err));
+    });
   });
 
   it('Should render labels for Select, Radio and selectBoxes components when Data Source is URL', (done) => {

diff --git a/src/components/checkbox/Checkbox.js b/src/components/checkbox/Checkbox.js
@@ -202,17 +202,8 @@ export default class CheckBoxComponent extends Field {
   }
 
   setValue(value, flags = {}) {
-    if (
-      this.setCheckedState(value) !== undefined ||
-      (!this.input && value !== undefined && (this.visible || this.conditionallyVisible() || !this.component.clearOnHide))
-    ) {
-      const changed = this.updateValue(value, flags);
-      if (this.isHtmlRenderMode() && flags && flags.fromSubmission && changed) {
-        this.redraw();
-      }
-      return changed;
-    }
-    return false;
+    this.setCheckedState(value);
+    return super.setValue(value, flags);
   }
 
   getValueAsString(value) {

diff --git a/src/components/checkbox/Checkbox.unit.js b/src/components/checkbox/Checkbox.unit.js
@@ -10,7 +10,8 @@ import {
   customDefaultComponent,
   comp2,
   comp3,
-  comp4
+  comp4,
+  comp5
 } from './fixtures';
 
 describe('Checkbox Component', () => {
@@ -91,4 +92,27 @@ describe('Checkbox Component', () => {
       }, 300);
     }).catch((err) => done(err));
   });
+
+  it('Should set the value for the checkbox if it set before the component from checbox`s condition', (done) =>  {
+    const form = _.cloneDeep(comp5);
+    const element = document.createElement('div');
+    const data = {
+      textField: 'test',
+      checkboxBefore: true,
+      checkboxAfter: true
+    };
+    Formio.createForm(element, form).then(form => {
+      form.setValue({ data }, { sanitize: true });
+      const checkboxBefore = form.getComponent('checkboxBefore');
+      const checkboxAfter = form.getComponent('checkboxAfter');
+      setTimeout(() => {
+        const inputBefore = Harness.testElements(checkboxBefore, 'input[type="checkbox"]', 1)[0];
+        assert.equal(inputBefore.checked, true);
+        const inputAfter = Harness.testElements(checkboxAfter, 'input[type="checkbox"]', 1)[0];
+        assert.equal(inputAfter.checked, true);
+        assert.deepEqual(form.data, data);
+        done();
+      }, 300);
+    }).catch((err) => done(err));
+  });
 });
diff --git a/src/components/checkbox/fixtures/comp5.js b/src/components/checkbox/fixtures/comp5.js
@@ -0,0 +1,53 @@
+export default {
+    title: '7595',
+    name: '7595',
+    path: '7595',
+    type: 'form',
+    display: 'form',
+    components:[
+        {
+            label: 'Checkbox',
+            tableView: false,
+            validateWhenHidden: false,
+            key: 'checkboxBefore',
+            conditional: {
+              show: true,
+              conjunction: 'all',
+              conditions: [
+                {
+                  component: 'textField',
+                  operator: 'isNotEmpty'
+                }
+              ]
+            },
+            type: 'checkbox',
+            input: true
+        },
+        {
+        label: 'Text Field',
+        applyMaskOn: 'change',
+        tableView: true,
+        key: 'textField',
+        type: 'textfield',
+        input: true
+        },
+        {
+            label: 'Checkbox',
+            tableView: false,
+            validateWhenHidden: false,
+            key: 'checkboxAfter',
+            conditional: {
+              show: true,
+              conjunction: 'all',
+              conditions: [
+                {
+                  component: 'textField',
+                  operator: 'isNotEmpty'
+                }
+              ]
+            },
+            type: 'checkbox',
+            input: true
+        },
+    ]
+};
diff --git a/src/components/checkbox/fixtures/index.js b/src/components/checkbox/fixtures/index.js
@@ -3,4 +3,5 @@ import customDefaultComponent from './customDefaultComponent';
 import comp2 from './comp2';
 import comp3 from './comp3';
 import comp4 from './comp4';
-export { comp1, comp2, comp3, comp4, customDefaultComponent };
+import comp5 from './comp5';
+export { comp1, comp2, comp3, comp4, comp5, customDefaultComponent };