From 22d0f16dff68deda1c85090378179ad5a94e4048 Mon Sep 17 00:00:00 2001 From: ZenMasterJacob20011 Date: Mon, 24 Jun 2024 15:39:11 -0500 Subject: [PATCH] components resetValue will default to defaultValue --- .../_classes/component/Component.js | 8 +-- .../_classes/component/Component.unit.js | 26 ++++++++- .../_classes/component/fixtures/comp6.js | 57 +++++++++++++++++++ .../_classes/component/fixtures/index.js | 3 +- 4 files changed, 88 insertions(+), 6 deletions(-) create mode 100644 src/components/_classes/component/fixtures/comp6.js diff --git a/src/components/_classes/component/Component.js b/src/components/_classes/component/Component.js index fd8e2d4187..b6aaa10be6 100644 --- a/src/components/_classes/component/Component.js +++ b/src/components/_classes/component/Component.js @@ -1678,7 +1678,7 @@ export default class Component extends Element { /** * Creates a modal to input the value of this component. - * @param {HTMLElement} element - The element to attach the modal to. + * @param {HTMLElement} element - The element to attach the modal to. * @param {any} attr - A list of attributes to add to the modal. * @param {boolean} confirm - If we should add a confirmation to the modal that keeps it from closing unless confirmed. * @returns {HTMLElement} - The created modal element. @@ -2398,7 +2398,7 @@ export default class Component extends Element { * @param {Array} elements - An array of DOM elements to set the error classes on. * @param {boolean} dirty - If the input is dirty. * @param {boolean} hasErrors - If the input has errors. - * @param {boolean} hasMessages - If the input has messages. + * @param {boolean} hasMessages - If the input has messages. * @param {HTMLElement} element - The wrapper element for all the other elements passed in first argument. * @returns {void} */ @@ -3052,7 +3052,7 @@ export default class Component extends Element { */ resetValue() { this.unset(); - this.setValue(this.emptyValue, { + this.setValue(this.defaultValue || this.emptyValue, { noUpdateEvent: true, noValidate: true, resetValue: true @@ -3233,7 +3233,7 @@ export default class Component extends Element { * @param {*} data - The data to perform the calculation with. * @param {*} flags - The flags to use when calculating the value. * @param {*} row - The contextual row data to use when performing the calculation. - * @returns {boolean} - TRUE if the value changed. + * @returns {boolean} - TRUE if the value changed. */ calculateValue(data, flags, row) { data = data || this.rootValue; diff --git a/src/components/_classes/component/Component.unit.js b/src/components/_classes/component/Component.unit.js index 46606065f2..928fda29c4 100644 --- a/src/components/_classes/component/Component.unit.js +++ b/src/components/_classes/component/Component.unit.js @@ -5,7 +5,7 @@ import sinon from 'sinon'; import Component from './Component'; import Webform from '../../../Webform'; import Harness from '../../../../test/harness'; -import { comp1 } from './fixtures'; +import { comp1, comp6 } from './fixtures'; import _merge from 'lodash/merge'; import comp3 from './fixtures/comp3'; import comp4 from './fixtures/comp4'; @@ -370,4 +370,28 @@ describe('Component', () => { }) .catch(done); }); + + it('Should reset value to default value if default value is given', (done) => { + Formio.createForm(document.createElement('div'), comp6, {}).then((form) => { + const inputValue = (value, component) => { + const input = component.refs.input?.[0] || component.refs.selectContainer; + const inputEvent = new Event('input'); + input.value = value; + input.dispatchEvent(inputEvent); + }; + const textfield = form.getComponent('textField'); + const number = form.getComponent('number'); + const select = form.getComponent('select'); + inputValue('hello', textfield); + inputValue('321', number); + inputValue('b', select); + setTimeout(()=>{ + form.resetValue(); + assert.equal(textfield.refs.input[0].value, 'test'); + assert.equal(number.refs.input[0].value, '123'); + assert.equal(select.refs.selectContainer.value, 'a'); + done(); + },200); + }).catch(done); + }); }); diff --git a/src/components/_classes/component/fixtures/comp6.js b/src/components/_classes/component/fixtures/comp6.js new file mode 100644 index 0000000000..ffc48b08c3 --- /dev/null +++ b/src/components/_classes/component/fixtures/comp6.js @@ -0,0 +1,57 @@ +export default { + "components": [ + { + "label": "Text Field", + "applyMaskOn": "change", + "tableView": true, + "key": "textField", + "type": "textfield", + "input": true, + "defaultValue": "test" + }, + { + "label": "Number", + "applyMaskOn": "change", + "mask": false, + "tableView": false, + "delimiter": false, + "requireDecimal": false, + "inputFormat": "plain", + "truncateMultipleSpaces": false, + "key": "number", + "type": "number", + "input": true, + "defaultValue": 123 + }, + { + "label": "Select", + "widget": "choicesjs", + "tableView": true, + "data": { + "values": [ + { + "label": "a", + "value": "a" + }, + { + "label": "b", + "value": "b" + } + ] + }, + "key": "select", + "type": "select", + "input": true, + "defaultValue": "a" + }, + { + "label": "Reset", + "action": "reset", + "showValidations": false, + "tableView": false, + "key": "reset", + "type": "button", + "input": true + }, + ] +} diff --git a/src/components/_classes/component/fixtures/index.js b/src/components/_classes/component/fixtures/index.js index e6e320dd66..00ed00eea0 100644 --- a/src/components/_classes/component/fixtures/index.js +++ b/src/components/_classes/component/fixtures/index.js @@ -3,4 +3,5 @@ import comp2 from './comp2'; import comp3 from './comp3'; import comp4 from './comp4'; import comp5 from './comp5'; -export { comp1, comp2, comp3, comp4, comp5 }; +import comp6 from './comp6'; +export { comp1, comp2, comp3, comp4, comp5, comp6 };