fix(useRafFn): resolve reactive null fpsLimit not being handled (#5284)

nemanjamalesija · web-flow · commit 8ce0dae1a648 · 2026-02-06T14:57:29.000Z
diff --git a/packages/core/useRafFn/index.test.ts b/packages/core/useRafFn/index.test.ts
@@ -70,6 +70,15 @@ describe('useRafFn', () => {
     expect(fn1.mock.calls.length).toBeLessThan(fn2.mock.calls.length)
   })
 
+  it('should handle a reactive null fpsLimit as no limit', async () => {
+    const fn = vi.fn()
+    const limit = shallowRef<number | null>(null)
+    useRafFn(fn, { fpsLimit: limit })
+    await vi.waitFor(() => {
+      expect(fn).toHaveBeenCalled()
+    })
+  })
+
   it('should handle a framerate change', { retry: 3 }, async () => {
     const initialFramerate = 60
     const fr = shallowRef(initialFramerate)
diff --git a/packages/core/useRafFn/index.ts b/packages/core/useRafFn/index.ts
@@ -26,11 +26,11 @@ export interface UseRafFnOptions extends ConfigurableWindow {
   immediate?: boolean
   /**
    * The maximum frame per second to execute the function.
-   * Set to `undefined` to disable the limit.
+   * Set to `null` to disable the limit.
    *
-   * @default undefined
+   * @default null
    */
-  fpsLimit?: MaybeRefOrGetter<number>
+  fpsLimit?: MaybeRefOrGetter<number | null>
   /**
    * After the requestAnimationFrame loop executed once, it will be automatically stopped.
    *
@@ -49,14 +49,15 @@ export interface UseRafFnOptions extends ConfigurableWindow {
 export function useRafFn(fn: (args: UseRafFnCallbackArguments) => void, options: UseRafFnOptions = {}): Pausable {
   const {
     immediate = true,
-    fpsLimit = undefined,
+    fpsLimit = null,
     window = defaultWindow,
     once = false,
   } = options
 
   const isActive = shallowRef(false)
   const intervalLimit = computed(() => {
-    return fpsLimit ? 1000 / toValue(fpsLimit) : null
+    const limit = toValue(fpsLimit)
+    return limit ? 1000 / limit : null
   })
   let previousFrameTimestamp = 0
   let rafId: null | number = null
