Skip to content

Symbol.toStringTag stops reactive() and ref() from being reactive. #10483

Open
@WORMSS

Description

@WORMSS

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.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions