fix(computedAsync): return ComputedRef<T> type when lazy: true (#4751)

ferferga · web-flow · commit b1718930349d · 2025-05-14T04:31:01.000Z
diff --git a/packages/core/computedAsync/index.test.ts b/packages/core/computedAsync/index.test.ts
@@ -1,4 +1,4 @@
-import type { Ref } from 'vue'
+import type { ComputedRef, Ref } from 'vue'
 import { describe, expect, expectTypeOf, it, vi } from 'vitest'
 import { computed, nextTick, shallowRef } from 'vue'
 import { asyncComputed, computedAsync } from './index'
@@ -45,6 +45,16 @@ describe('computedAsync', () => {
     expectTypeOf(data2).toEqualTypeOf<Ref<string>>()
   })
 
+  it('types are correct when lazy', async () => {
+    const func = vi.fn(() => Promise.resolve('data'))
+
+    const data1 = computedAsync(func, undefined, { lazy: true })
+    const data2 = computedAsync(func, 'initialState', { lazy: true })
+
+    expectTypeOf(data1).toEqualTypeOf<ComputedRef<string | undefined>>()
+    expectTypeOf(data2).toEqualTypeOf<ComputedRef<string>>()
+  })
+
   it('call onError when error is thrown', async () => {
     const errorMessage = shallowRef()
     const func = vi.fn(async () => {
diff --git a/packages/core/computedAsync/index.ts b/packages/core/computedAsync/index.ts
@@ -1,5 +1,5 @@
 import type { Fn } from '@vueuse/shared'
-import type { Ref } from 'vue'
+import type { ComputedRef, Ref } from 'vue'
 import { noop } from '@vueuse/shared'
 import {
   computed,
@@ -63,18 +63,28 @@ export interface AsyncComputedOptions {
 export function computedAsync<T>(
   evaluationCallback: (onCancel: AsyncComputedOnCancel) => T | Promise<T>,
   initialState: T,
-  optionsOrRef?: Ref<boolean> | AsyncComputedOptions,
+  optionsOrRef: AsyncComputedOptions & { lazy: true },
+): ComputedRef<T>
+export function computedAsync<T>(
+  evaluationCallback: (onCancel: AsyncComputedOnCancel) => T | Promise<T>,
+  initialState: undefined,
+  optionsOrRef: AsyncComputedOptions & { lazy: true },
+): ComputedRef<T | undefined>
+export function computedAsync<T>(
+  evaluationCallback: (onCancel: AsyncComputedOnCancel) => T | Promise<T>,
+  initialState: T,
+  optionsOrRef?: Ref<boolean> | (AsyncComputedOptions & { lazy?: false | undefined }),
 ): Ref<T>
 export function computedAsync<T>(
   evaluationCallback: (onCancel: AsyncComputedOnCancel) => T | Promise<T>,
   initialState?: undefined,
-  optionsOrRef?: Ref<boolean> | AsyncComputedOptions,
+  optionsOrRef?: Ref<boolean> | (AsyncComputedOptions & { lazy?: false | undefined }),
 ): Ref<T | undefined>
 export function computedAsync<T>(
   evaluationCallback: (onCancel: AsyncComputedOnCancel) => T | Promise<T>,
   initialState?: T,
   optionsOrRef?: Ref<boolean> | AsyncComputedOptions,
-): Ref<T> | Ref<T | undefined> {
+): Ref<T> | Ref<T | undefined> | ComputedRef<T> | ComputedRef<T | undefined> {
   let options: AsyncComputedOptions
 
   if (isRef(optionsOrRef)) {
