react-navigation non-serializable state recursive call to dropUndefinedKeys

[Krisztiaan]

Environment

sentry.io
"@sentry/react-native": "^2.4.0"
react-navigation

Steps to Reproduce

1. Pass a circular object as a param to a navigation call

Expected Result

Navigation successful, something's logged in Sentry

Actual Result

RangeError, call stack size exceeded in dropUndefinedKeys

[github-actions]

This issue has gone three weeks without activity. In another week, I will close it.

But! If you comment or otherwise update it, I will reset the clock, and if you label it Status: Backlog or Status: In Progress, I will leave it alone ... forever!

---

"A weed is but an unloved flower." ― Ella Wheeler Wilcox 🥀

[lachenmayer]

Can confirm this is still an issue.

[Krisztiaan]

Still an issue, Mr. Bot Sir!

[marandaneto]

thanks for reporting, can one of you share a code snippet that causes the issue? thanks

[Krisztiaan]

Use react-navigation

  const paramsToPass = {
    something: 'foo',
    self: undefined,
  };
  paramsToPass.self = paramsToPass
  navigate('somewhere', paramsToPass)

[marandaneto]

I can confirm:

WARN Non-serializable values were found in the navigation state. Check:

ManualTracker > params.self (Circular reference)

This can break usage such as persisting and restoring state. This might happen if you passed non-serializable values such as function, class instances etc. in params. If you need to use components with callbacks in your options, you can use 'navigation.setOptions' instead. See https://reactnavigation.org/docs/troubleshooting#i-get-the-warning-non-serializable-values-were-found-in-the-navigation-state for more details.
at BaseNavigationContainer (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=io.sentry.sample:108134:28)
at ThemeProvider (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=io.sentry.sample:112128:21)
at NavigationContainer (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=io.sentry.sample:112034:26)
at Provider (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=io.sentry.sample:104925:21)
at App (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=io.sentry.sample:104751:34)
at ReactNativeProfiler (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=io.sentry.sample:132017:36)
at RCTView
at View
at __Sentry.TouchEventBoundary (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=io.sentry.sample:143539:36)
at RootApp
at RCTView
at View
at RCTView
at View
at AppContainer (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=false&modulesOnly=false&runModule=true&app=io.sentry.sample:68798:36)

also:

WARN 0 [RangeError: Maximum call stack size exceeded (native stack depth)]

[marandaneto]

@jennmueng can you take a look at this, thanks.

[marandaneto]

For Sentry JS SDK 7.x getsentry/sentry-docs#4844

[marandaneto]

@Krisztiaan can you still reproduce this issue using the latest version of the RN SDK? I don't see the RangeError anymore.

[marandaneto]

Closed in favor of getsentry/sentry-javascript#4777