fix(core/bind): avoid triggering SUSPENSE when the stream emits synchronously

Author: josepot

packages/core/src/bind/connectObservable.test.tsx

@@ -5,7 +5,7 @@ import {
   screen,
 } from "@testing-library/react"
 import { act, renderHook } from "@testing-library/react-hooks"
-import React, { Suspense, useEffect, FC } from "react"
+import React, { Suspense, useEffect, FC, StrictMode } from "react"
 import {
   BehaviorSubject,
   defer,
@@ -15,6 +15,7 @@ import {
   throwError,
   Observable,
   merge,
+  NEVER,
 } from "rxjs"
 import {
   delay,
@@ -491,4 +492,20 @@ describe("connectObservable", () => {
 
     expect(errorCallback).not.toHaveBeenCalled()
   })
+
+  it("should not trigger suspense when the stream emits synchronously", () => {
+    const [useValue] = bind(NEVER.pipe(startWith("Hello")))
+
+    const Component: FC = () => <>{useValue()}</>
+    render(
+      <StrictMode>
+        <Suspense fallback={<div>Loading...</div>}>
+          <Component />
+        </Suspense>
+      </StrictMode>,
+    )
+
+    expect(screen.queryByText("Loading...")).toBeNull()
+    expect(screen.queryByText("Hello")).not.toBeNull()
+  })
 })

packages/core/src/internal/react-enhancer.ts

@@ -49,7 +49,10 @@ const reactEnhancer = <T>(source$: BehaviorObservable<T>): (() => T) => {
       promise = undefined
     })
 
-    if (value !== EMPTY_VALUE) return value
+    if (value !== EMPTY_VALUE) {
+      promise = undefined
+      return value
+    }
 
     throw error !== EMPTY_VALUE ? error : promise
   }