diff --git a/src/FormulateForm.vue b/src/FormulateForm.vue index 3b4531a..bf92cb7 100644 --- a/src/FormulateForm.vue +++ b/src/FormulateForm.vue @@ -104,7 +104,7 @@ export default { for (const field in newValue) { if (this.registry.has(field) && !shallowEqualObjects(newValue[field], this.proxy[field]) && - !shallowEqualObjects(newValue[field], this.registry.get(field).internalModelProxy[field]) + !shallowEqualObjects(newValue[field], this.registry.get(field).proxy[field]) ) { this.setFieldValue(field, newValue[field]) this.registry.get(field).context.model = newValue[field] diff --git a/src/FormulateInput.vue b/src/FormulateInput.vue index b2da741..8d4e406 100644 --- a/src/FormulateInput.vue +++ b/src/FormulateInput.vue @@ -240,7 +240,7 @@ export default { defaultId: this.$formulate.nextId(this), localAttributes: {}, localErrors: [], - internalModelProxy: this.getInitialValue(), + proxy: this.getInitialValue(), behavioralErrorVisibility: (this.errorBehavior === 'live'), formShouldShowErrors: false, validationErrors: [], @@ -284,7 +284,7 @@ export default { }, deep: true }, - internalModelProxy (newValue, oldValue) { + proxy (newValue, oldValue) { this.performValidation() if (!this.isVmodeled && !shallowEqualObjects(newValue, oldValue)) { this.context.model = newValue @@ -339,11 +339,11 @@ export default { // This should only be run immediately on created and ensures that the // proxy and the model are both the same before any additional registration. if ( - !shallowEqualObjects(this.context.model, this.internalModelProxy) && + !shallowEqualObjects(this.context.model, this.proxy) && // we dont' want to set the model if we are a sub-box of a multi-box field (Object.prototype.hasOwnProperty(this.$options.propsData, 'options') && this.classification === 'box') ) { - this.context.model = this.internalModelProxy + this.context.model = this.proxy } }, updateLocalAttributes (value) { diff --git a/src/libs/context.js b/src/libs/context.js index aaf8dda..47c0808 100644 --- a/src/libs/context.js +++ b/src/libs/context.js @@ -316,7 +316,7 @@ function defineModel (context) { * Get the value from a model. **/ function modelGetter () { - const model = this.isVmodeled ? 'formulateValue' : 'internalModelProxy' + const model = this.isVmodeled ? 'formulateValue' : 'proxy' if (this.type === 'checkbox' && !Array.isArray(this[model]) && this.options) { return [] } @@ -330,8 +330,8 @@ function modelGetter () { * Set the value from a model. **/ function modelSetter (value) { - if (!shallowEqualObjects(value, this.internalModelProxy)) { - this.internalModelProxy = value + if (!shallowEqualObjects(value, this.proxy)) { + this.proxy = value } this.$emit('input', value) if (this.context.name && typeof this.formulateSetter === 'function') { diff --git a/src/libs/registry.js b/src/libs/registry.js index 9e5cfec..6b98c0e 100644 --- a/src/libs/registry.js +++ b/src/libs/registry.js @@ -30,6 +30,8 @@ class Registry { */ remove (name) { this.registry.delete(name) + const { [name]: value, ...newProxy } = this.ctx.proxy + this.ctx.proxy = newProxy return this } @@ -88,11 +90,11 @@ class Registry { component.context.model = this.ctx.initialValues[field] } else if ( (hasVModelValue || hasValue) && - !shallowEqualObjects(component.internalModelProxy, this.ctx.initialValues[field]) + !shallowEqualObjects(component.proxy, this.ctx.initialValues[field]) ) { // In this case, the field is v-modeled or has an initial value and the // form has no value or a different value, so use the field value - this.ctx.setFieldValue(field, component.internalModelProxy) + this.ctx.setFieldValue(field, component.proxy) } if (this.childrenShouldShowErrors) { component.formShouldShowErrors = true @@ -118,7 +120,7 @@ class Registry { proxy: {}, registry: this, register: this.register.bind(this), - deregister: field => this.registry.delete(field), + deregister: field => this.remove(field), childrenShouldShowErrors: false } } diff --git a/test/unit/FormulateForm.test.js b/test/unit/FormulateForm.test.js index fb401b9..0d99d24 100644 --- a/test/unit/FormulateForm.test.js +++ b/test/unit/FormulateForm.test.js @@ -514,25 +514,26 @@ describe('FormulateForm', () => { }) }) - // it('removes field data when that field is de-registered', async () => { - // const wrapper = mount({ - // template: ` - // - // - // - // - // `, - // data () { - // return { - // formData: {} - // } - // } - // }) - // await flushPromises() - // wrapper.find('input[type="text"]').setValue('bar') - // await flushPromises() - // expect(wrapper.vm.formData).toEqual({ bar: true }) - // }) + it('removes field data when that field is de-registered', async () => { + const wrapper = mount({ + template: ` + + + + + `, + data () { + return { + formData: {} + } + } + }) + await flushPromises() + wrapper.find('input[type="text"]').setValue('bar') + await flushPromises() + expect(wrapper.findComponent(FormulateForm).vm.proxy).toEqual({ foo: 'bar' }) + expect(wrapper.vm.formData).toEqual({ foo: 'bar' }) + }) }) diff --git a/test/unit/FormulateInputText.test.js b/test/unit/FormulateInputText.test.js index 3d49de5..9b1f9e0 100644 --- a/test/unit/FormulateInputText.test.js +++ b/test/unit/FormulateInputText.test.js @@ -180,7 +180,7 @@ describe('FormulateInputText', () => { const wrapper = mount(FormulateInput, { propsData: { type: 'textarea' } }) const input = wrapper.find('textarea') input.setValue('changed value') - expect(wrapper.vm.internalModelProxy).toBe('changed value') + expect(wrapper.vm.proxy).toBe('changed value') })