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

Return type of storeToRefs doesn't match runtime result if values are nested computed values #2658

Closed
henryliu-git opened this issue Apr 27, 2024 · 1 comment · Fixed by #2659
Labels
contribution welcome typescript This issue is related to typings

Comments

@henryliu-git
Copy link

Reproduction

https://play.pinia.vuejs.org/#eNqdVd1O2zAUfhUrN2ml1hliYhK0CJi42C7YBFzmJiSnqVliW7ZTilAvd7dH2F5uT7Jju3FSyApC6o9z/r7Pn31OnqJzKemqgeg4mulcMWmIBtNIUmW8nKeR0Wl0mnJWS6EMeSIGtLkxQgHZkIUSNYlpEmy34hoWmhodn/RSdOcKSZJxltmoXHCNkK7ivKs+GqMv5UlC/v7+SXJRy8ZAcU7MowTCNCYoxkufLiqglShHsatCQ3A88XU7y07RLM9ZAdxkVfV4hbhQfN7GXQSY1oLcZx4StRjA3FOLrrKqgcDl1UjP0bG0avTVa9VSVsl53zNy61c0G9gMebYbW7mTK1AfMo9PMNmj/flFDB5JU5ZIWL9XWPKwZPnSOhmSUgpyQzJNzBKIarhhNf6DbiqUpEVy8IyTRYaxDD8W3DQWmGQ7GAN4p3Ro8285ybcF+tOYJb6r8N7gg4FaVpkBfJph24SHaBL5dpnWmaT3WnDsx6eUE5JuHdiGx8RZrM21j7WkUeLWFHQ9vVPiQYPC/DSatKFn2NxJASsjRKWnmWQ+bWmM1MdJkhcc4wuo2EpRDibhsk5e5Jwd0SN6kFTsLkGghPEC1rswmDEtoH5L9Tb07AM9+Eg/uaqrw23R2la1RTcp36AsRuMZLVj5TBR7GVkF6ps0DM9wRxw8EfHw1dmMaiBQzJeQ/xiw3+u1Z/0d7xeoFfS2ZTJVgvHuy5srWOM6OGtRNBVG73FeA96vxnL0YRcNL5B2L86x/eLOGG/lrb5cG+C63ZQl6tRw8U5me83+t/WO7iE97Kv4YkKjlGFAt50dpjOi4GxWvRlewIJx2B387QzHOPuFtYv1I6p7Tcz7uaM4OLCPRmMyP0XymGzp+8xubs3Dum3Zkc+Isxibaydr38zp6mzze+8DYsfswEwamhftRi2qwnek4h13y2NbdNLZ9rAKURu3k83Y/kabfxlDqWo=

Steps to reproduce the bug

It happens if you accidentally created a nested computed values and use storeToRefs.

export const testStore = defineStore('testStore', () => {
    const computedA = computed<string>(() => 'a');
    const accidentallyNestedComputedB = computed(() => computedA); // type is ComputedRef<ComputedRef<string>>

    return {
      computedA,
      accidentallyNestedComputedB,
    };
})

const store = testStore();

// ✅ computedA type is string
console.log('store.computedA', store.computedA);

// ✅ accidentallyNestedComputedB type is ComputedRef<string>
console.log('store.accidentallyNestedComputedB.value', store.accidentallyNestedComputedB.value);


// test storeToRefs
const refs = storeToRefs(store);

// ✅ computedA type is ComputedRef<string> 
console.log('refs.computedA.value', refs.computedA.value); 

// ❌ ts suggests accidentallyNestedComputedB type is ComputedRef<string> which is incorrect as the runtime result suggests 
// in fact it is actually a ComputedRef<ComputedRef<string>>.
console.log('refs.accidentallyNestedComputedB.value', refs.accidentallyNestedComputedB.value);

Expected behavior

type of store.accidentallyNestedComputedB.value is ComputedRef<ComputedRef>

Actual behavior

type of store.accidentallyNestedComputedB.value is ComputedRef which doesn't match runtime result.

Additional information

No response

@posva posva added contribution welcome typescript This issue is related to typings labels Apr 28, 2024 — with Volta.net
quiteeasy pushed a commit to quiteeasy/pinia that referenced this issue Apr 29, 2024
@quiteeasy
Copy link
Contributor

I added a PR to address this issue #2659

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
contribution welcome typescript This issue is related to typings
Projects
Archived in project
Development

Successfully merging a pull request may close this issue.

3 participants