Subscribe on changes!

The result of ShallowReadonly() on a reactive object can't be spreaded on some iOS device

avatar
May 22nd 2022

Vue version

3.2.34

Link to minimal reproduction

https://codesandbox.io/s/vuejs-ios-props-shallowreadonly-issue-lkksug?file=/src/App.vue

Steps to reproduce

import { reactive, shallowReadonly } from 'vue';

const foo = reactive({
    a: 1,
});

const spreadedFoo = {
    ...foo,
};

const spreadedBar = { ...shallowReadonly(foo) };
// results are not same on some iOS device (eg. iOS 12.5 / iOS 11.3)
console.log(spreadedFoo, spreadedBar);

What is expected?

These results are same.

What is actually happening?

results are not same on iOS device below iOS 12.5 Unexpected results: iOS 12.5 / iOS 11.3 image

expected results: Chrome 100 image iOS 15.3 image

System Info

This issues can be reproduced on iOS 12.5 / iOS 11.3.
iOS 15.3 / Chrome 100 is expected result.

Any additional comments?

No.

avatar
May 23rd 2022

@yyx990803 What can I help? Can you give me some hints to solve this problem? It seems not safe to do some UA detection, but I only get this solution in my head now.