core icon indicating copy to clipboard operation
core copied to clipboard

`Symbol.toStringTag` stops `reactive()` and `ref()` from being reactive.

Open WORMSS opened this issue 1 year ago • 2 comments

Vue version

3.4.21

Link to minimal reproduction

https://play.vuejs.org/#eNqVVE1v2zAM/SuEMcAJYDhYt1PqGNuCwlgPTdHsNg+ro8iuU1ky9JElMPzfR0lxkm1Btp1sko981COlLvjYtvHW0GAaJIrIutWgqDYtsIJXszzQKg/SnNdNK6SGDohoWqPpOoJaPUqx20cgaUF0vaX2r4QeSikaCLFmmPOcE8GVhma/WG3mMIMu5wBfl/tmJVisxVLLmldfiurbFCDMRKHDKOf97ZBHMGWonzxRIuQ6US4nAv9N05EvPj4mOTv7f7LKkZXXeTLLM2QIo1ENTBtkGY3GMEvh+SDOiIxv4U13snqU8mBUv4SqeFswQy3g2TOUhuOxBQfB56wmr3Ms7Q5EYk2Rewah/YYIxqTf0dmAPhS+lJNM/MRxvmho2rSs0BQtgOTlJh10H42TCZrOvTJaI8kHYjlwPYbecEmcC+bJxGM8vpU0JVPoOrhfLh5iL2VdohQRcMNYBDdj6PtkYoGeWJ41UP4Dd3bkzv7kri5x40z/yj3M5YzfwrDYYeanxGRyJl0Q4ZXB5SjrKt4owfFeuTHkgV2RmlG5aO2c8FphazZiYwVj4se982lpKG6l95MXSl4v+DdqZ3158CiponJL8+AY04WsqPbhu+UD3eH/MdiItWGIvhJ8okowY3v0sE+Gr7HtM5zr9rN7Eex9Unc7TbkaDmUbtcje4fMAH4L5laOf2n0Xv3d5uJuo4vctlbYmCoiB+OZt0P8EqqmROA==

Steps to reproduce

Press the two buttons (C and G), observe nothing happens.. Observe that after being ran in reactive() or ref() the object has not become a proxy.

What is expected?

That the two objects have test property added and set to the value 'test' and that the UI shows the new state

What is actually happening?

The objects ARE IN FACT getting the properties added to them, but the UI doesn't trigger an update.

System Info

No response

Any additional comments?

A more complete Test Playground with other tests performed. You will notice that C and G are identical to the cut down version of the test, but you are able to see that C and G do infact get the values updated to the screen if A,B,D,E,F, or H are pressed afterwards, due to THEIR reactivity kicking off the UI re-render.. But, even this little bit of hope will cease to exist when Vapor Mode starts to get used in the future.

You will notice that all others have isProxy set to true.

The only difference between A and C is Symbol.toStringTag has a value. this seems to boil down to the way getTargetType(), targetTypeMap(), toRawType() work internally.

WORMSS avatar Mar 08 '24 21:03 WORMSS