Readonly Ref cannot be triggered by triggerRef

[serkodev]

Vue version

v3.5.13

Link to minimal reproduction

https://play.vuejs.org/#eNp9kstO60AMhl/Fmg2tiFKhc1ZVqXQOAgkkLgKWs4kSJw0kdjSXUhRlzYPxYngmJLBA7Ma/f4+/8bhX/7ou3XtUa7Wxuak7Bxad77aa6rZj46AHpmv25LBIwJm6qtDcY5mAwaxgal4TsLusafhFVBigNNzCkVx5pElT6Sl3NRN4ixfMiyX0mgByJuugZIbTb9WLHmgNJzAsQynAXJwVxVQpKnO6zxqPKR0fB2kY3Ua4DQmvGNYz3UKiZRJuCL5oHZtH32dCKCa+YJgfvJCup9uxcWQIh68ZxLthtYI8I2I3Zebeciilp1RtVuNwZawSOGy7JnMoEcBmd7LtIwwMw2YlUbDPlvc3TSpRzgp1WVfpk2WSz4pIWuXcdnWD5rYLc7JaracpaRWnehU1Zzwmk57vMH/+QX+yh6BpdWfQotmjVnPOZaZCN6bPH27wIOc52XLhG3H/krxHy40PjKPtv6dCsL/5Iu1lXLmaqkd7fnBIdnpUAI1fHf1ayXqd/fL0L9w/6d/PFRnU8AEddfwK

Steps to reproduce

1. Create a shallowRef and create a variable to wrap the shallow ref with readonly
2. Update the original shallowRef nested value
3. Call triggerRef for the readonly value

function useFoo() {
  const foo = shallowRef({ n: 1 })

  function add() {
    foo.value.n++
  }

  return { foo: readonly(foo), add }
}

const { foo, add } = useFoo()

onMounted(() => {
  add()
  triggerRef(foo) // cannot trigger the readonly ref
})

What is expected?

The readonly ref should be triggered by triggerRef.

What is actually happening?

It cannot be trigger and output the following warning message.

[Vue warn] Set operation on key "version" failed: target is readonly. 
[Vue warn] Set operation on key "flags" failed: target is readonly. 
[Vue warn] Set operation on key "next" failed: target is readonly. 
[Vue warn] Set operation on key "next" failed: target is readonly. 
[Vue warn] Set operation on key "flags" failed: target is readonly. 

System Info

System:
  OS: macOS 15
  CPU: arm64 Apple
Binaries:
  Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node
  npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm
  pnpm: 9.15.4 - ~/.nvm/versions/node/v20.11.1/bin/pnpm
Browsers:
  Chrome: 132
  Safari: 18

Any additional comments?

I’m wondering: even though a readonly value can’t be modified directly, shouldn’t it still be possible to trigger updates?