Skip to content

[Bug]: getBoundingClientRect fallback missing typeof guard in useBoundingClientRect #2625

@magrinj

Description

@magrinj

Version

v5

Reanimated Version

v3

Gesture Handler Version

v2

Platforms

Web

What happened?

PR #2561 (shipped in v5.2.7) fixed the unstable_getBoundingClientRect check in useBoundingClientRect by adding a typeof === 'function' guard, but the same fix was not applied to the getBoundingClientRect fallback on line 71.

The first check is correct:

if (
  ref.current.unstable_getBoundingClientRect !== null &&
  typeof ref.current.unstable_getBoundingClientRect === 'function'  // ✅
)

The fallback is missing the guard:

if (ref.current.getBoundingClientRect !== null) {  // ❌ undefined !== null is true
  const layout = ref.current.getBoundingClientRect();  // crashes

React Native's jest preset (react-native/jest/setup.js) sets global.nativeFabricUIManager = {}, so isFabricInstalled() returns true in tests. Since react-test-renderer refs don't have getBoundingClientRect, the property is undefined, which passes the !== null check and crashes during test teardown.

This affects any project running jest tests that render a component using BottomSheetModal on RN >= 0.81 with @gorhom/bottom-sheet >= 5.2.7.

Related: #2549, #2560, #2561

How to fix it

-    if (ref.current.getBoundingClientRect !== null) {
+    if (ref.current.getBoundingClientRect !== null && typeof ref.current.getBoundingClientRect === 'function') {

Repository to test the crash

https://github.com/magrinj/bottom-sheet-test-bug/tree/main

Sorry for the spam, I've been blocked multiple times by the bot, don't really know why.

Reproduction steps

  • Create a React Native 0.81+ project with @gorhom/bottom-sheet@5.2.8
  • Write a jest test that renders a component containing a BottomSheetModal
  • Run the test
  • Tests pass but the process crashes during teardown with TypeError: ref.current.getBoundingClientRect is not a function

Reproduction sample

https://snack.expo.dev/@jeremy.magrin.epsor/bottom-sheet---issue-reproduction-template

Relevant log output

TypeError: ref.current.getBoundingClientRect is not a function

at node_modules/@gorhom/bottom-sheet/src/hooks/useBoundingClientRect.ts:73:34
at commitHookEffectListMount (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:8376:29)
at commitPassiveMountOnFiber (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:9782:13)

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions