diff --git a/src/components/select/Select.js b/src/components/select/Select.js index 67dcc9fa6f..9ea606639d 100644 --- 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 index bc96c83e78..59fdbefad8 100644 --- 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 new file mode 100644 index 0000000000..198eb7189d --- /dev/null +++ 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 index 0fa3a99cc4..7e0e7d9307 100644 --- 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 };