fix: support non-native promises (#3068)

Author: dai-shi

src/react/useAtomValue.ts

@@ -169,8 +169,6 @@ export function useAtomValue<Value>(atom: Atom<Value>, options?: Options) {
   }, [store, atom, delay, promiseStatus])
 
   useDebugValue(value)
-  // The use of isPromiseLike is to be consistent with `use` type.
-  // `instanceof Promise` actually works fine in this case.
   if (isPromiseLike(value)) {
     const promise = createContinuablePromise(value, () => store.get(atom))
     if (promiseStatus) {

src/vanilla/utils/atomWithObservable.ts

@@ -1,6 +1,9 @@
 import { atom } from '../../vanilla.ts'
 import type { Atom, Getter, WritableAtom } from '../../vanilla.ts'
 
+const isPromiseLike = (x: unknown): x is PromiseLike<unknown> =>
+  typeof (x as any)?.then === 'function'
+
 type Timeout = ReturnType<typeof setTimeout>
 type AnyError = unknown
 
@@ -165,7 +168,7 @@ export function atomWithObservable<Data>(
     (get) => {
       const [resultAtom] = get(observableResultAtom)
       const result = get(resultAtom)
-      if (result instanceof Promise) {
+      if (isPromiseLike(result)) {
         return result.then(returnResultData)
       }
       return returnResultData(result)

src/vanilla/utils/atomWithStorage.ts

@@ -258,7 +258,7 @@ export function atomWithStorage<Value>(
         set(baseAtom, initialValue)
         return storage.removeItem(key)
       }
-      if (nextValue instanceof Promise) {
+      if (isPromiseLike(nextValue)) {
         return nextValue.then((resolvedValue) => {
           set(baseAtom, resolvedValue)
           return storage.setItem(key, resolvedValue)

src/vanilla/utils/loadable.ts

@@ -5,8 +5,8 @@ const cache1 = new WeakMap()
 const memo1 = <T>(create: () => T, dep1: object): T =>
   (cache1.has(dep1) ? cache1 : cache1.set(dep1, create())).get(dep1)
 
-const isPromise = <Value>(x: unknown): x is Promise<Awaited<Value>> =>
-  x instanceof Promise
+const isPromiseLike = <Value>(p: unknown): p is PromiseLike<Awaited<Value>> =>
+  typeof (p as any)?.then === 'function'
 
 export type Loadable<Value> =
   | { state: 'loading' }
@@ -18,7 +18,7 @@ const LOADING: Loadable<unknown> = { state: 'loading' }
 export function loadable<Value>(anAtom: Atom<Value>): Atom<Loadable<Value>> {
   return memo1(() => {
     const loadableCache = new WeakMap<
-      Promise<Awaited<Value>>,
+      PromiseLike<Awaited<Value>>,
       Loadable<Value>
     >()
     const refreshAtom = atom(0)
@@ -36,7 +36,7 @@ export function loadable<Value>(anAtom: Atom<Value>): Atom<Loadable<Value>> {
         } catch (error) {
           return { state: 'hasError', error } as Loadable<Value>
         }
-        if (!isPromise<Value>(value)) {
+        if (!isPromiseLike<Value>(value)) {
           return { state: 'hasData', data: value } as Loadable<Value>
         }
         const promise = value

src/vanilla/utils/unwrap.ts

@@ -9,7 +9,8 @@ const memo2 = <T>(create: () => T, dep1: object, dep2: object): T => {
   return getCached(create, cache2, dep2)
 }
 
-const isPromise = (x: unknown): x is Promise<unknown> => x instanceof Promise
+const isPromiseLike = (p: unknown): p is PromiseLike<unknown> =>
+  typeof (p as any)?.then === 'function'
 
 const defaultFallback = () => undefined
 
@@ -37,12 +38,15 @@ export function unwrap<Value, Args extends unknown[], Result, PendingValue>(
 ) {
   return memo2(
     () => {
-      type PromiseAndValue = { readonly p?: Promise<unknown> } & (
+      type PromiseAndValue = { readonly p?: PromiseLike<unknown> } & (
         | { readonly v: Awaited<Value> }
         | { readonly f: PendingValue; readonly v?: Awaited<Value> }
       )
-      const promiseErrorCache = new WeakMap<Promise<unknown>, unknown>()
-      const promiseResultCache = new WeakMap<Promise<unknown>, Awaited<Value>>()
+      const promiseErrorCache = new WeakMap<PromiseLike<unknown>, unknown>()
+      const promiseResultCache = new WeakMap<
+        PromiseLike<unknown>,
+        Awaited<Value>
+      >()
       const refreshAtom = atom(0)
 
       if (import.meta.env?.MODE !== 'production') {
@@ -56,7 +60,7 @@ export function unwrap<Value, Args extends unknown[], Result, PendingValue>(
           get(refreshAtom)
           const prev = get(promiseAndValueAtom) as PromiseAndValue | undefined
           const promise = get(anAtom)
-          if (!isPromise(promise)) {
+          if (!isPromiseLike(promise)) {
             return { v: promise as Awaited<Value> }
           }
           if (promise !== prev?.p) {