Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Change in ToRefs between 3.0.2 and 3.0.3 is a breaking change #2687

Closed
brlodi opened this issue Nov 29, 2020 · 2 comments
Closed

Change in ToRefs between 3.0.2 and 3.0.3 is a breaking change #2687

brlodi opened this issue Nov 29, 2020 · 2 comments

Comments

@brlodi
Copy link

brlodi commented Nov 29, 2020

Version

3.0.3

Reproduction link

https://github.com/brlodi/vue3.0.3-ToRefs-repro

Steps to reproduce

  1. Run yarn/npm install and yarn/npm serve on main branch
  2. Observe project builds successfully and dev server finds no issues
  3. Switch to 3.0.3 branch and repeat yarn/npm commands
  4. Observe multiple Typescript type errors, caused by ToRefs<T> members having different types in 3.0.3.
    • e.g. if type Foo = { bar: string | number }
      • under 3.0.2: the shape of ToRefs<Foo> is { bar: Ref<string | number> }
      • in 3.0.3: the shape of ToRefs<Foo> is { bar: Ref<string> | Ref<number> }, which cannot accept assignment of a Ref<string | number>

What is expected?

Typescript code using the Composition API which works in Vue 3.0.2 should work in all future patch versions of Vue 3.0.x

What is actually happening?

Changes to Vue's reactivity types in 3.0.3 break code that worked in 3.0.2.


This is obviously an extremely contrived and overly manually-typed example. In practice this came up with a composition function that returns a toRef-ed version of a reactive object for concise destructuring, as well as a component cycling its own state like the App component in the repro does.

Note this isn't value judgement of the new typings, just that changing them introduced an unexpected breaking change in a patch release.

@edison1105
Copy link
Member

8e20375
breaking change in this commit.

@realityfilter
Copy link

This is still a problem in 3.0.4 with classes with private fields.
Version 3.0.2 is working. Vue 2 with composition api, too.

Short Example:

class X {
    a: string;
    private b: string;
}
import { defineComponent, PropType, toRefs } from 'vue';
export default defineComponent({
    name: 'TestX',
    props: {
        x: Object as PropType<X>,
    },
    setup(props) {
        const compose = (x: X) => console.log(x);
        const { x } = toRefs(props);
        compose(x.value);
    },
});

compose(x.value) is triggering typescript error:

"Argument of type '{ a: string; }' is not assignable to parameter of type 'X'. Property 'b' is missing in type '{ a: string; }' but required in type 'X'."

@github-actions github-actions bot locked and limited conversation to collaborators Oct 26, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants