fix(types/computed): ensure type safety for WritableComputedRef (#11608)

Author: jh-leong

packages-private/dts-test/ref.test-d.ts

@@ -209,6 +209,14 @@ describe('allow computed getter and setter types to be unrelated', () => {
   expectType<string>(c.value)
 })
 
+describe('Type safety for `WritableComputedRef` and `ComputedRef`', () => {
+  // @ts-expect-error
+  const writableComputed: WritableComputedRef<string> = computed(() => '')
+  // should allow
+  const immutableComputed: ComputedRef<string> = writableComputed
+  expectType<ComputedRef<string>>(immutableComputed)
+})
+
 // shallowRef
 type Status = 'initial' | 'ready' | 'invalidating'
 const shallowStatus = shallowRef<Status>('initial')

packages/reactivity/src/computed.ts

@@ -14,19 +14,24 @@ import { Dep, globalVersion } from './dep'
 import { ReactiveFlags, TrackOpTypes } from './constants'
 
 declare const ComputedRefSymbol: unique symbol
+declare const WritableComputedRefSymbol: unique symbol
 
-export interface ComputedRef<T = any> extends WritableComputedRef<T> {
-  readonly value: T
+interface BaseComputedRef<T, S = T> extends Ref<T, S> {
   [ComputedRefSymbol]: true
-}
-
-export interface WritableComputedRef<T, S = T> extends Ref<T, S> {
   /**
    * @deprecated computed no longer uses effect
    */
   effect: ComputedRefImpl
 }
 
+export interface ComputedRef<T = any> extends BaseComputedRef<T> {
+  readonly value: T
+}
+
+export interface WritableComputedRef<T, S = T> extends BaseComputedRef<T, S> {
+  [WritableComputedRefSymbol]: true
+}
+
 export type ComputedGetter<T> = (oldValue?: T) => T
 export type ComputedSetter<T> = (newValue: T) => void
 

packages/runtime-core/src/apiComputed.ts

@@ -13,5 +13,5 @@ export const computed: typeof _computed = (
       ;(c as unknown as ComputedRefImpl<any>)._warnRecursive = true
     }
   }
-  return c
+  return c as any
 }