FIO-7632: Fixes an issue where HTML tags are added to the HTML5 Selec…

…t metadata
formio · Feb 5, 2024 · bdcba90 · bdcba90
1 parent c73cfd7
commit bdcba90
Show file tree

Hide file tree

Showing 4 changed files with 135 additions and 6 deletions.
diff --git a/src/components/select/Select.js b/src/components/select/Select.js
@@ -957,10 +957,6 @@ export default class SelectComponent extends ListComponent {
       this.addFocusBlurEvents(input);
       this.triggerUpdate(null, true);
 
-      if (this.visible) {
-        this.setItems(this.selectOptions || []);
-      }
-
       this.focusableElement = input;
 
       if (this.component.dataSrc === 'custom') {

diff --git a/src/components/select/Select.unit.js b/src/components/select/Select.unit.js
@@ -29,7 +29,8 @@ import {
   comp17,
   comp18,
   comp19,
-  comp20
+  comp20,
+  comp21,
 } from './fixtures';
 
 // eslint-disable-next-line max-statements
@@ -949,6 +950,33 @@ describe('Select Component', () => {
     }).catch(done);
   });
 
+  it('Should provide correct metadata.selectData for HTML5 Select', (done) => {
+    const element = document.createElement('div');
+
+    Formio.createForm(element, comp21).then(form => {
+      const select = form.getComponent('animals');
+      const checkbox = form.getComponent('checkbox');
+      const value = 'dog';
+      select.setValue(value);
+
+      setTimeout(()=> {
+        checkbox.setValue(true);
+        setTimeout(() => {
+          const submit = form.getComponent('submit');
+          const clickEvent = new Event('click');
+          const submitBtn = submit.refs.button;
+          submitBtn.dispatchEvent(clickEvent);
+
+          setTimeout(() => {
+            const metadata = form.submission.metadata.selectData.animals2;
+            assert.equal(metadata.label, 'Dog');
+            done();
+          }, 200);
+        }, 300);
+      }, 200);
+    }).catch(done);
+  });
+
   it('OnBlur validation should work properly with Select component', function(done) {
     this.timeout(0);
     const element = document.createElement('div');

diff --git a/src/components/select/fixtures/comp21.js b/src/components/select/fixtures/comp21.js
@@ -0,0 +1,104 @@
+export default {
+  title: 'FIO-7632',
+  name: 'fio7632',
+  path: 'fio7632',
+  type: 'form',
+  display: 'form',
+  components: [
+    {
+      collapsible: false,
+      key: 'panel',
+      type: 'panel',
+      label: 'Panel',
+      input: false,
+      tableView: false,
+      components: [
+        {
+          label: 'Animals',
+          widget: 'html5',
+          tableView: true,
+          data: {
+            values: [
+              {
+                label: 'Dog',
+                value: 'dog',
+              },
+              {
+                label: 'Cat',
+                value: 'cat',
+              },
+              {
+                label: 'Horse',
+                value: 'horse',
+              },
+            ],
+          },
+          key: 'animals',
+          type: 'select',
+          input: true,
+        },
+        {
+          label: 'Checkbox',
+          tableView: false,
+          key: 'checkbox',
+          type: 'checkbox',
+          input: true,
+        },
+        {
+          label: 'Animals2',
+          widget: 'html5',
+          tableView: true,
+          data: {
+            values: [
+              {
+                label: 'Dog',
+                value: 'dog',
+              },
+              {
+                label: 'Cat',
+                value: 'cat',
+              },
+              {
+                label: 'Horse',
+                value: 'horse',
+              },
+            ],
+          },
+          calculateValue: 'if (data.checkbox === true) {\n  value = data.animals;\n}',
+          key: 'animals2',
+          logic: [
+            {
+              name: 'disable',
+              trigger: {
+                type: 'javascript',
+                javascript: 'result = row.checkbox === true;',
+              },
+              actions: [
+                {
+                  name: 'disable',
+                  type: 'property',
+                  property: {
+                    label: 'Disabled',
+                    value: 'disabled',
+                    type: 'boolean',
+                  },
+                  state: true,
+                },
+              ],
+            },
+          ],
+          type: 'select',
+          input: true,
+        },
+        {
+          type: 'button',
+          label: 'Submit',
+          key: 'submit',
+          disableOnInvalid: true,
+          input: true,
+          tableView: false,
+        },
+      ],
+    },
+  ],
+};
diff --git a/src/components/select/fixtures/index.js b/src/components/select/fixtures/index.js
@@ -18,4 +18,5 @@ import comp17 from './comp17';
 import comp18 from './comp18';
 import comp19 from './comp19';
 import comp20 from './comp20';
-export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20 };
+import comp21 from './comp21';
+export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21 };