http.client always connected to root transaction, not under ChildSpan

[kudlav]

Is there an existing issue for this?

• [X] I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• [X] I have reviewed the documentation https://docs.sentry.io/
• [X] I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which package are you using?

@sentry/node

SDK Version

7.36.0

Framework Version

16.19.0

Link to Sentry event

https://sentry.io/maptiler/performance/tileserver:a065ccba6659425cbc28c4b93238659b

SDK Setup

Sentry.init({
  dsn: DSN,
  debug: true,
  attachStacktrace: true,
  tracesSampleRate: 1,
  integrations: [
    new RewriteFrames({ root: global.__rootdir__ }),
    new Sentry.Integrations.Http({ tracing: true }),
  ],
  ...
});

const transaction = Sentry.startTransaction({
    op: 'rootApp',
    name: 'fubar',
    metadata: { request: req, source: 'url'  },
  }, { request: req }
);

Sentry.configureScope((scope) => {
  scope.setSpan(transaction);
});

Steps to Reproduce

const workSpan = Sentry.getCurrentHub().getScope()?.getTransaction()?.startChild('work');

const fetchSpan = workSpan?.StartChild({ op: 'fetch' });
await dbHeavyOper();
fetchSpan?.finish();

const computeSpan = workSpan?.StartChild({ op: 'compute' });
await doSomething();
span?.finish();

workSpan?.finish();

similar to: https://github.com/getsentry/sentry-dotnet/issues/2023

Expected Result

Event Details:

• rootApp
  • work
  • fetch
    • htp.client
    • htp.client
    • htp.client
    • htp.client
    • ...
  • compute

Actual Result

Event Details:

• rootApp
  • work
  • fetch
  • compute
  • htp.client
  • htp.client
  • htp.client
  • htp.client
  • ...

[lforst]

Hi, you gotta set the span you want operations to be attached to on the scope. You can read up on it here: https://docs.sentry.io/platforms/javascript/performance/instrumentation/custom-instrumentation/

Relevant line:

Sentry.getCurrentHub().configureScope(scope => scope.setSpan(transaction));

[kudlav]

Sorry, I forgot to attach also root Sentry.startTransaction and Sentry.configureScope. I've added those into SDK Setup section. Looks pretty similar so I don't think the problem is in this line.

[lforst]

In your case you want to set workSpan on the scope. Are you doing that?

[kudlav]

Solved by calling Scope.setSpan(childSpan) after creating nested child span and calling Sentry.getCurrentHub().popScope(); after finishing nested span. The pop function was the key.

const childSpan = span.startChild({ op });
Sentry.getCurrentHub().getScope()?.setSpan(childSpan);
// doSomething
childSpan.finish();
Sentry.getCurrentHub().popScope();