`Maximum recursive updates exceeded`: when accessing a responsive variable in `onScopeDispose`

[danranVm]

Vue version

3.2.37

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-t5bbox?file=src/HelloWorld.vue

Steps to reproduce

• open the browser's console
• update any code in HelloWorld.vue, for example: console.log('watch', element) => console.log('test', element)
• observe the console logs

What is expected?

this component will be rendered only once

What is actually happening?

[Vue warn]: Maximum recursive updates exceeded in component <App>. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.

System Info

No response

Any additional comments?

I also ran some other tests, such as commenting out line 11 of HelloWorld.vue or using onUnmounted instead of onScopeDispose, did not produce this warning.

[zhangzhonghe]

Duplicate of #6930