Can't see https requests in navigation events with ReactNavigation plugin

[bsumer-wyn]

OS:

• [ ] Windows
• [X] MacOS
• [ ] Linux

Platform:

• [X] iOS
• [X] Android

SDK:

• [X] @sentry/react-native (>= 1.0.0)
• [ ] react-native-sentry (<= 0.43.2)

SDK version: ^5.19.0

react-native version: 0.68.5

Are you using Expo?

• [ ] Yes
• [X] No

Are you using sentry.io or on-premise?

• [ ] sentry.io (SaaS)
• [X] on-premise

Configuration:

(@sentry/react-native)

const regex = /^https:\/\//;

  Sentry.init({
    dsn: env.SENTRY,
    dist: env.BANNER,
    release: env.appVersion,
    // TODO: will be reverted to !__DEV__
    enabled: true,
    // TODO: set to 100% for testing purposes, will be lowered to 10% in production
    tracesSampleRate: 1.0,
    // TODO: decide on session duration, default is 10 sec
    sessionTrackingIntervalMillis: 1000 * 10,
    sendDefaultPii: true,
    enableAutoSessionTracking: true,
    tracePropagationTargets: [
      regex,
      'http',
      'https',
    ],
    integrations: [
      new Sentry.ReactNativeTracing({
        idleTimeout: 5000,
        routingInstrumentation,
        enableNativeFramesTracking: true,
        enableUserInteractionTracing: true,
        shouldCreateSpanForRequest: (url: string) => {
          console.log('SPAN REQUEST URL:', url);
          return true;
        },
      }),
    ],
  });

---

I have the following issue: So we Sentry in our production app and we have some performance, memory leak issues that we want to track down using Performance tools, for that we use React Navigation tool to have some automated performance functionality logged on Sentry dashboard.

So I get the navigation events on Sentry dashboard but I expect to see the http/https request done and tied to the navigation event as well, but I don't see any request done by using axios nor fetch. I have checked the header values for sentry-trace and baggage, and they are in the header passed to the requests successfully, but no requests being seen in the dashboard, only navigation events and component lifecycles, mounts, renders, re-renders etc.

I know this was probably an older version on SDK, but I have followed this video guy from you guys to see if I was missing anything. Sentry Video Guide Link

Thanks in advance.

Steps to reproduce: Implements the Sentry.ReactNativeTracing, navigate to a screen that has api requests being called. See the navigation events, and requests on Sentry dashboard.

Actual result: Navigation and react lifecycle events are being displayed in the Sentry but no request events.

Expected result: I should be seeing the request events on Sentry

[krystofwoldrich]

Hi @bsumer-wyn, thank you for the message, your Sentry.init is correct.

I see you are logging the URLs for which spans will be created using console.log('SPAN REQUEST URL:', url);, do you see this log printed in the JS logs?

Can you try to enable debug:true? This should provide more details about the created spans, look for lines starting with Starting 'http.client' span on transaction.

[krystofwoldrich]

Closing this due to inactivity. If this is still an issue feel free to comment here or open a new issue if the context changed.