Is it possible to find out what exact field/child/node/DOM element the VeeValidate v3 ValidationProvider watches/listens to?
Currently, I am sorry, but updating to wonderful VeeValidate v4 is not possible in this project.
The main reason is to locate what field corresponds to what Vue VNode or DOM Node/Element after executing ValidationObserver's validateWithInfo which returns a Promise resolving to an object with ObserverField object(s) which, in turn, contains primitive values only but is keyed matching field name each.
One of the reasons the names (i.e. <abc name="Amazing Name Field" />) are stated is validation messages interpolation function.
For example, it would allow to focus on that invalid non-native or native field without name nor id prop or attribute assigned in more appropriate manner without re-iterating through the whole DOM again searching for a needle.
Considering the source code, it seems VeeValidate does not store actual references to non-native (i.e. Vue Component with <input> inside) nor native Vue node (e.g. <input>) found with v-model but sets Vue Component (i.e. $listeners) or Vue native (i.e. node.data.on) listeners to handle on input, blur, and change events.
export function addVNodeListener(vnode: VNode, eventName: string, handler: Function): void {
if (vnode.componentOptions) {
addComponentNodeListener(vnode, eventName, handler);
return;
}
addNativeNodeListener(vnode, eventName, handler);
}
Currently, it's being searched manually via iterating over provider.$children and searching for id or name matching the field, or querying over provider.$el for any DOM with these same id or name. Yet, the library allows to validate fields with neither assigned and containing multiple fields inside even if it listens to a single since v3.3.0: extractId, findInputNodes.