Broken reactivity in Vue 3.5.10

[hivokas]

Vue version

3.5.10

Link to minimal reproduction

https://play.vuejs.org/#eNqVVNtu00AQ/ZWRFSmpSG2qwgMhROXShyJuggoeMKKudxJva++u9uKmivLvjHfjS0tUqB/s9cycM2eOd72JXisV1w6jWTS3WKkys7hIBcCc8dovaKkWPwoUcDHKnJXvuLa3F8ANWO1wChqz3PKa21u4kfrawJILBC7gu0M4jp/HL6Zw6SwwiUaMrS8apo+ezhNFndpeGhebDXASY2C7pRwFuiwRWSnA3ip8lUbhLY3gJC95fk2RjLEzQqbR4sk8CekBNdSHS6mpDLWWuhFRj2Lf6QOKlS3ikU8YggcIAEnxsXhUoTHZCknTjs6rbp7BqXky8I9eTa65sn7NKyW1hQ04gzR2yRlVwRaWWlYwPiH7QyjJpcbxywHgEu0NkvV7auvML0hug0gFrj2G4TJzJWEbbQatU5OD8AL0qazTgmjr0eyOFirZEgnAdtrcd9RcCvM3uHVm4Nusj0IredYuJkdTOD7wvM0VOjRXv5tmYSuFhLc3VJGG7B8CZvDzVwscTJDLSjmLrFM2UNszdpy24CZshLj0NZ6qJQv3SjpBjD3ag3YbbnIwaF6hLSQjabvCrqbvO2ionCkm47Pz04/jQDJs28w0T3ZbKZpG1uRSLPkqvjJS0Jn1hGnUjMtL1J+V/2hp1PWmI1GW8ua9jw1cJkyB+fWe+JVZN7E0+qLRoK4xjbqczfQKbUiffvuEa1p3yUoyV1L1A8mvaGTpGo2h7I0TjGQP6rzaM7/9uVidm9O1RWHaoRqhvc9pRKfh7QOj93KP42ceR46Si+F4HVaZuudjSNwloR6HDCseFBfWKjNLkpwJwjI6P7WOBdpEqCppS5OSXyZcMFzH1RWxddPdO+r/QXkPQf8aY3fUaCqq38/e/xwe16PH7es0sPB3jbr5LORd+IlH2z/TmxFD

Steps to reproduce

1. Open the reproduction link.
2. Try to click "+" to add new items.

What is expected?

Items should be re-rendered when we update items array.

What is actually happening?

Items are not re-rendered when we update items array.

System Info

No response

Any additional comments?

Worked fine with Vue 3.5.9. Doesn't work fine anymore with Vue 3.5.10

Happens when we reference v$.itemsLength.$errors in the template and set $autoDirty to true.

The issue is not happening in each of these cases:

• when I remove v$.itemsLength.$errors from template;
• when I don't set $autoDirty to true;
• when I switch from Vue 3.5.10 to 3.5.9.

Looks like recent Vue release broke something under the hood.

[jh-leong]

Closing as a duplicate of #12072 as the root cause is the same.

[skirtles-code]

For reference, I believe it's the usage of flush: 'sync' here that triggers the bug in #12072:

• https://unpkg.com/browse/@vuelidate/[email protected]/dist/index.mjs#L520

[hivokas]

@jh-leong thank you, I subscribed to the issue you mentioned to keep updated.

[hivokas]

@skirtles-code does it have to be fixed on the Vue side or Vuelidate side?

[lukaszarpak]

@hivokas I also experience the same issue. Watchers behave in an unexpected manner. The problem seems to be on Vue's side since Vuelidate hasn't been updated for a while and things started to break since the release of Vue 3.5.10

[hivokas]

@lukaszarpak yes, hopefully it'll get fixed soon. We've downgraded to Vue 3.5.9 for now.

[lukaszarpak]

@hivokas downgrade to 3.5.9 unfortunately didn't resolve the issue in our case

[skirtles-code]

3.5.11 has been released and the reproduction provided here seems to be working correctly with that version. If you're still seeing problems with 3.5.11 then you may need to open a new issue.

[hivokas]

awesome, thanks! indeed seems to be fixed!