fix(react-navigation): ensure navigation container is ready before configuring navigation tracker (#755)

Author: yousif-bugsnag

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [Unreleased]
+
+### Fixed
+
+- (plugin-react-navigation) Ensure navigation container is ready before initializing tracking [#755](https://github.com/bugsnag/bugsnag-js-performance/pull/755)
+
 ## [v3.3.0] (2025-11-24)
 
 ### Changed

packages/plugin-react-navigation/lib/create-navigation-container.tsx

@@ -1,4 +1,4 @@
-import type { NavigationContainerProps, NavigationContainerRefWithCurrent } from '@react-navigation/native'
+import type { NavigationContainerRefWithCurrent } from '@react-navigation/native'
 import { useNavigationContainerRef, NavigationContainer } from '@react-navigation/native'
 import React from 'react'
 import type { NavigationTracker } from './navigation-tracker'
@@ -7,16 +7,22 @@ type CreateNavigationContainer = (NavigationContainerComponent: typeof Navigatio
 type NavigationContainerRef = NavigationContainerRefWithCurrent<ReactNavigation.RootParamList>
 
 export const createNavigationContainer: CreateNavigationContainer = (NavigationContainerComponent = NavigationContainer, navigationTracker: NavigationTracker) => {
-  return React.forwardRef<NavigationContainerRef, NavigationContainerProps>((props, _ref) => {
-    const navigationContainerRef = _ref as NavigationContainerRef || useNavigationContainerRef()
+  return React.forwardRef<NavigationContainerRef, React.ComponentPropsWithoutRef<typeof NavigationContainer>>((props, ref) => {
+    const navigationContainerRef = ref as NavigationContainerRef || useNavigationContainerRef()
 
-    navigationTracker.configure(navigationContainerRef)
+    const wrappedOnReady = () => {
+      navigationTracker.configure(navigationContainerRef)
+      if (typeof props.onReady === 'function') {
+        props.onReady()
+      }
+    }
 
     return (
-        <NavigationContainerComponent
-          {...props}
-          ref={navigationContainerRef}
-        />
+      <NavigationContainerComponent
+        {...props}
+        ref={navigationContainerRef}
+        onReady={wrappedOnReady}
+      />
     )
   }) as typeof NavigationContainerComponent
 }

test/react-native/features/fixtures/scenario-launcher/scenarios/core/ReactNavigationScenario.js

@@ -35,7 +35,9 @@ export function App() {
 function Screen1({ navigation }) {
     useEffect(() => {
         parentSpan = BugsnagPerformance.startSpan('ParentSpan')
-        navigation.navigate('Screen2')
+        setTimeout(() => {
+            navigation.navigate('Screen2')
+        }, 250)
     }, [])
 
     return (