diff --git a/src/components/Form/Form.vue b/src/components/Form/Form.vue
index 7c0c60694..5e711a144 100644
--- a/src/components/Form/Form.vue
+++ b/src/components/Form/Form.vue
@@ -75,9 +75,6 @@ export default {
FormLocales,
FormPage,
},
- provide() {
- return {removeError: this.removeError};
- },
props: {
/** Used by a parent component, such as `Container`, to identify events emitted from the form and update the form props when necessary. */
id: String,
diff --git a/src/components/Form/FormGroup.vue b/src/components/Form/FormGroup.vue
index 63c21039c..5e3b31974 100644
--- a/src/components/Form/FormGroup.vue
+++ b/src/components/Form/FormGroup.vue
@@ -165,7 +165,19 @@ export default {
* @param {String} localeKey The locale key for a multilingual field
*/
setFieldErrors: function (name, errors, localeKey = '') {
- let newErrors = {...this.errors};
+ /**
+ * Better practice is to make to copy of data, modify it and send it upstream
+ * But there is challenge with #9996, where each unmounted fields needs to clean up
+ * its error. And given its happening synchronously, it does not propagate updated errors
+ * object in between the unmounts. Therefore last operation would override the previous ones.
+ *
+ * Changing error object inplace ensures all the updates gets registered.
+ *
+ * In future better approach would be to have remove-error event, which defines what to remove
+ * and would be correctly processed by the state manager
+ */
+
+ let newErrors = this.errors;
if (!errors || !errors.length) {
if (localeKey && newErrors[name] && newErrors[name][localeKey]) {
delete newErrors[name][localeKey];
@@ -180,7 +192,7 @@ export default {
newErrors[name] = errors;
}
}
- this.$emit('set-errors', newErrors);
+ this.$emit('set-errors', {...newErrors});
},
},
};
diff --git a/src/components/Form/fields/FieldBase.vue b/src/components/Form/fields/FieldBase.vue
index 25f472470..e7714ea37 100644
--- a/src/components/Form/fields/FieldBase.vue
+++ b/src/components/Form/fields/FieldBase.vue
@@ -14,7 +14,6 @@ export default {
Tooltip,
MultilingualProgress,
},
- inject: ['removeError'],
props: {
/** The key for this field. Used in the `name` attribute of ``, `