$externalResults are not automatically cleared on $model change when using dynamic/computed rules

[renatodeleao]

Describe the bug

If you're using dynamic rules object via computed as documented, your client-side validations work dynamically as expected. If you add $externalResults to the mix and the rules rules are re-computed after $externalErrors been applied — this part is key —, $externalErrors are no longer cleared when $model changes.

Reproduction URL

https://stackblitz.com/edit/vitejs-vite-j6ywfz?file=src%2FAppForm.vue

To Reproduce the issue

1. Fill "Y" field to just pass client-side validations
2. Click "submit"
3. See that $externalErrors are applied correctly to "Y" field input
4. Tweak "X" field value for rules to be recomputed, it doesn't matter what value you set.
5. Now try to change the "Y" input of the original concat item that still has $externalErrors on it and see that errors are no longer cleared as expected.

Notes

• I've printed $externalErrors and form state and validation state (v$) so you can see that everything keeps working, with exception to $externalResults that stops being mutated after it step 4.
• The reproduction example is based on a demo from this repository

Expected behavior

$externalErrors should be cleared from inputs when $model is changed, independently from any rules recomputation

Additional context

The culprit line is the $model setter which was added by this commit. Basically when rules are computed with an existent $externalResults ref, a watcher for validations is triggered and setValidations is called, internally cachedExternalResults is populated with the current value, and when $model setter is trigger, $externalResults is mutated with the existent field error instead of removing it. It only works without dynamic rules by chance, because cachedExternalResults is an empty object and thus cachedExternalResults[key] returns undefined effectively removing the error.

vuelidate/packages/vuelidate/src/core.js

Lines 468 to 470 in 08aa514

	if (external) {
	external[key] = cachedExternalResults[key]
	}

Solution

I don't know if this was added by mistake or there's a real usecase for this in $model but the issue goes away without any test failure by doing

if (external) { 
   external[key] = undefined
   //  delete external[key]  only works for vue3
 }

Related docs:

• https://vuelidate-next.netlify.app/advanced_usage.html#external-results-with-composition-api
• https://vuelidate-next.netlify.app/advanced_usage.html#clearing-externalresults

EDIT

This issue was created based on a much complex setup assumption and was reworked to reproduce with a basic one.
The original demo is https://stackblitz.com/edit/vitejs-vite-wgbh2d?file=src%2FAppForm.vue

[renatodeleao]

UPDATE: I think i've found the cause and it's not related with collections or state modifications, but with dynamic rules paired with $externalResults.

I'll reword the issue and add a simpler example as I can reproduce it with one of your test-project demos