Watch is executed twice even though it's paused

[DamianGlowala]

Vue version

latest

Link to minimal reproduction

https://play.vuejs.org/#eNp9VE1z2jAQ/SsaXTATxjBtTxSYpmkO7aHNNJnpRRcjFqLEljzSCugw/u9dSTbYNJMTaN/bt98+8du6zvce+JwvnLSqRuYAfb0SWlW1schO7FCgfGYN21pTsRGRR597qIXtABNaaGm0IyG/rhTeGa+RLQMvm40v6NbYqjWfhGYsWEGjm7P4ZAyqQpVzhtZDMDRCNz137+DW/dXyW4EFyWRjtlwlzzY4FuhdG2CkNiWMoneHwxGkRxi6stYt3xelD9ioBr1ReherCril5ljNNBzYA5WsHGQWnCn3xF6F1j2pCozHbKAa/CIpGxVrGRJJ1utozksJzlG0Fr90MJFubhLUTNiH2Ww2jkrUmfDTpjYoZNK2MhXbtfF6RBS6387sakp/wvzBEituQhZkgj2KpzqTTt7GycYRajPZANSDMUb5i9RAYdiRZa8nvWitcC+3vC6ogpR4ByWRvNurPO4TFbEtSkep/K9BM/JVFOnSXEzTTdA10AOhqssCgV6MLdYe0Wj2RZZKvi4Fv26B4KvHaFpMEzWKkGO4rRA6oQgbdjoNbqVpGNIWucieBvpi2ovNJxwdVbVVu/zFGU2nGxsiuDRVrUqwv2pUVLXg51sSvChLc/gRbWEU7WKQzzPI1zfsL+4YbII/UFvA7kHwM4aF3QEm+P7xJxzp/xmszMaXxH4H/B2OwYccE+2r13SftseL2X6Pnxi6vid3f0TQrivqvEuRLzh9du7eKf2S7sf8U3cDvPkH4QCoUg==

Steps to reproduce

Click on the button, observe how form watcher triggers the execute() method twice even though it is paused, form update takes place, and only then the watcher is resumed. Is this the expected behaviour?

What is expected?

Form watcher triggered once.

What is actually happening?

Form watcher triggered twice.

System Info

Any additional comments?

No response

[jh-leong]

This behavior is expected.

If the dependencies change while the watcher is paused, it will trigger a re-run once resumed.

[DamianGlowala]

Ah, I couldn't find such information in the docs, that explains it well! Thank you. Wish this was somehow configurable. Had a look at https://vueuse.org/shared/watchPausable/#watchpausable and fortunately this one isn't re-run once resumed.

[hcg1023]

@jh-leong

Can you explain the reason for this design? Why is it different from vueuse's watchPausable? I think intuitively, watch resume should not be re-triggered. Watch should be a passive triggering mechanism.
I can understand that effect is re-executed in resume because it needs to continue to execute the latest content.
But watch is different from effect, even if the underlying implementation uses effect

[jh-leong]

@hcg1023 The difference from watchPausable is mainly due to dependency tracking. When resuming, the watcher needs to re-run to ensure it tracks the latest dependencies correctly. Otherwise, it may still be bound to outdated values, leading to unexpected behavior.

Here's a related discussion from Vue Discord that might help:
Vue Discord Discussion