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

vue apollo "computed" properties broken since vue 3.2.31 #6099

Open
twelve17 opened this issue Jun 11, 2022 · 0 comments
Open

vue apollo "computed" properties broken since vue 3.2.31 #6099

twelve17 opened this issue Jun 11, 2022 · 0 comments

Comments

@twelve17
Copy link

twelve17 commented Jun 11, 2022

Vue version

3.2.37

Link to minimal reproduction

https://codesandbox.io/s/apollo-vue-computed-reactivity-8co7ec

Steps to reproduce

(Adapted from: vuejs/apollo#1368.)

The app in the code sandox consists of a single view which runs one (mocked) query to fetch a message. The query returns a contrived Message type object, which just has an id and text.

The component runs this option API reactive query:

  apollo: {
    message: {
      query,
      variables: { id: 1 },
    },
  },

The component also has this computed property, which references the text property from the above query result:

  computed: {
   messageSubstr() {
     return this.message?.text?.substr(0, 2);
   },
 },

The value of both of these properties is rendered in the vue app. To reproduce the step, change vue dependence between 3.2.30 and 3.2.31 or later.

What is expected?

The messageSubstr property should render with a value of "He" (the substring of the original "Hello world" text value).

vue3 2 30

This works as expected when the dependency is set to 3.2.30.

What is actually happening?

The messageSubstr computed property function does not seem to be called when the query is complete, and so its value remains undefined (its initial value).

vue3 2 32

System Info

No response

Any additional comments?

The behavior can be worked around by manually updating the property (e.g. using manual: true and implementing the result callback).

Some history on this issue:

Vue 3.2.31 introduced a regression which broke vue-apollo (option API):

#5415

The regression got a fix (3.2.32, #5417) which seems to have fixed the original regression in part, but it appears that computed properties are still broken since 3.2.31.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant